US #903: Task #1012: Compact and expanded US

stable
Xavier Julián 2014-09-15 17:28:21 +02:00 committed by Andrey Antukh
parent 51ec6ec3bf
commit 71f5087140
9 changed files with 143 additions and 37 deletions

Binary file not shown.

View File

@ -42,4 +42,6 @@
<glyph unicode="&#72;" d="M128 384l64 0 0-64-64 0z m0-96l64 0 0-64-64 0z m0-96l64 0 0-64-64 0z m128 0l128 0 0-64-128 0z m224 320l-448 0c-18 0-32-14-32-32l0-448c0-18 14-32 32-32l448 0c18 0 32 14 32 32l0 448c0 18-14 32-32 32z m-32-448l-384 0 0 384 384 0z m-192 224l128 0 0-64-128 0z m0 96l128 0 0-64-128 0z"/>
<glyph unicode="&#73;" d="M184 20c0 0 0 54 0 54 0 0 144 0 144 0 0 0 0-54 0-54-24-14-48-21-73-20-23-1-47 6-71 20m141 84c0 0-138 0-138 0 0 25-6 49-19 72-12 23-25 43-40 58-14 15-26 34-37 57-11 23-16 47-14 71 3 41 19 77 48 106 30 29 73 44 130 44 58 0 102-15 131-44 29-29 45-65 49-106 1-20-2-39-9-57-6-18-15-35-26-50-11-14-22-29-33-43-12-14-21-31-30-49-8-19-12-38-12-59m-193 254c-2-1-2-4 0-10 1-5 1-9 1-10-1-1 0-5 2-10 3-5 4-8 3-9 0-1 1-4 4-9 3-5 5-9 6-10 1-1 3-5 7-10 3-5 6-8 7-9 1-2 3-5 7-11 5-6 7-10 9-12 30-42 49-78 57-108 0 0 42 0 42 0 8 32 27 68 57 108 2 2 6 8 13 18 7 10 12 16 13 18 1 3 4 8 9 15 4 8 7 13 8 17 1 4 2 9 3 14 1 6 1 12 0 18-5 67-47 101-125 101-77 0-118-34-123-101"/>
<glyph unicode="&#69;" d="M480 224l-64 0c-18 0-32 14-32 32 0 18 14 32 32 32l64 0c18 0 32-14 32-32 0-18-14-32-32-32z m-88 122c-13-12-33-12-45 0-13 13-13 33 0 46l45 45c12 12 33 12 45 0 13-13 13-33 0-45z m-136-346c-18 0-32 14-32 32l0 64c0 18 14 32 32 32 18 0 32-14 32-32l0-64c0-18-14-32-32-32z m0 384c-18 0-32 14-32 32l0 64c0 18 14 32 32 32 18 0 32-14 32-32l0-64c0-18-14-32-32-32z m-136-309c-12-13-32-13-45 0-12 12-12 33 0 45l45 45c13 13 33 13 46 0 12-12 12-32 0-45z m0 271l-45 46c-12 12-12 32 0 45 13 12 33 12 45 0l46-45c12-13 12-33 0-46-13-12-33-12-46 0z m8-90c0-18-14-32-32-32l-64 0c-18 0-32 14-32 32 0 18 14 32 32 32l64 0c18 0 32-14 32-32z m264-91l45-45c13-12 13-33 0-45-12-13-33-13-45 0l-45 45c-13 13-13 33 0 45 12 13 32 13 45 0z"/>
<glyph unicode="&#74;" d="M184 54l24 145c1 3 0 5-2 7 0 0 0 0 0 0-2 2-5 3-7 3l-145-25c-3 0-5-2-6-5-1-3 0-7 2-9l28-28-76-76c-3-3-3-8 0-11l53-53c3-3 8-3 11 0l76 76 28-28c3-2 6-3 9-2 3 1 5 3 5 6z m144 404l-24-145c-1-3 0-5 2-7 0 0 0 0 0 0 2-2 5-3 7-3l145 25c3 0 5 2 6 5 1 3 0 7-2 9l-28 28 76 76c3 3 3 8 0 11l-53 53c-3 3-8 3-11 0l-76-76-28 28c-3 2-6 3-9 2-3-1-5-3-5-6z m130-274l-145 24c-3 1-5 0-7-2 0 0 0 0 0 0-2-2-3-5-3-7l25-145c0-3 2-5 5-6 3-1 7 0 9 2l28 28 76-76c3-3 8-3 11 0l53 53c3 3 3 8 0 11l-76 76 28 28c2 3 3 6 2 9-1 3-3 5-6 5z m-404 144l145-24c3-1 5 0 7 2 0 0 0 0 0 0 2 2 3 5 3 7l-25 145c0 3-2 5-5 6-3 1-6 0-9-2l-28-28-76 76c-3 3-8 3-11 0l-53-53c-3-3-3-8 0-11l76-76-28-28c-2-3-3-6-2-9 1-3 3-5 6-5z"/>
<glyph unicode="&#75;" d="M24 154l-24-144c0-3 1-6 2-8 0 0 0 0 0 0 2-1 5-2 8-2l144 25c3 0 6 2 6 5 1 3 1 6-2 8l-28 29 76 75c3 4 3 9 0 12l-52 52c-3 4-9 4-12 0l-76-75-28 28c-2 2-5 3-8 2-3-1-5-4-6-7z m464 204l24 144c0 3-1 6-2 8 0 0 0 0 0 0-2 1-5 2-8 2l-144-25c-3 0-6-2-6-5-1-3-1-6 2-8l28-29-76-75c-3-4-3-9 0-12l52-52c3-4 9-4 12 0l76 75 28-28c2-2 5-3 8-2 3 1 5 4 6 7z m-130-334l144-24c3 0 6 1 8 2 0 0 0 0 0 0 1 2 2 5 2 8l-25 144c0 3-2 6-5 6-3 1-6 1-8-2l-29-28-75 76c-4 3-9 3-12 0l-52-52c-4-3-4-9 0-12l75-76-28-28c-2-2-3-5-2-8 1-3 4-5 7-6z m-204 464l-144 24c-3 0-6-1-8-2 0 0 0 0 0 0-1-2-2-5-2-8l25-144c0-3 2-6 5-6 3-1 6-1 8 2l29 28 75-76c4-3 9-3 12 0l52 52c4 3 4 9 0 12l-75 76 28 28c2 2 3 5 2 8-1 3-4 5-7 6z"/>
</font></defs></svg>

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Binary file not shown.

