Refactor sidebar color variables

jet/static/jet/css/_sidebar.scss

@@ -15,7 +15,7 @@
 
     &-item {
       padding: 20px 24px;
-      border-bottom: 1px solid $sidebar-border-color;
+      border-bottom: 1px solid $sidebar-contrast-background-color;
 
       &:last-child {
         border-bottom: 0;
@@ -65,12 +65,12 @@
           margin-right: 14px;
 
           &, &:visited, &:hover {
-            color: $sidebar-contrast-color;
+            color: $sidebar-title-action-color;
             @include transition-all(0.3s);
           }
 
           &:hover {
-            color: $sidebar-contrast2-color;
+            color: $sidebar-hover-title-action-item-color;
           }
         }
       }
@@ -78,7 +78,7 @@
       &-action {
         &, &:visited, &:hover {
           display: block;
-          color: $sidebar-contrast-color;
+          color: $sidebar-action-color;
           font-size: 11px;
           text-align: center;
           margin-top: 10px;
@@ -88,7 +88,7 @@
         }
 
         &:hover {
-          color: $sidebar-contrast2-color;
+          color: $sidebar-hover-action-color;
           background-color: $sidebar-hover-background-color;
         }
       }
@@ -139,12 +139,12 @@
                 position: relative;
                 float: right;
                 display: none;
-                color: $sidebar-contrast-color;
+                color: $sidebar-action-color;
                 @include transition-all(0.3s);
               }
 
               &:hover {
-                color: $sidebar-contrast2-color;
+                color: $sidebar-hover-action-color;
               }
             }
 
@@ -154,12 +154,12 @@
                 display: none;
                 left: 4px;
                 font-size: 14px;
-                color: $sidebar-contrast-color;
+                color: $sidebar-action-color;
                 @include transition-all(0.3s);
               }
 
               &:hover {
-                color: $sidebar-contrast2-color;
+                color: $sidebar-hover-action-color;
               }
             }
 
@@ -178,11 +178,15 @@
 
           &-arrow {
             float: right;
-            color: $sidebar-contrast2-color;
+            color: $sidebar-arrow-color;
             font-size: 16px;
             font-weight: bold !important;
             margin-left: 4px;
           }
+
+          &-link:hover &-arrow {
+            color: $sidebar-hover-arrow-color;
+          }
         }
 
         &.compact &-item-link {
@@ -268,7 +272,8 @@
   }
 
   &-copyright {
-    background-color: $sidebar-border-color;
+    background-color: $sidebar-contrast-background-color;
+    color: $sidebar-contrast-text-color;
     height: 32px;
     line-height: 32px;
     position: absolute;

jet/static/jet/css/_variables.scss

@@ -55,9 +55,17 @@ $font-size: 14px !default;
 $sidebar-width: 250px !default;
 
 $sidebar-background-color: $blue-color-2 !default;
-$sidebar-border-color: $blue-color-1 !default;
-$sidebar-contrast-color: $contrast-color !default;
-$sidebar-contrast2-color: $contrast2-color !default;
+$sidebar-contrast-background-color: $blue-color-1 !default;
+$sidebar-contrast-text-color: $blue-color-4 !default;
+
+$sidebar-arrow-color: $contrast2-color !default;
+$sidebar-hover-arrow-color: $contrast2-color !default;
+
+$sidebar-action-color: $contrast-color !default;
+$sidebar-hover-action-color: $contrast2-color !default;
+
+$sidebar-title-action-color: $contrast-color !default;
+$sidebar-hover-title-action-item-color: $contrast2-color !default;
 
 $sidebar-text-color: $blue-color-4 !default;
 $sidebar-icon-color: $blue-color-4 !default;

jet/static/jet/css/themes/green/_variables.scss

@@ -55,9 +55,17 @@ $font-size: 14px;
 $sidebar-width: 250px;
 
 $sidebar-background-color: $green-color-2;
-$sidebar-border-color: $green-color-1;
-$sidebar-contrast-color: $contrast-color;
-$sidebar-contrast2-color: $contrast2-color;
+$sidebar-contrast-background-color: $green-color-1;
+$sidebar-contrast-text-color: $green-color-4;
+
+$sidebar-arrow-color: $contrast2-color;
+$sidebar-hover-arrow-color: $contrast2-color;
+
+$sidebar-action-color: $contrast-color;
+$sidebar-hover-action-color: $contrast2-color;
+
+$sidebar-title-action-color: $contrast-color;
+$sidebar-hover-title-action-item-color: $contrast2-color;
 
 $sidebar-text-color: $green-color-4;
 $sidebar-icon-color: $green-color-4;