Tweak editor button active state.

tropy · Mar 23, 2017 · 4f99315 · 4f99315
1 parent 0dad799
commit 4f99315
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 3 deletions.
diff --git a/src/stylesheets/components/editor/_toolbar.scss b/src/stylesheets/components/editor/_toolbar.scss
@@ -30,8 +30,22 @@
         }
       }
 
+      &:active {
+        .icon {
+          svg {
+            color: $icon-color;
+          }
+        }
+      }
+
       &.active {
         background: $editor-btn-active-bg;
+
+        .icon {
+          svg {
+            color: $editor-btn-active-color;
+          }
+        }
       }
 
       & + .btn-icon {

diff --git a/src/stylesheets/themes/_light.scss b/src/stylesheets/themes/_light.scss
@@ -249,9 +249,10 @@ $progress-cancel-color: $shade-1;
 $progress-cancel-bg:    $shade-5;
 
 // Editor
-$editor-toolbar-border:  $shade-2;
-$editor-btn-hover-bg:    $shade-1;
-$editor-btn-active-bg:   $shade-2;
+$editor-toolbar-border:        $shade-2;
+$editor-btn-hover-bg:          $shade-1;
+$editor-btn-active-color:      $shade-6;
+$editor-btn-active-bg:         $shade-2;
 
 $blockquote-border-color: $shade-2;
 $selected-node-color:     $brand-primary-60;