From 65bf38d5e6f2c7d98f6ff56544d1908f187fed58 Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charlesh88@gmail.com>
Date: Fri, 27 Jan 2017 11:16:06 -0800
Subject: [PATCH 1/3] [Frontend] Add grab affordance styling on hover

Fixes #1415
WIP
---
 .../core/res/sass/_time-conductor-base.scss   | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/platform/features/conductor/core/res/sass/_time-conductor-base.scss b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
index 629c17f726..f49e8c6669 100644
--- a/platform/features/conductor/core/res/sass/_time-conductor-base.scss
+++ b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
@@ -346,7 +346,28 @@
             content: $i;
         }
         .l-axis-holder {
+            $grabTicksH: 8px;
+            $grabTicksXSpace: 3px;
+            $grabTicksYOffset: (($r1H - $grabTicksH) / 2) - 2px;
             @include cursorGrab();
+            &:hover {
+                $c0: rgba($colorBodyFg, 0.05);
+                $c2: transparent; // Bg
+                @include background-image(linear-gradient(
+                    $c0 70%, $c2 100%
+                ));
+                svg {
+                    $c1: rgba($colorBodyFg, 0.15); // Line
+                    $angle: 90deg;
+                    @include background-image(linear-gradient($angle,
+                        $c1 1px, $c2 1px,
+                        $c2 100%
+                    ));
+                    background-position: center $grabTicksYOffset;
+                    background-repeat: repeat-x;
+                    background-size: $grabTicksXSpace $grabTicksH;
+                }
+            }
         }
     }
 

From d1e7e7894e1c02df3cf8c467843e3ac98b4785c9 Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charlesh88@gmail.com>
Date: Fri, 27 Jan 2017 13:58:38 -0800
Subject: [PATCH 2/3] [Frontend] Add grab affordance styling on hover

Fixes #1415
---
 .../conductor/core/res/sass/_time-conductor-base.scss         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/platform/features/conductor/core/res/sass/_time-conductor-base.scss b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
index f49e8c6669..e1dad98dad 100644
--- a/platform/features/conductor/core/res/sass/_time-conductor-base.scss
+++ b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
@@ -351,13 +351,13 @@
             $grabTicksYOffset: (($r1H - $grabTicksH) / 2) - 2px;
             @include cursorGrab();
             &:hover {
-                $c0: rgba($colorBodyFg, 0.05);
+                $c0: rgba($colorBodyFg, 0.1);
                 $c2: transparent; // Bg
                 @include background-image(linear-gradient(
                     $c0 70%, $c2 100%
                 ));
                 svg {
-                    $c1: rgba($colorBodyFg, 0.15); // Line
+                    $c1: rgba($colorBodyFg, 0.2); // Line
                     $angle: 90deg;
                     @include background-image(linear-gradient($angle,
                         $c1 1px, $c2 1px,

From 784114e2561a95983f9acd6478c98e31e6c45d35 Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charlesh88@gmail.com>
Date: Fri, 27 Jan 2017 14:07:36 -0800
Subject: [PATCH 3/3] [Frontend] Add grab affordance grippys

Fixes #1415
---
 .../core/res/sass/_time-conductor-base.scss   | 32 +++++++++----------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/platform/features/conductor/core/res/sass/_time-conductor-base.scss b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
index e1dad98dad..96e45ad447 100644
--- a/platform/features/conductor/core/res/sass/_time-conductor-base.scss
+++ b/platform/features/conductor/core/res/sass/_time-conductor-base.scss
@@ -346,27 +346,27 @@
             content: $i;
         }
         .l-axis-holder {
-            $grabTicksH: 8px;
-            $grabTicksXSpace: 3px;
-            $grabTicksYOffset: (($r1H - $grabTicksH) / 2) - 2px;
+            $c0: rgba($colorBodyFg, 0.1);
+            $c2: transparent;
+            $grabTicksH: 3px;
+            $grabTicksXSpace: 4px;
+            $grabTicksYOffset: 0;
             @include cursorGrab();
+            svg {
+                $c1: rgba($colorBodyFg, 0.2);
+                $angle: 90deg;
+                @include background-image(linear-gradient($angle,
+                    $c1 1px, $c2 1px,
+                    $c2 100%
+                ));
+                background-position: center $grabTicksYOffset;
+                background-repeat: repeat-x;
+                background-size: $grabTicksXSpace $grabTicksH;
+            }
             &:hover {
-                $c0: rgba($colorBodyFg, 0.1);
-                $c2: transparent; // Bg
                 @include background-image(linear-gradient(
                     $c0 70%, $c2 100%
                 ));
-                svg {
-                    $c1: rgba($colorBodyFg, 0.2); // Line
-                    $angle: 90deg;
-                    @include background-image(linear-gradient($angle,
-                        $c1 1px, $c2 1px,
-                        $c2 100%
-                    ));
-                    background-position: center $grabTicksYOffset;
-                    background-repeat: repeat-x;
-                    background-size: $grabTicksXSpace $grabTicksH;
-                }
             }
         }
     }