- Data table sticky header.

- Mini sidebar toggle.
- Refactor withDashboard and withDashboardActions.

client/src/style/components/data-table.scss

@@ -1,8 +1,6 @@
 
 .bigcapital-datatable{
   display: block;
-  overflow-x: auto;
-  overflow-y: hidden;
 
   .dashboard__page-content &{
 
@@ -111,6 +109,9 @@
     }
 
     .tbody{
+      width: 100%;
+      overflow: scroll;
+
       .tr .td{
         border-bottom: 1px solid #E8E8E8;
         align-items: center;
@@ -198,6 +199,41 @@
     }
   }
 
+  &.has-sticky {
+
+    .thead,
+    .tfoot {
+      position: sticky;
+      z-index: 1;
+    }
+
+    .thead {
+      top: 0;
+      // box-shadow: 0px 3px 3px #ccc;
+    }
+
+    .tfoot {
+      bottom: 0;
+      // box-shadow: 0px -3px 3px #ccc;
+    }
+    .tbody {
+      position: relative;
+      z-index: 0;
+    }
+
+    [data-sticky-td] {
+      position: sticky;
+    }
+
+    [data-sticky-last-left-td] {
+      // box-shadow: 2px 0px 3px #ccc;
+    }
+
+    [data-sticky-first-right-td] {
+      // box-shadow: -2px 0px 3px #ccc;
+    }
+  }
+
   &.has-virtualized-rows{
     .tbody{
       overflow-y: scroll;