Commit 5070aa0d34fa9f3fdfe4f8319416f53274358720
1 parent
b8cf9be2
Exists in
profile-blocks-sass
First communities block sass adjusts. Needs more adjusts
Showing
4 changed files
with
44 additions
and
3 deletions
Show diff stats
src/app/layout/blocks/communities/communities-block.html
1 | 1 | <div class="communities-block"> |
2 | 2 | <a ng-repeat="profile in ctrl.profiles" ui-sref="main.profile.home({profile: profile.identifier})" class="profile"> |
3 | - <noosfero-profile-image [profile]="profile"></noosfero-profile-image> | |
3 | + <noosfero-profile-image [profile]="profile" [showDetails]="true"></noosfero-profile-image> | |
4 | 4 | </a> |
5 | 5 | </div> | ... | ... |
src/app/layout/blocks/communities/communities-block.scss
1 | 1 | .communities-block { |
2 | 2 | .profile { |
3 | - margin: 10px; | |
3 | + // margin: 10px; | |
4 | + | |
5 | + #profile-image-container { | |
6 | + float: left; | |
7 | + text-align: center; | |
8 | + | |
9 | + .profile-image-wrap { | |
10 | + float: left; | |
11 | + margin-left: 10px; | |
12 | + width: 130px; | |
13 | + height: 130px; | |
14 | + } | |
15 | + } | |
16 | + | |
4 | 17 | img, i.profile-image { |
5 | - width: 60px; | |
18 | + width: 80px; | |
19 | + height: 80px; | |
20 | + overflow: hidden; | |
21 | + border-radius: 50%; | |
22 | + background-clip: padding-box; | |
6 | 23 | } |
7 | 24 | img { |
8 | 25 | display: inline-block; |
... | ... | @@ -12,5 +29,21 @@ |
12 | 29 | text-align: center; |
13 | 30 | font-size: 4.5em; |
14 | 31 | } |
32 | + .details { | |
33 | + | |
34 | + margin-top: -25px; | |
35 | + | |
36 | + > .profile-name { | |
37 | + font-size: 11pt; | |
38 | + font-weight: 600; | |
39 | + a { | |
40 | + list-style: none; | |
41 | + color: #212121; | |
42 | + &:hover { | |
43 | + color: $primary-color; | |
44 | + } | |
45 | + } | |
46 | + } | |
47 | + } | |
15 | 48 | } |
16 | 49 | } | ... | ... |
src/app/profile/image/image.component.ts
src/app/profile/image/image.html
... | ... | @@ -5,6 +5,11 @@ |
5 | 5 | <div ng-if="ctrl.editable" class="upload-camera-container"> |
6 | 6 | <i id="camera" class="fa fa-camera upload-camera" aria-hidden="true"></i> |
7 | 7 | </div> |
8 | + <div class="details"> | |
9 | + <div class="profile-name"> | |
10 | + <a href="#">{{ ctrl.profile.name }}</a> | |
11 | + </div> | |
12 | + </div> | |
8 | 13 | <div ng-if="ctrl.editable" id="select-photo-container" name="select-photo-container" class="select-photo-container container" ng-class="ctrl.editClass"> |
9 | 14 | <a id="upload-container" class="upload-container" href="#" rel="dialog" role="button"> |
10 | 15 | <!-- The upload button hidden behind the camera --> | ... | ... |