[Frontend] Styling for Time Conductor v2

Fixes #933 In-progress: color/size tweaks, fixes for espresso theme
nasa · Jul 14, 2016 · 8b694ef · 8b694ef
1 parent e193e3d
commit 8b694ef
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 8 deletions.
diff --git a/platform/commonUI/general/res/sass/_constants.scss b/platform/commonUI/general/res/sass/_constants.scss
@@ -48,7 +48,7 @@ $uePaneMiniTabW: 10px;
 $uePaneMiniTabCollapsedW: 11px;
 $ueEditLeftPaneW: 75%;
 $treeSearchInputBarH: 25px;
-$ueTimeControlH: (25px, 4px, 20px);
+$ueTimeControlH: (25px, 6px, 20px);
 /*************** Panes */
 $ueBrowseLeftPaneTreeMinW: 150px;
 $ueBrowseLeftPaneTreeMaxW: 35%;

diff --git a/platform/commonUI/general/res/sass/controls/_time-conductor.scss b/platform/commonUI/general/res/sass/controls/_time-conductor.scss
@@ -22,7 +22,7 @@
 }
 
 .time-conductor-icon {
-    $c: $colorBtnBg; //$colorTimeCondKeyBg;
+    $c: $colorObjHdrIc;
     $d: 20px;
     background: $c;
     border-radius: 4px;
@@ -193,6 +193,7 @@
                     display: none;
                 }
                 line {
+                    // Tick marks
                     stroke: $c;
                 }
                 text {
@@ -239,7 +240,8 @@
                     border-radius: 0;
                     padding-left: 0;
                     padding-right: 0;
-                    &:hover {
+                    &:hover,
+                    &:focus {
                         @include nice-input();
                         padding: $inputTextP;
                     }
@@ -256,6 +258,13 @@
             }
         }
 
+/*        .l-time-conductor-ticks .l-axis-holder {
+            svg {
+                line { color: $colorTimeCondKeyBg; };
+                text { fill: $colorTimeCondKeyBg; }
+            }
+        }*/
+
         .l-data-visualization {
             background: $colorTimeCondDataVisRtBg !important
         }

diff --git a/platform/commonUI/themes/espresso/res/sass/_constants.scss b/platform/commonUI/themes/espresso/res/sass/_constants.scss
@@ -210,7 +210,7 @@ $colorLoadingFg: $colorAlt1;
 $colorLoadingBg: rgba($colorBodyFg, 0.2);
 
 // Time Conductor
-$colorTimeCondKeyBg: #1d7a96;
+$colorTimeCondKeyBg: #4e70dc;
 $colorTimeCondKeyFg: #fff;
-$colorTimeCondDataVisBg: pushBack($colorTick, 20%);
-$colorTimeCondDataVisRtBg: pushBack($colorTimeCondKeyBg, 30%);
+$colorTimeCondDataVisBg: pullForward($colorBodyBg, 10%);
+$colorTimeCondDataVisRtBg: pushBack($colorTimeCondKeyBg, 10%);
diff --git a/platform/commonUI/themes/snow/res/sass/_constants.scss b/platform/commonUI/themes/snow/res/sass/_constants.scss
@@ -210,7 +210,7 @@ $colorLoadingFg: $colorAlt1;
 $colorLoadingBg: rgba($colorLoadingFg, 0.1);
 
 // Time Conductor
-$colorTimeCondKeyBg: #0092b3;
+$colorTimeCondKeyBg: #6178dc;
 $colorTimeCondKeyFg: #fff;
-$colorTimeCondDataVisBg: pushBack($colorTick, 20%);
+$colorTimeCondDataVisBg: pullForward($colorBodyBg, 10%);
 $colorTimeCondDataVisRtBg: pushBack($colorTimeCondKeyBg, 30%);