Fix kanban colum width and make that header follow the body

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
 #############################################################################

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",

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;