Make open and hovered dropdown toggles look the same

The chevron now has the same darker shade when the dropdown is opened it had when hovered on. Signed-off-by: David Wagner <david@marvid.fr>

Make open and hovered dropdown toggles look the same
4c6468aa · David Wagner · b3ed4e0c · 4c6468aa
Commit 4c6468aa authored Nov 22, 2016 by David Wagner
Hide whitespace changes
Inline Side-by-side

Showing with 11 additions and 8 deletions

dropdowns.scss app/assets/stylesheets/framework/dropdowns.scss +11 -8

No files found.
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -8,6 +8,12 @@
  }
 }

+@mixin chevron-active {
+  .fa-chevron-down {
+    color: $dropdown-toggle-hover-icon-color;
+  }
+}
+
 .open {
  .dropdown-menu,
  .dropdown-menu-nav {
@@ -19,7 +25,10 @@
    }
  }

+  .dropdown-toggle,
  .dropdown-menu-toggle {
+    @include chevron-active;
+
    border-color: $dropdown-toggle-hover-border-color;
  }
 }
@@ -70,20 +79,14 @@
    margin-left: 5px;
  }

-  @mixin chevron-hover {
-    .fa-chevron-down {
-      color: $dropdown-toggle-hover-icon-color;
-    }
-  }
-
  &:hover {
-    @include chevron-hover;
+    @include chevron-active;

    border-color: $dropdown-toggle-hover-border-color;
  }

  &:focus:active {
-    @include chevron-hover;
+    @include chevron-active;

    border-color: $dropdown-toggle-active-border-color;
  }