Row Fold
parent
97170673fa
commit
e1362e84d4
|
@ -2,7 +2,7 @@ div.taskboard-table
|
|||
div.taskboard-table-header
|
||||
div.taskboard-table-inner(tg-taskboard-row-width-fixer)
|
||||
h2.task-colum-name "User story"
|
||||
//- Add class .colum-hfold in .task-column
|
||||
//- TODO Add class .colum-fold in .task-column
|
||||
h2.task-colum-name(ng-repeat="s in taskStatusList track by s.id",
|
||||
ng-style="{'border-top-color':s.color}", tg-bo-title="s.name")
|
||||
span(tg-bo-bind="s.name")
|
||||
|
@ -11,8 +11,11 @@ div.taskboard-table
|
|||
|
||||
div.taskboard-table-body(tg-taskboard-table-height-fixer)
|
||||
div.taskboard-table-inner(tg-taskboard-row-width-fixer)
|
||||
div.task-row(ng-repeat="us in userstories track by us.id", ng-class="{blocked: us.is_blocked}")
|
||||
//- TODO: Add class .row-fold in .task-column
|
||||
div.task-row.row-fold(ng-repeat="us in userstories track by us.id", ng-class="{blocked: us.is_blocked}")
|
||||
div.taskboard-userstory-box.task-column(tg-bo-title="us.blocked_note")
|
||||
a.icon.icon-vfold.vfold(href="", title="Fold Row")
|
||||
a.icon.icon-vunfold.vunfold.hidden(href="", title="Unfold Row")
|
||||
h3.us-title
|
||||
a(href="", tg-nav="project-userstories-detail:project=project.slug,ref=us.ref",
|
||||
tg-bo-title="'#' + us.ref + ' ' + us.subject")
|
||||
|
@ -21,20 +24,21 @@ div.taskboard-table
|
|||
p.points-value
|
||||
span(ng-bind="us.total_points")
|
||||
span points
|
||||
include ../components/addnewtask.jade
|
||||
//- Add class .colum-hfold in .task-column
|
||||
include ../components/addnewtask
|
||||
//- TODO: Add class .colum-fold in .task-column
|
||||
div.taskboard-tasks-box.task-column(ng-repeat="st in taskStatusList track by st.id",
|
||||
tg-taskboard-sortable)
|
||||
div.taskboard-task(ng-repeat="task in usTasks[us.id][st.id] track by task.id",
|
||||
tg-taskboard-task)
|
||||
include ../components/taskboard-task
|
||||
|
||||
div.task-row(ng-init="us = null")
|
||||
//- TODO: Add class .row-fold in .task-Column
|
||||
div.task-row.row-fold(ng-init="us = null")
|
||||
div.taskboard-userstory-box.task-column
|
||||
h3.us-title
|
||||
span Unassigned tasks
|
||||
include ../components/addnewtask.jade
|
||||
//- Add class .colum-hfold in .task-column
|
||||
//- TODO Add class .colum-fold in .task-column
|
||||
div.taskboard-tasks-box.task-column(ng-repeat="st in taskStatusList track by st.id",
|
||||
tg-taskboard-sortable)
|
||||
div.taskboard-task(ng-repeat="task in usTasks[null][st.id] track by task.id",
|
||||
|
|
|
@ -63,7 +63,7 @@ $column-margin: 0 10px 0 0;
|
|||
opacity: 0;
|
||||
}
|
||||
}
|
||||
&.column-hfold {
|
||||
&.column-fold {
|
||||
@include align-items(center);
|
||||
@include justify-content(center);
|
||||
max-width: $column-folded-width;
|
||||
|
@ -95,7 +95,7 @@ $column-margin: 0 10px 0 0;
|
|||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
&.colum-hfold {
|
||||
&.colum-fold {
|
||||
max-width: $column-folded-width;
|
||||
width: $column-folded-width;
|
||||
.taskboard-task {
|
||||
|
@ -152,25 +152,71 @@ $column-margin: 0 10px 0 0;
|
|||
background: rgba($red, .1);
|
||||
}
|
||||
}
|
||||
&.row-fold {
|
||||
min-height: 0;
|
||||
.taskboard-userstory-box {
|
||||
.us-title {
|
||||
@include ellipsis(100%);
|
||||
}
|
||||
.points-value,
|
||||
.icon-plus,
|
||||
.icon-bulk {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.task-column {
|
||||
@include table-flex();
|
||||
@include flex-direction(row);
|
||||
}
|
||||
.taskboard-task {
|
||||
background: none;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
max-width: 40px;
|
||||
min-height: 0;
|
||||
width: 40px;
|
||||
.taskboard-task-inner {
|
||||
padding: .2rem;
|
||||
}
|
||||
.taskboard-tagline,
|
||||
.taskboard-text {
|
||||
display: none;
|
||||
}
|
||||
.avatar {
|
||||
height: 35px;
|
||||
width: 35px;
|
||||
}
|
||||
.icon {
|
||||
display: none;
|
||||
}
|
||||
&.ui-sortable-helper {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.taskboard-tasks-box {
|
||||
background: $whitish;
|
||||
}
|
||||
|
||||
.taskboard-userstory-box {
|
||||
padding: .5rem;
|
||||
padding: .5rem .5rem .5rem 1.5rem;
|
||||
.icon {
|
||||
@include transition(color .2s linear);
|
||||
color: $gray-light;
|
||||
position: absolute;
|
||||
right: .5rem;
|
||||
top: 1rem;
|
||||
top: .7rem;
|
||||
&:hover {
|
||||
color: $green-taiga;
|
||||
}
|
||||
&.icon-plus {
|
||||
right: 2rem;
|
||||
}
|
||||
&.icon-vfold {
|
||||
left: 0;
|
||||
right: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue