taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Category config color rectangles

stable
Xavier Julián 2014-07-21 11:36:43 +02:00
parent f699f31a34
commit 7da22c5c95
2 changed files with 35 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/partials/views/modules/category-config.jade
View File

@ -8,24 +8,31 @@ div.category-config-list
div.resume
div.resume-title Attachments
div.count 2/7
div.progress
span(style='width: 50%')
div.summary-role
div.role-summary-single.active
div.role-summary-single.inactive
div.role-summary-single.inactive
div.role-summary-single.active
div.role-summary-single.inactive
div.role-summary-single.inactive
div.icon.icon-arrow-bottom
div.category-config
div.resume
div.resume-title User stories
div.count 2/7
div.progress
span(style='width: 20%')
div.summary-role
div.role-summary-single.active
div.role-summary-single.inactive
div.icon.icon-arrow-bottom
div.category-config
div.resume
div.resume-title Issues
div.count 2/7
div.progress
span(style='width: 75%')
div.summary-role
div.role-summary-single.active
div.role-summary-single.inactive
div.icon.icon-arrow-up
div.category-items
div.category-item
@ -58,6 +65,7 @@ div.category-config-list
div.resume
div.resume-title User stories
div.count 2/7
div.progress
span(style='width: 20%')
div.summary-role
div.role-summary-single.active
div.role-summary-single.inactive
div.icon.icon-arrow-bottom

34
app/styles/modules/category-config.scss
View File

@ -4,36 +4,38 @@
border-top: 1px solid $gray-light;
}
.resume {
@include table-flex();
cursor: pointer;
display: flex;
padding: 1rem;
position: relative;
}
.resume-title {
line-height: 28px;
width: 280px;
@include table-flex-child(1, 280px, 0);
}
.count {
@include table-flex-child(1, 0, 0);
color: $gray-light;
line-height: 28px;
}
.progress {
background-color: $whitish;
margin-left: 1rem;
padding: 4px;
width: 220px;
span {
background-color: #9fcf0f;
display: block;
.summary-role {
@include table-flex-child(3, 280px, 0);
.role-summary-single {
background: $gray-light;
display: inline-block;
height: 20px;
margin-right: .1rem;
width: 15px;
&.active {
background: $green-taiga;
}
&.inactive {
background: $gray;
}
}
}
.icon {
@include table-flex-child(1, 0, 0);
@extend %xlarge;
line-height: 28px;
position: absolute;
right: 1rem;
top: 1rem;
text-align: right;
}
.category-items {
background-color: $whitish;