Azure AD support + defaultReadAccess option + All Pages UI work

client/js/app.js

@@ -54,6 +54,7 @@ $(() => {
   // ====================================
 
   require('./pages/view.js')(alerts)
+  require('./pages/all.js')(alerts, socket)
   require('./pages/create.js')(alerts, socket)
   require('./pages/edit.js')(alerts, socket)
   require('./pages/source.js')(alerts)

client/js/pages/all.js

@@ -0,0 +1,9 @@
+'use strict'
+
+import $ from 'jquery'
+
+module.exports = (alerts, socket) => {
+  if ($('#page-type-all').length) {
+
+  }
+}

client/scss/components/collapsable-nav.scss

@@ -1,25 +1,52 @@
 .has-collapsable-nav {
   background-color: mc('blue-grey', '50');
+  display: flex;
+  justify-content: flex-start;
+  align-items: stretch;
 }
 
 .collapsable-nav {
   width: 300px;
-  background-color: mc($primary, '500');
+  background-color: mc('blue-grey', '900');
   color: #FFF;
   min-height: 80vh;
   transition: all .6s ease;
+  border-left: 1px solid darken(mc('blue-grey', '900'), 5%);
+
+  &:last-child {
+    border-bottom-right-radius: 5px;
+  }
 
   &.has-children {
     width: 50px;
+    background-color: mc($primary, '500');
+    border-left: 1px solid mc($primary, '700');
+
+    &:nth-child(2) {
+      border-left: 1px solid darken(mc('blue-grey', '900'), 5%);
+    }
 
     li {
+      border-top: none;
       display: none;
     }
+
   }
 
   li {
     display: flex;
-    border-top: 1px solid mc($primary, '700');
+    border-top: 1px solid darken(mc('blue-grey', '900'), 5%);
+
+    &.is-title {
+      background-color: mc('blue-grey', '800');
+      padding: 8px 15px;
+      color: mc('blue-grey', '300');
+      font-size: 13px;
+      letter-spacing: 1px;
+      text-transform: uppercase;
+      box-shadow: 0 0 5px rgba(0,0,0,0.3);
+      margin-right:1px;
+    }
 
     &.is-active {
       display: flex;
@@ -32,7 +59,6 @@
       a {
         height: 50px;
       }
-
     }
 
   }
@@ -61,40 +87,3 @@
   }
 
 }
-
-.collapsable-nav-sub {
-  width: 300px;
-  background-color: mc('blue-grey', '800');
-  border-left: 1px solid mc('blue-grey', '900');
-  color: #FFF;
-  min-height: 80vh;
-
-  li {
-    display: flex;
-    border-top: 1px solid mc('blue-grey', '900');
-  }
-
-  a {
-    display: flex;
-    height: 40px;
-    width: 100%;
-    align-items: center;
-    padding: 0 15px;
-    color: #FFF;
-    cursor: pointer;
-    transition: all .4s ease;
-    background-color: rgba(0,0,0,0);
-
-    i {
-      font-size: 14px;
-      margin-right: 10px;
-    }
-
-    &:hover {
-      background-color: rgba(0,0,0,.1);
-      text-decoration: none;
-    }
-
-  }
-
-}

client/scss/components/sidebar.scss

@@ -87,10 +87,6 @@
     width: 50px;
 
     aside {
-      .sidebar-label {
-        margin-right: 1px;
-      }
-
       .sidebar-menu li a {
         padding: 10px 0;
         justify-content: center;