Commit c8ed33fdea1472f998460f4d126b0b96656eb2da

Authored by Victor Costa
1 parent 8b653c66

Improve text colors

src/app/components/noosfero-articles/article/article.html
1   -<div class="page-header">
2   - <h3 ng-bind="vm.article.title"></h3>
3   -</div>
  1 +<div class="article">
  2 + <div class="page-header">
  3 + <h3 ng-bind="vm.article.title"></h3>
  4 + </div>
4 5  
5   -<div class="sub-header clearfix">
6   - <div class="page-info pull-right small text-muted">
7   - <span class="time">
8   - <i class="fa fa-clock-o"></i> <span am-time-ago="vm.article.created_at"></span>
9   - </span>
10   - <span class="author" ng-if="vm.article.author">
11   - <i class="fa fa-user"></i>
12   - <a ui-sref="main.profile({profile: vm.article.author.identifier})">
13   - <span class="author-name" ng-bind="vm.article.author.name"></span>
14   - </a>
15   - </span>
  6 + <div class="sub-header clearfix">
  7 + <div class="page-info pull-right small text-muted">
  8 + <span class="time">
  9 + <i class="fa fa-clock-o"></i> <span am-time-ago="vm.article.created_at"></span>
  10 + </span>
  11 + <span class="author" ng-if="vm.article.author">
  12 + <i class="fa fa-user"></i>
  13 + <a ui-sref="main.profile({profile: vm.article.author.identifier})">
  14 + <span class="author-name" ng-bind="vm.article.author.name"></span>
  15 + </a>
  16 + </span>
  17 + </div>
16 18 </div>
17   -</div>
18 19  
19   -<div class="page-body">
20   - <div ng-bind-html="vm.article.body"></div>
  20 + <div class="page-body">
  21 + <div ng-bind-html="vm.article.body"></div>
  22 + </div>
