diff --git a/app/coffee/modules/kanban/main.coffee b/app/coffee/modules/kanban/main.coffee index 7303bb3f..3a161524 100644 --- a/app/coffee/modules/kanban/main.coffee +++ b/app/coffee/modules/kanban/main.coffee @@ -200,12 +200,34 @@ module.controller("KanbanController", KanbanController) KanbanDirective = ($repo, $rootscope) -> link = ($scope, $el, $attrs) -> + + tableBodyDom = $el.find(".kanban-table-body") + tableBodyDom.on "scroll", (event) -> + target = angular.element(event.currentTarget) + tableHeaderDom = $el.find(".kanban-table-header .kanban-table-inner") + tableHeaderDom.css("left", -1 * target.scrollLeft()) + return {link: link} - module.directive("tgKanban", ["$tgRepo", "$rootScope", KanbanDirective]) +############################################################################# +## Kanban Row Size Fixer Directive +############################################################################# + +KanbanRowSizeFixer = -> + link = ($scope, $el, $attrs) -> + bindOnce $scope, "usStatusList", (statuses) -> + itemSize = 310 + size = (statuses.length * itemSize) - 10 + $el.css("width", "#{size}px") + + return {link: link} + +module.directive("tgKanbanRowSizeFixer", KanbanRowSizeFixer) + + ############################################################################# ## Taskboard Task Directive ############################################################################# diff --git a/app/partials/views/modules/kanban-table.jade b/app/partials/views/modules/kanban-table.jade index 97711c2a..2537c046 100644 --- a/app/partials/views/modules/kanban-table.jade +++ b/app/partials/views/modules/kanban-table.jade @@ -1,6 +1,6 @@ div.kanban-table div.kanban-table-header - div.kanban-table-inner + div.kanban-table-inner(tg-kanban-row-size-fixer) h2.task-colum_name(ng-repeat="s in usStatusList track by s.id", ng-style="{'border-top-color':s.color}") span(tg-bo-html="s.name") @@ -8,7 +8,7 @@ div.kanban-table a.icon.icon-bulk(href="", title="Add New bulk", ng-click="ctrl.addNewUs('bulk', s.id)") div.kanban-table-body - div.kanban-table-inner + div.kanban-table-inner(tg-kanban-row-size-fixer) div.kanban-uses-box.task-column(ng-repeat="status in usStatusList track by status.id", tg-kanban-sortable) div.kanban-task(ng-repeat="us in usByStatus[status.id] track by us.id", diff --git a/app/styles/modules/kanban/kanban-table.scss b/app/styles/modules/kanban/kanban-table.scss index d157762c..10028710 100644 --- a/app/styles/modules/kanban/kanban-table.scss +++ b/app/styles/modules/kanban/kanban-table.scss @@ -21,7 +21,7 @@ $column-margin: 0 10px 0 0; } .task-colum_name { @include table-flex-child($column-flex, $column-width, $column-shrink, $column-width); - @extend %medium; + @extend %large; background: $whitish; border-top: 3px solid $gray-light; margin: $column-margin;