Redesign project list view

assets/sass/_table_list.sass

@@ -1,28 +1,32 @@
 @import variables
 
-.task-list
+.table-list
   font-size: size('compact')
+  margin-bottom: 20px
 
-.task-list-header
+.table-list-header
   background: bg-color('primary')
   border: 1px solid #e5e5e5
   border-radius: 5px 5px 0 0
   line-height: 35px
   padding-left: 3px
   padding-right: 3px
-  .task-list-header-count
+  .table-list-header-count
     color: #767676
     display: inline-block
     float: left
-  .task-list-header-menu
+  .table-list-header-menu
     text-align: right
 
-.task-list-row
+.table-list-row
   padding-left: 3px
   padding-right: 3px
   border-bottom: 1px solid #e5e5e5
   border-right: 1px solid #e5e5e5
 
+  &.table-border-left
+    border-left: 1px solid #e5e5e5
+
   &:nth-child(odd)
     background: bg-color('lighter')
 
@@ -34,10 +38,11 @@
     border-bottom: 1px solid map-get($highlight-colors, 'border')
     border-right: 1px solid map-get($highlight-colors, 'border')
 
-  .task-list-title
+  .table-list-title
     font-weight: 500
-    &.task-closed
+    &.status-closed
       text-decoration: line-through
+      margin-right: 10px
       a
         font-style: italic
     a
@@ -46,21 +51,14 @@
       &:hover, &:focus
         text-decoration: underline
 
-  .task-list-details
+  .table-list-details
     color: color('light')
     font-weight: 300
     line-height: 30px
-
-  .task-list-avatars
-    display: inline-block
-    float: left
-    @include sm-device
-      float: none
-      display: block
-    .task-avatar-assignee
-      font-weight: 300
-      color: color('light')
-    &:hover
-      .task-avatar-assignee
-        font-weight:   400
-        color: color('dark')
+    li
+      display: inline
+      list-style-type: none
+      &:after
+        content: ', '
+      &:last-child:after
+        content: ''

assets/sass/_task_avatars.sass

@@ -0,0 +1,24 @@
+@import variables
+
+.task-board-avatars
+  text-align: right
+  float: right
+
+.task-board-change-assignee
+  &:hover
+    opacity: 0.6
+  cursor: pointer
+
+.task-list-avatars
+  display: inline-block
+  float: left
+  @include sm-device
+    float: none
+    display: block
+  .task-avatar-assignee
+    font-weight: 300
+    color: color('light')
+  &:hover
+    .task-avatar-assignee
+      font-weight:   400
+      color: color('dark')

assets/sass/_task_board_avatar.sass

@@ -1,10 +0,0 @@
-@import variables
-
-.task-board-avatars
-  text-align: right
-  float: right
-
-.task-board-change-assignee
-  &:hover
-    opacity: 0.6
-  cursor: pointer

assets/sass/app.sass

@@ -4,6 +4,7 @@
 @import title
 @import table
 @import table_drag_and_drop
+@import table_list
 @import form
 @import input_addon
 @import icon
@@ -33,12 +34,11 @@
 @import board
 @import task_board
 @import task_board_saving_state
-@import task_board_avatar
+@import task_avatars
 @import task_icons
 @import task_icon_age
 @import task_category
 @import task_date
-@import task_list
 @import task_tags
 @import task_summary
 @import task_form