diff --git a/app/modules/profile/profile-projects/profile-projects.jade b/app/modules/profile/profile-projects/profile-projects.jade index b5c015a9..3c3b0d76 100644 --- a/app/modules/profile/profile-projects/profile-projects.jade +++ b/app/modules/profile/profile-projects/profile-projects.jade @@ -11,6 +11,8 @@ section.profile-projects span.tag(style='border-left: 5px solid {{::tag.get("color")}};', tg-repeat="tag in ::project.get('colorized_tags')") span.tag-name {{::tag.get('name')}} + div.project-list-single-right + div.project-list-single-members a(tg-repeat="contact in ::project.get('contacts')", tg-nav="user-profile:username=contact.get('username')", title="{{::contact.get('full_name')}}") img(ng-src="{{::contact.get('photo')}}") diff --git a/app/modules/projects/listing/projects-listing.scss b/app/modules/projects/listing/projects-listing.scss index 5354288c..5041b59c 100644 --- a/app/modules/projects/listing/projects-listing.scss +++ b/app/modules/projects/listing/projects-listing.scss @@ -1,7 +1,7 @@ .project-list-single { border-bottom: 1px solid $whitish; display: flex; - justify-content: center; + justify-content: space-between; padding: .5rem; position: relative; } @@ -9,23 +9,18 @@ .project-list-single-left, .project-list-single-right { display: flex; - flex-direction: column; } .project-list-single-left { align-content: space-between; - flex: 4; + padding-right: 1rem; h1 { - @extend %text; - @extend %large; - display: inline-block; - margin-bottom: 0; - text-transform: none; - } - .project-name { @extend %text; @extend %larger; color: $gray; + display: inline-block; + margin-bottom: 0; + text-transform: none; vertical-align: middle; white-space: nowrap; } @@ -34,7 +29,6 @@ @extend %small; color: $gray; margin-bottom: 0; - max-width: 95%; } .project-list-single-tags { align-content: flex-end; @@ -73,13 +67,13 @@ .project-list-single-members { align-self: flex-end; display: flex; + flex-direction: row-reverse; flex-grow: 0; - flex-wrap: wrap; + flex-wrap: wrap-reverse; margin-top: 1rem; - max-width: 160px; + max-width: 200px; a { - display: block; - } + display: block; } img { margin-right: .3rem; width: 34px;