21 23 </div>
... ...
src/app/components/noosfero-articles/article/article.scss
1   -.page-info {
2   - .author {
3   - a {
4   - color: #b4bcc2;
  1 +.article {
  2 + .page-info {
  3 + .author {
  4 + a {
  5 + color: #b4bcc2;
  6 + }
5 7 }
6 8 }
7   -}
8 9  
9   -.page-header {
10   - margin-bottom: 5px;
11   -}
  10 + .page-header {
  11 + margin-bottom: 5px;
  12 + }
12 13  
13   -.sub-header {
14   - margin-bottom: 20px;
  14 + .sub-header {
  15 + margin-bottom: 20px;
  16 + }
15 17 }
... ...
src/app/components/noosfero-articles/blog/blog.html
1   -<div class="blog-cover" ng-show="vm.article.image">
2   - <img ng-src="{{vm.article.image.url}}" class="img-responsive">
3   - <h3 ng-bind="vm.article.title"></h3>
4   -</div>
  1 +<div class="blog">
  2 + <div class="blog-cover" ng-show="vm.article.image">
  3 + <img ng-src="{{vm.article.image.url}}" class="img-responsive">
  4 + <h3 ng-bind="vm.article.title"></h3>
  5 + </div>
5 6  
6   -<div class="page-header" ng-show="!vm.article.image">
7   - <h3 ng-bind="vm.article.title"></h3>
8   -</div>
  7 + <div class="page-header" ng-show="!vm.article.image">
  8 + <h3 ng-bind="vm.article.title"></h3>
  9 + </div>
9 10  
10   -<div>
11   - <div ng-repeat="child in vm.article.children | orderBy: 'created_at':true">
12   - <div class="page-header">
13   - <a ui-sref="main.profile.page({profile: vm.profile.identifier, page: child.path})"><h4 ng-bind="child.title"></h4></a>
14   - <div ng-bind-html="child.body | truncate: 500: '...'"></div>
  11 + <div>
  12 + <div ng-repeat="child in vm.article.children | orderBy: 'created_at':true">
  13 + <div class="page-header">
  14 + <a class="title" ui-sref="main.profile.page({profile: vm.profile.identifier, page: child.path})"><h4 ng-bind="child.title"></h4></a>
  15 + <div class="post-lead" ng-bind-html="child.body | truncate: 500: '...'"></div>
  16 + </div>
15 17 </div>
16 18 </div>
17 19 </div>
... ...
src/app/components/noosfero-articles/blog/blog.scss
1   -.blog-cover {
2   - margin: -15px;
3   - position: relative;
4   - h3 {
5   - position: absolute;
6   - bottom: 0;
7   - background-color: rgba(0, 0, 0, 0.4);
8   - color: white;
9   - padding: 10px 15px;
10   - margin: 0;
11   - width: 100%;
  1 +.blog {
  2 + .blog-cover {
  3 + margin: -15px;
  4 + position: relative;
  5 + h3 {
  6 + position: absolute;
  7 + bottom: 0;
  8 + background-color: rgba(0, 0, 0, 0.4);
  9 + color: white;
  10 + padding: 10px 15px;
  11 + margin: 0;
  12 + width: 100%;
  13 + }
12 14 }
13 15 }
... ...
src/app/components/noosfero-blocks/link-list/link-list.html
1   -<div ng-repeat="link in vm.links">
2   - <a ng-href="{{link.address | noosferoTemplateFilter:{profile: vm.owner.identifier} }}">
3   - <i class="fa fa-fw icon-{{link.icon}}"></i> <span>{{link.name}}</span>
4   - </a>
  1 +<div class="link-list-block">
  2 + <div ng-repeat="link in vm.links">
  3 + <a ng-href="{{link.address | noosferoTemplateFilter:{profile: vm.owner.identifier} }}">
  4 + <i class="fa fa-fw icon-{{link.icon}}"></i> <span>{{link.name}}</span>
  5 + </a>
  6 + </div>
5 7 </div>
... ...
src/app/components/noosfero-blocks/link-list/link-list.scss
... ... @@ -25,3 +25,10 @@
25 25 .icon-save {
26 26 @extend .fa-save;
27 27 }
  28 +
  29 +.link-list-block {
  30 + a i {
  31 + line-height: 25px;
  32 + color: #949494;
  33 + }
  34 +}
... ...
src/app/components/noosfero-blocks/profile-image/profile-image.html
1   -<div class="center-block text-center">
2   - <div class="profile-image">
3   - <a ui-sref="main.profile.info({profile: vm.owner.identifier})">
4   - <noosfero-profile-image profile="vm.owner"></noosfero-profile-image>
5   - </a>
6   - </div>
7   - <div class='admin-link'>
8   - <a target="_self" ui-sref="main.profile.settings({profile: vm.owner.identifier})">Control panel</a>
9   - </div>
  1 +<div class="center-block text-center profile-image-block">
  2 + <a ui-sref="main.profile.info({profile: vm.owner.identifier})">
  3 + <noosfero-profile-image profile="vm.owner"></noosfero-profile-image>
  4 + </a>
  5 + <a class="settings-link" target="_self" ui-sref="main.profile.settings({profile: vm.owner.identifier})">Control panel</a>
10 6 </div>
... ...
src/app/components/noosfero-blocks/profile-image/profile-image.scss
1   -.profile-image {
2   - i {
3   - color: rgb(44, 62, 80);
  1 +.profile-image-block {
  2 + .settings-link {
  3 + display: block;
4 4 }
5 5 }
... ...
src/app/components/noosfero/profile-image/profile-image.html
1   -<img ng-if="vm.profile.image" ng-src="{{vm.profile.image.url}}" class="img-responsive">
2   -<i ng-if="!vm.profile.image" class="fa {{vm.defaultIcon}} fa-5x"></i>
  1 +<img ng-if="vm.profile.image" ng-src="{{vm.profile.image.url}}" class="img-responsive profile-image">
  2 +<i ng-if="!vm.profile.image" class="fa {{vm.defaultIcon}} fa-5x profile-image"></i>
... ...
src/app/components/noosfero/profile-image/profile-image.scss 0 → 100644
... ... @@ -0,0 +1,3 @@
  1 +i.profile-image {
  2 + color: rgb(44, 62, 80);
  3 +}
... ...
src/app/index.scss
... ... @@ -9,6 +9,8 @@ $fa-font-path: &quot;../../bower_components/font-awesome/fonts&quot;;
9 9  
10 10 $navbar-height: 50px;
11 11 $brand-success: #1E96D0;
  12 +$text-color: #676767;
  13 +$panel-default-text: rgb(44, 62, 80);
12 14 $link-color: #007EBB;
13 15 $body-bg: #f5f8fa;
14 16 $page-header-border-color: #eee;
... ... @@ -36,6 +38,10 @@ $page-header-border-color: #eee;
36 38 }
37 39 }
38 40  
  41 +h1, h2, h3, h4, h5 {
  42 + color: #237394;
  43 +}
  44 +
39 45 /**
40 46 * Do not remove the comments below. It's the markers used by gulp-inject to inject
41 47 * all your sass files automatically
... ...