Projects Page

stable
Xavier Julián 2015-05-05 15:26:23 +02:00 committed by Juanfran
parent e399999750
commit 1ee92e9909
5 changed files with 110 additions and 47 deletions

View File

@ -34,14 +34,6 @@
vertical-align: middle;
white-space: nowrap;
}
.private {
display: inline-block;
margin-left: .3rem;
width: .5rem;
path {
fill: $gray-light;
}
}
}
p {
@extend %text;

View File

@ -29,15 +29,6 @@
vertical-align: middle;
white-space: nowrap;
}
.private {
display: inline-block;
margin-left: .3rem;
width: .5rem;
path {
fill: $gray-light;
transition: fill .3s linear;
}
}
p {
@extend %text;
@extend %small;

View File

@ -2,9 +2,30 @@ doctype html
div.wrapper(ng-controller="ProjectController as ctrl")
nav.menu.hidden(tg-project-menu)
section.main.single-project
div.main.centered.single-project
section.single-project-intro
h1
span.green(tg-bo-bind="project.name", class="project-name")
span.private(ng-if="project.is_private", title="{{'PROJECT.PRIVATE' | translate}}")
include ../../svg/lock.svg
p.description(tg-bo-bind="project.description")
div.project-list-single-tags.tags-container(ng-if="::project.tags")
div.tags-block(tg-colorize-tags="project.tags", tg-colorize-tags-type="backlog")
div.project-data
section.timeline
span TODO. Missing the amazing timeline around!!
section.involved-data
h2.title Team
ul.involved-team
a(href="", title="{{member.full_name}}", ng-repeat="member in project.memberships")
img(tg-bo-src="member.photo", alt="{{member.full_name}}")
h2.title Organizations
div.involved-organization
a(href="", title="User Name")
img(src="https://s3.amazonaws.com/uifaces/faces/twitter/dan_higham/48.jpg", alt="{{member.full_name}}")
//
div.summary
div.summary-stats
span.number(ng-bind="stats.total_points") --

View File

@ -0,0 +1,9 @@
.private {
display: inline-block;
margin-left: .3rem;
width: .5rem;
path {
fill: $gray-light;
transition: fill .3s linear;
}
}

View File

@ -1,34 +1,84 @@
.summary-stats {
align-items: flex-start;
.single-project {
h1 {
line-height: 1.2;
margin: 0;
vertical-align: middle;
}
.private {
font-size: 1rem;
vertical-align: super;
}
.project-data {
display: flex;
.info-num {
@extend %xlarge;
@extend %bold;
float: left;
margin-right: .3rem;
position: relative;
top: 5px;
}
.info-text {
@extend %small;
float: left;
line-height: .9rem;
}
}
.project-data-container {
.title {
@extend %larger;
@extend %title;
align-content: center;
background: $whitish;
display: flex;
justify-content: space-between;
ul {
flex-grow: 0;
max-width: 33%;
margin-bottom: .5rem;
padding: .9rem 1rem;
}
li {
display: inline-block;
margin-right: .1rem;
width: 10%;
figure {
.timeline {
flex: 1;
margin-right: 1rem;
}
.involved-data {
flex-basis: 200px;
}
.involved-team,
.involved-organization {
display: flex;
flex-wrap: wrap;
margin-bottom: 1rem;
a {
display: block;
margin-right: .14rem;
width: 24%;
&:nth-child(4n) {
margin-right: 0;
}
}
img {
width: 100%;
}
}
}
//.summary-stats {
// align-items: flex-start;
// display: flex;
// .info-num {
// @extend %xlarge;
// @extend %bold;
// float: left;
// margin-right: .3rem;
// position: relative;
// top: 5px;
// }
// .info-text {
// @extend %small;
// float: left;
// line-height: .9rem;
// }
//}
//
//.project-data-container {
// display: flex;
// justify-content: space-between;
// ul {
// flex-grow: 0;
// max-width: 33%;
// }
// li {
// display: inline-block;
// margin-right: .1rem;
// width: 10%;
// figure {
// width: 100%;
// }
// }
//}
//