backlog minor fixes

app/styles/modules/backlog-table.scss

@@ -1,28 +1,11 @@
 .backlog-table {
-    align-content: stretch;
-    align-items: center;
-    display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
-    justify-content: flex-start;
+    @include table-flex();
     width: 100%;
     .row {
-        align-content: stretch;
-        align-items: stretch;
-        display: flex;
-        flex-direction: row;
-        flex-wrap: nowrap;
-        justify-content: flex-start;
+        @include table-flex();
         padding: 1rem 0 1rem 1rem;
         text-align: left;
         width: 100%;
-        @for $i from 1 through 8 {
-            .width-#{$i} {
-                flex-basis: 50px;
-                flex-grow: $i;
-                flex-shrink: 0;
-            }
-        }
         &:hover {
             background: lighten($green-taiga, 60%);
             @include transition (background .2s ease-in);
@@ -50,7 +33,6 @@
             white-space: nowrap;
         }
         .icon {
-            @extend %medium;
             color: $gray-light;
             &:hover {
                 color: $grayer;
@@ -62,12 +44,25 @@
         display: none;
         margin-top: .3rem;
     }
-    .title {
+    .backlog-table-header {
         @extend %medium;
         font-family: 'DroidSans-Bold';
+    }
+    .backlog-table-header,
+    .sub-title,
+    .table-main {
         &:hover {
             background: transparent;
         }
+        .user-stories {
+            @include table-flex-child(20, 100px, 0, 0);
+        }
+        .status {
+            @include table-flex-child(2, 100px, 0, 0);
+        }
+        .points {
+            @include table-flex-child(1, 100px, 0, 0);
+        }
     }
     .sub-title {
         @extend %small;

app/views/modules/backlog-table.jade

@@ -1,16 +1,16 @@
 section.backlog-table
-    div.row.title
-        div.user-stories.width-4 User Stories
-        div.status.width-2 Status
-        div.points.width-1 Points
-        div.points.width-1
+    div.row.backlog-table-header
+        div.user-stories User Stories
+        div.status Status
+        div.points Points
+        div.points
       div.row.sub-title
         div.user-stories.width-4
         div.status.width-2
         div.points.width-1 Front
         div.points.width-1 Total
     div.row.table-main.blocked
-        div.user-stories.width-4
+        div.user-stories
             div.user-story-name
                 input(type="checkbox", name="")
                 a(href="") Crear el perfil de usuario Senior en el admin
@@ -29,7 +29,7 @@ section.backlog-table
                     a(href="", title="Status 2") Status 2
                 li
                     a(href="", title="Status 3") Status 3
-        div.points.width-1
+        div.points
             a(href="", title="Front") 24
             ul.popover.pop-points-open
                 li
@@ -56,7 +56,7 @@ section.backlog-table
                     a(href="", title="100") 100
                 li
                     a(href="", title="?") ?
-        div.points.width-1
+        div.points
             a(href="", title="Total Points") 43
             ul.popover.pop-status
                 li
@@ -68,7 +68,7 @@ section.backlog-table
     hr.doom-line
     - for (var x = 0; x < 50; x++)
         div.row.table-main
-            div.user-stories.width-4
+            div.user-stories
                 div.user-story-name
                     input(type="checkbox", name="")
                     a(href="") Crear el perfil de usuario Senior en el admin
@@ -78,6 +78,7 @@ section.backlog-table
                 div.user-story-tags
                     - for(var y = 0; y < 3; y++)
                         include ../components/tag
-            div.status.width-2 Status
-            div.points.width-1 12
-            div.points.width-1 54
+            div.status Status
+            div.points 12
+            div.points 54
+            a.icon.icon-drag-v(href="", title="Drag")