Home projects list styles

stable
Xavier Julián 2015-04-27 08:47:28 +02:00 committed by Juanfran
parent ae7cf6b663
commit eb43006602
6 changed files with 54 additions and 16 deletions

View File

@ -1,10 +1,7 @@
ul.home-project-list
li.home-project-list-single(tg-bind-scope, ng-repeat="project in vm.projects.all")
div.home-project-list-single-left
div.home-project-list-single-title
h2
a(href="#", ng-bind="::project.name", tg-nav="project:project=project.slug")
span {{project.is_private}}
p {{ ::project.description }}
div.home-project-list-single-right
h2.home-project-list-single-title
a(href="#", ng-bind="::project.name", tg-nav="project:project=project.slug")
span {{project.is_private}}
p {{ ::project.description | limitTo:150 }}
span(ng-if="::project.description.length > 150") ...

View File

@ -1,3 +1,38 @@
.home-project-list {
content: 'WIP';
li {
border-right: 5px solid $whitish;
cursor: pointer;
margin-bottom: .5rem;
padding: .5rem;
padding-right: 1rem;
text-overflow: ellipsis;
transition: border-color .3s linear;
&:hover {
border-color: $fresh-taiga;
p {
color: $gray;
}
}
}
h2 {
@extend %text;
color: $gray;
font-size: 1.5rem;
line-height: 1.3;
margin-bottom: 0;
text-transform: none;
a {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
p {
@extend %text;
@extend %small;
color: $gray-light;
margin: 0;
transition: color .3s linear;
}
}

View File

@ -3,7 +3,7 @@
padding-top: 2rem;
.duty-summary {
flex: 1;
margin-right: .5rem;
margin-right: 2rem;
}
.project-list {
width: 250px;

View File

@ -6,7 +6,7 @@ div.project-list-wrapper.centered
a.button-blackish.import-project-button(href="", title="{{'PROJECT.NAVIGATION.TITLE_ACTION_IMPORT' | translate}}")
span.icon.icon-upload
input.import-file.hidden(type="file")
section.project-list-section
div.project-list
ul.js-sortable
@ -16,7 +16,8 @@ div.project-list-wrapper.centered
h1
a(href="#", ng-bind="::project.name", tg-nav="project:project=project.slug")
span {{project.is_private}}
p {{ ::project.description }}
p {{ ::project.description | limitTo:300 }}
span(ng-if="::project.description.length > 300") ...
div.project-list-single-tags.tags-container(ng-if="project.tags")
div.tags-block(tg-colorize-tags="project.tags", tg-colorize-tags-type="backlog")

View File

@ -2,7 +2,7 @@
border-bottom: 1px solid $whitish;
display: flex;
justify-content: center;
padding: .8rem 1rem;
padding: .5rem;
position: relative;
}
@ -18,12 +18,16 @@
h1 {
@extend %text;
@extend %larger;
color: $gray;
margin-bottom: 0;
text-transform: none;
}
p {
color: $gray-light;
max-width: 70%;
@extend %text;
@extend %small;
color: $gray;
margin-bottom: 0;
max-width: 95%;
}
.project-list-single-tags {
align-content: flex-end;
@ -31,6 +35,7 @@
flex: 3;
flex-wrap: wrap;
justify-content: flex-start;
margin-top: .5rem;
}
.tag {
align-self: flex-end;

View File

@ -1,6 +1,6 @@
// __Font Sizes__ //
%xsmall {font-size: .5rem;}
%small {font-size: .8rem;}
%small {font-size: .9rem;}
%medium {font-size: 1rem;}
%large {font-size: 1.2rem;}
%larger {font-size: 1.6rem;}