started working on sidebar open, close interaction

Author: marcgurney

scout-ui/src/document-view/document-list-item.jade

@@ -1,2 +1,2 @@
-.list-group-item
+div
   div(data-hook='doc-subview')

scout-ui/src/document-view/document-list.jade

@@ -1 +1 @@
-.list-group(data-hook='documents-container')
+div(data-hook='documents-container')

scout-ui/src/home/collection.jade

@@ -11,7 +11,10 @@
   .column-container
     .column.main
       div(data-hook='fields-subview')
+    .splitter
+      button.btn.btn-link.splitter-button
+        i.fa.fa-caret-left
+        | 
+        i.fa.fa-file-text-o
     .column.side
-      .splitter
-        i.fa.fa-lg.fa-rotate-90.fa-sort
       div(data-hook='documents-subview')

scout-ui/src/home/index.less

@@ -86,7 +86,6 @@
     }
   }
   .column-container {
-    padding-right: 20px;
     display: flex;
     overflow: hidden;
     height: 100vh;
@@ -103,6 +102,7 @@
     -webkit-overflow-scrolling: touch;
     -ms-overflow-style: none;
     position: relative;
+    transition: width 250ms ease;
   }
 
   .main {
@@ -114,11 +114,28 @@
     width: 350px;
     font-family: @font-family-monospace;
     font-size: 11px;
+    border-left: 2px solid @gray7;
+    right: -12px;
   }
 
   .splitter {
     width: 20px;
     height: 20px;
+    position: relative;
+    right: 20px;
+  }
+  .splitter-button {
+    outline: none;
+    color: @gray1;
+    text-decoration: none;
+
+    &:hover {
+      text-decoration: none;
+    }
+    &:active {
+      outline: none;
+      color: @green2;
+    }
   }
 }