consolidate slideout panels

dashboard-ui/css/card.css

@@ -44,7 +44,7 @@
 }
 
 .cardBox {
-    margin: 1px;
+    margin: 3px;
 }
 
 .largeCardMargin .cardBox {
@@ -55,12 +55,12 @@
     margin: 4px;
 }
 
-/*@media all and (max-width: 600px) {
+@media all and (max-width: 600px) {
 
     .cardBox {
-        margin: 0;
+        margin: 1px;
     }
-}*/
+}
 
 .grayscale {
     -webkit-filter: grayscale(100%);

dashboard-ui/css/librarybrowser.css

@@ -704,7 +704,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
 }
 
 .lblDetailTab {
-    border-color: #1f1f1f !important;
+    border-color: #212121 !important;
 }
 
 .editMetadataForm {

dashboard-ui/css/librarymenu.css

@@ -8,7 +8,7 @@
 
 .libraryMenuDivider {
     height: 1px;
-    background: #282828;
+    background: #333;
     margin: .5em 0;
 }
 
@@ -196,7 +196,7 @@
     }
 
         .librarySidebarLinks a:hover {
-            background-color: #38c !important;
+            background-color: #383838 !important;
             color: #fff !important;
         }
 
@@ -208,7 +208,7 @@
 }
 
 .selectedMediaFolder {
-    background-color: #52B54B !important;
+    background-color: #3388cc !important;
     color: #fff !important;
 }
 
@@ -217,7 +217,7 @@
 }
 
 .ui-panel.ui-body-b {
-    background-color: #161616;
+    background-color: #212121;
 }
 
 .libraryViewNav .ui-btn-active {

dashboard-ui/css/site.css

@@ -243,6 +243,22 @@ body:not(.enableBackButton) .headerBackButton {
     left: 270px !important;
 }
 
+@media all and (min-width: 340px) {
+
+    .largePanel {
+        width: 300px;
+    }
+
+    /* Make panels larger */
+    .largePanelModalOpen.ui-panel-dismiss-position-right {
+        right: 300px !important;
+    }
+
+    .largePanelModalOpen.ui-panel-dismiss-position-left {
+        left: 300px !important;
+    }
+}
+
 
 pre, textarea.pre {
     display: block;
@@ -453,12 +469,17 @@ h1 .imageLink {
 }
 
 .sidebarLinkIcon {
-    font-size: 17px;
+    font-size: 16px;
     width: 66px;
     text-align: center;
     vertical-align: middle;
+    color: #ddd;
 }
 
+    .sidebarLinkIcon + span {
+        vertical-align: middle;
+    }
+
 .ui-page-theme-a .sidebarLinkIcon {
     color: #666;
 }
@@ -473,8 +494,9 @@ h1 .imageLink {
 
 .sidebarHeader {
     padding-left: 20px;
-    margin: 1em 0;
+    margin: 15px 0 10px;
     font-size: 90%;
+    color: #ccc;
 }
 
 .ui-page-theme-a .sidebarHeader {