Home projects list styles
parent
ae7cf6b663
commit
eb43006602
|
@ -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") ...
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
padding-top: 2rem;
|
||||
.duty-summary {
|
||||
flex: 1;
|
||||
margin-right: .5rem;
|
||||
margin-right: 2rem;
|
||||
}
|
||||
.project-list {
|
||||
width: 250px;
|
||||
|
|
|
@ -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")
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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;}
|
||||
|
|
Loading…
Reference in New Issue