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

Fixed rows flexbox and margins in taskboard

stable
Xavier Julián 2014-06-25 12:55:49 +02:00
parent 4d0c35fc56
commit 68a65f2ab3
4 changed files with 23 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/coffee/modules/taskboard.coffee
View File

@ -107,9 +107,9 @@ TaskboardDirective = ->
TaskboardTaskrowDirective = -> TaskboardTaskrowDirective = ->
itemSize = 300
link = ($scope, $el, $attrs) -> link = ($scope, $el, $attrs) ->
taiga.bindOnce $scope, "statusList", (statuses) -> taiga.bindOnce $scope, "statusList", (statuses) ->
itemSize = 300 + (10 * statuses.length)
size = (1 + statuses.length) * itemSize size = (1 + statuses.length) * itemSize
$el.css("width", size + "px") $el.css("width", size + "px")

3
app/partials/views/components/backlog-row.jade
View File

@ -7,8 +7,7 @@ div.row.us-item-row(ng-repeat="us in visibleUserstories track by us.id")
a.icon.icon-edit(href="", ng-click="ctrl.editUserStory(us)", title="Edit") a.icon.icon-edit(href="", ng-click="ctrl.editUserStory(us)", title="Edit")
a.icon.icon-delete(href="", ng-click="ctrl.deleteUserStory(us)", title="Delete") a.icon.icon-delete(href="", ng-click="ctrl.deleteUserStory(us)", title="Delete")
div.user-story-tags div.user-story-tags
span.tag(ng-repeat="tag in us.tags") span.tag(ng-repeat="tag in us.tags") {{ tag }}
{{ tag }}
div.status Status div.status Status
div.points 12 div.points 12
div.points 54 div.points 54

57
app/partials/views/modules/taskboard-table.jade
View File

@ -11,49 +11,18 @@ div.taskboard-table
- for(var y = 0; y < 5; y++) - for(var y = 0; y < 5; y++)
include ../components/tag include ../components/tag
h3.task-title h3.task-title
span.task-num 125 span.task-num 125
span Invitacion de los usuarios a la plataforma span Invitacion de los usuarios a la plataforma
ul.task-list ul.task-list
li.task-status Open li.task-status Open
li UX li UX
span 4.5 span 4.5
li Diseño li Diseño
span 4.5 span 4.5
li Front li Front
span 4.5 span 4.5
li Back li Back
span 4.5 span 4.5
include ../components/addnewus include ../components/addnewus
div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id") div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id")
include ../components/taskboard-task include ../components/taskboard-task
//
div.taskboard-table
div.taskboard-table-header
div.taskboard-table-inner
h2.task-colum_name "User story"
h2.task-colum_name(ng-repeat="s in statusList track by s.id", tg-bo-html="s.name")
div.taskboard-table-body
div.taskboard-table-inner
div.taskboard_task-list.task-column
div.task-row(ng-repeat="us in userstories track by us.id")
div.tag-list
- for(var y = 0; y < 5; y++)
include ../components/tag
h3.task-title
span.task-num 125
span Invitacion de los usuarios a la plataforma
ul.task-list
li.task-status Open
li UX
span 4.5
li Diseño
span 4.5
li Front
span 4.5
li Back
span 4.5
include ../components/addnewus
div.taskboard_task-playground.task-column(ng-repeat="s in statusList track by s.id")
div.task-row(ng-repeat="us in userstories track by us.id")
include ../components/taskboard-task

15
app/styles/modules/taskboard-table.scss
View File

@ -3,7 +3,7 @@
$column-width: 300px; $column-width: 300px;
$column-flex: 1; $column-flex: 1;
$column-shrink: 0; $column-shrink: 0;
$column-margin: 0 .3rem 0 0; $column-margin: 0 10px 0 0;
.taskboard-table { .taskboard-table {
@ -25,6 +25,9 @@ $column-margin: 0 .3rem 0 0;
margin: $column-margin; margin: $column-margin;
padding: .5rem 0; padding: .5rem 0;
text-align: center; text-align: center;
&:last-child {
margin-right: 0;
}
} }
} }
@ -33,13 +36,13 @@ $column-margin: 0 .3rem 0 0;
overflow-x: scroll; overflow-x: scroll;
overflow-y: scroll; overflow-y: scroll;
width: 100%; width: 100%;
.taskboard-table-inner {
overflow: hidden;
}
.task-column { .task-column {
@include table-flex-child($column-flex, $column-width, $column-shrink, $column-width); @include table-flex-child($column-flex, $column-width, $column-shrink, $column-width);
margin: $column-margin; margin: $column-margin;
padding: 1rem; padding: 1rem;
&:last-child {
margin-right: 0;
}
} }
.task-row { .task-row {
@include table-flex(); @include table-flex();
@ -53,6 +56,7 @@ $column-margin: 0 .3rem 0 0;
} }
.taskboard_task-list { .taskboard_task-list {
position: relative;
.tag-list { .tag-list {
display: none; display: none;
margin-bottom: 1rem; margin-bottom: 1rem;
@ -76,9 +80,6 @@ $column-margin: 0 .3rem 0 0;
margin-left: .5rem; margin-left: .5rem;
} }
} }
.task-row {
position: relative;
}
.new-us { .new-us {
bottom: 2rem; bottom: 2rem;
position: absolute; position: absolute;