_sidebar.scss in active_frontend-6.4.0

- old
+ new

@@ -1,37 +1,37 @@
 /* Table of Contents
 ==================================================
 # Sidebar
+# Colors
 # Media Queries */
 
 /* # Sidebar
 ================================================== */
 .sidebar {
-  background: rgba(35,41,55,1);
-  border-left: 2px solid rgba(0,0,0,0.2);
+  background: rgba(255,255,255,1);
+  border-left: 2px solid rgba(245,248,250,1);
   box-sizing: border-box;
   height: 100%;
   min-width: 280px;
   position: fixed;
   width: 280px;
 }
 .sidebar-alt {
-  border-right: 1px solid rgba(0,0,0,0.2);
+  border-right: 2px solid rgba(245,248,250,1);
   border-left: 0;
 }
 .sidebar-header {
-  border-bottom: 1px solid rgba(0,0,0,0.2);
+  border-bottom: 1px solid rgba(245,248,250,1);
   font-size: 12px;
   line-height: 12px;
   padding: 12px 20px 10px 10px;
 }
 .sidebar-alt > .sidebar-header {
   padding-right: 10px;
   padding-left: 20px;
 }
 .sidebar-header > h6 {
-  color: rgba(255,255,255,1);
   font-size: 12px;
   font-weight: normal;
   letter-spacing: 1px;
   line-height: 12px;
   text-transform: uppercase;
@@ -47,16 +47,34 @@
 .sidebar-alt > .sidebar-content {
   padding-right: 10px;
   padding-left: 20px;
 }
 .sidebar-scrollable {
-  border-bottom: 1px solid rgba(0,0,0,0.15);
+  border-bottom: 1px solid rgba(245,248,250,1);
   height: auto;
   max-height: calc(50% - 60px);
   -webkit-overflow-scrolling: touch;
   overflow-scrolling: touch;
   overflow-y: auto;
 }
+
+/* # Colors
+================================================== */
+.sidebar-dark {
+  background: rgba(35,41,55,1);
+  border-color: rgba(0,0,0,0.2);
+}
+.sidebar-dark.sidebar-alt,
+.sidebar-dark > .sidebar-header,
+.sidebar-dark > .sidebar-scrollable { border-color: rgba(0,0,0,0.2); }
+.sidebar-dark > .sidebar-header > h6 { color: rgba(255,255,255,1); }
+.sidebar-light {
+  background: rgba(245,248,250,1);
+  border-color: rgba(225,232,237,1);
+}
+.sidebar-light.sidebar-alt,
+.sidebar-light > .sidebar-header,
+.sidebar-light > .sidebar-scrollable { border-color: rgba(225,232,237,1); }
 
 /* # Media Queries
 ================================================== */
 @media only screen and (max-width: 1365px) {
   .sidebar {
\ No newline at end of file