View File

@ -4,10 +4,35 @@ div.kanban-task-inner
div.task-text
a.task-assigned(href="", title="Assign User Story")
span.task-num(tg-bo-ref="us.ref")
a.task-name(href="", title="", tg-bind-html="us.subject",
a.task-name(href="", tg-bo-title="us.subject", tg-bind-html="us.subject",
tg-nav="project-userstories-detail:project=project.slug,ref=us.ref")
p.task-points
ul.task-points-per-role
li
a(href="", title="Role Points")
span User Experience
span(tg-bind-html="us.total_points") --
span points
span.icon.icon-arrow-bottom
li
a(href="", title="Role Points")
span Design
span(tg-bind-html="us.total_points") --
span points
span.icon.icon-arrow-bottom
li
a(href="", title="Role Points")
span Front
span(tg-bind-html="us.total_points") --
span points
span.icon.icon-arrow-bottom
li
a(href="", title="Role Points")
span Back
span(tg-bind-html="us.total_points") --
span points
span.icon.icon-arrow-bottom
//-p.task-points
//- span(tg-bind-html="us.total_points") --
//- span points
a.icon.icon-edit(tg-check-permission="modify_us", href="", title="Edit")
a.icon.icon-drag-h(tg-check-permission="modify_us", href="", title="Drag&Drop")

View File

@ -4,14 +4,15 @@ div.kanban-table
h2.task-colum_name(ng-repeat="s in usStatusList track by s.id",
ng-style="{'border-top-color':s.color}")
span(tg-bo-bind="s.name")
a.icon.icon-minimize(href="", title="Add New task")
//-a.icon.icon-maximize(href="", title="Add New task")
a.icon.icon-plus(tg-check-permission="add_us", href="", title="Add New task", ng-click="ctrl.addNewUs('standard', s.id)")
a.icon.icon-bulk(tg-check-permission="add_us", href="", title="Add New bulk", ng-click="ctrl.addNewUs('bulk', s.id)")
div.kanban-table-body
div.kanban-table-inner(tg-kanban-row-width-fixer)
div.kanban-uses-box.task-column(ng-repeat="status in usStatusList track by status.id",
tg-kanban-sortable,
tg-kanban-wip-limit,
tg-kanban-column-height-fixer)
div.kanban-task(ng-repeat="us in usByStatus[status.id] track by us.id",
div.kanban-task.kanban-task-maximized(ng-repeat="us in usByStatus[status.id] track by us.id",
tg-kanban-userstory, ng-model="us")

View File

@ -28,20 +28,18 @@
}
.kanban-tagline {
@include table-flex();
background: $gray-light; //Fallback
height: .3rem;
background: $postit-hover; //Fallback
//height: .3rem;
}
.kanban-tag {
@include table-flex-child(1, 0, 0, 0);
background: $postit-hover; //Fallback
height: .3rem;
//height: .3rem;
}
.kanban-task-inner {
@include table-flex();
padding: 1rem 1rem 2rem;
}
.avatar {
@include table-flex-child($flex-basis: 50px);
a {
@extend %small;
text-align: center;
@ -69,37 +67,24 @@
color: $postit-dark-hover;
display: block;
}
.task-text {
@include table-flex-child($flex-grow: 10, $flex-basis: 50px);
@extend %small;
padding: 0 .5rem 0 .8rem;
word-wrap: break-word;
}
.task-num {
color: $grayer;
margin-right: .5em;
margin-right: .3rem;
}
.task-name {
@extend %bold;
color: $grayer;
word-wrap: break-word;
}
.task-text {
@include table-flex-child($flex-grow: 10, $flex-basis: 50px);
@extend %small;
padding: 0 .5rem 0 1rem;
word-wrap: break-word;
}
.task-points {
@extend %small;
color: darken($postit-hover, 15%);
margin: 0;
span {
display: inline-block;
&:first-child {
padding-right: .2rem;
}
}
}
.icon-edit,
.icon-drag-h {
@include transition(opacity .2s linear);
@extend %large;
bottom: .2rem;
color: $postit-hover;
opacity: 0;
position: absolute;
@ -108,12 +93,95 @@
color: darken($postit-hover, 15%);
}
}
}
.kanban-task-maximized {
.kanban-task-inner {
padding: 1rem 1rem 2rem;
}
.avatar {
@include table-flex-child($flex-basis: 50px);
}
.task-name {
word-wrap: break-word;
}
.icon-edit {
bottom: .2rem;
right: .5rem;
}
.icon-drag-h {
@extend %xlarge;
bottom: .2rem;
cursor: move;
right: 45%;
}
.task-points-per-role {
@extend %small;
margin: 0;
a {
@include transition(color .2s linear);
color: darken($postit-hover, 15%);
&:hover {
@include transition(color .2s linear);
color: darken($postit-hover, 30%);
}
}
span {
display: inline-block;
padding-left: .2rem;
&:first-child {
color: darken($postit-hover, 30%);
padding-left: 0;
padding-right: .2rem;
}
}
}
.kanban-tagline {
height: .3rem;
}
.kanban-tag {
height: .3rem;
}
}
.kanban-task-minimized {
.kanban-task-inner {
padding: .3rem;
}
.avatar {
@include table-flex-child($flex-basis: 40px);
}
.task-num {
vertical-align: top;
}
.task-name {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 70%;
}
.task-points-per-role {
display: none;
}
.icon-edit,
.icon-drag-h {
top: 1.4rem;
}
.icon-edit {
bottom: .2rem;
right: 1rem;
}
.icon-drag-h {
@extend %medium;
@include transform(rotate(90deg));
cursor: move;
right: .1rem;
}
.kanban-tagline {
height: .2rem;
}
.kanban-tag {
height: .2rem;
}
}

View File

@ -88,7 +88,7 @@ p {
img {
margin: 0;
}
}
}
em { font-style: italic; }
strong {
@ -247,3 +247,9 @@ a:visited {
.icon-spinner:before {
content: 'E';
}
.icon-minimize:before {
content: 'J';
}
.icon-maximize:before {
content: 'K';
}

View File

@ -44,6 +44,11 @@ $column-margin: 0 10px 0 0;
&.icon-plus {
right: 2rem;
}
&.icon-maximize,
&.icon-minimize {
left: .5rem;
right: inherit;
}
}
}
}
@ -51,7 +56,6 @@ $column-margin: 0 10px 0 0;
.kanban-table-body {
@include table-flex();
@extend %medium;
//height: 700px;
overflow: hidden;
overflow-x: auto;
width: 100%;