fix(menu): hover & active state colors on inverted secondary pointing

Closes #777
fomantic · Jun 11, 2019 · d34b681 · d34b681
1 parent 816fbbd
commit d34b681
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 5 deletions.
diff --git a/src/definitions/collections/menu.less b/src/definitions/collections/menu.less
@@ -1044,9 +1044,10 @@ Floated Menu / Item
 
 
 /* Active */
-.ui.secondary.inverted.pointing.menu .active.item {
+.ui.ui.secondary.inverted.pointing.menu .active.item {
   border-color: @secondaryPointingInvertedActiveBorderColor;
   color: @secondaryPointingInvertedActiveColor;
+  background-color: transparent;
 }
 
 /*--------------
@@ -1305,8 +1306,11 @@ each(@colors, {
 
   & when not (@color=secondary) {
     .ui.ui.menu .@{color}.active.item,
+    .ui.ui.@{color}.menu .active.item:hover,
     .ui.ui.@{color}.menu .active.item {
-      border-color: @c;
+      & when not (@secondaryPointingActiveBorderColor = currentColor) {
+        border-color: @c;
+      }
       color: @c;
     }
   }
@@ -1430,6 +1434,7 @@ each(@colors, {
 each(@colors, {
   @color: replace(@key, '@', '');
   @c: @colors[@@color][color];
+  @h: @colors[@@color][hover];
 
   & when not (@color=secondary) {
     .ui.ui.inverted.menu .@{color}.active.item,
@@ -1442,9 +1447,15 @@ each(@colors, {
     .ui.ui.inverted.@{color}.menu .active.item {
       background-color: @invertedColoredActiveBackground;
     }
+    .ui.inverted.pointing.@{color}.menu .active.item {
+      background-color: @h;
+    }
   }
 })
 
+.ui.ui.ui.inverted.pointing.menu .active.item:after{
+  background-color: inherit;
+}
 
 /*--------------
      Fitted

diff --git a/src/themes/default/collections/menu.variables b/src/themes/default/collections/menu.variables
@@ -257,7 +257,7 @@
 
 @secondaryPointingHoverTextColor: @textColor;
 
-@secondaryPointingActiveBorderColor: @black;
+@secondaryPointingActiveBorderColor: currentColor;
 @secondaryPointingActiveTextColor: @selectedTextColor;
 @secondaryPointingActiveFontWeight: @bold;
 
@@ -283,7 +283,7 @@
 @secondaryPointingInvertedBorderColor: @whiteBorderColor;
 @secondaryPointingInvertedItemTextColor: @invertedTextColor;
 @secondaryPointingInvertedItemHeaderColor: @white;
-@secondaryPointingInvertedItemHoverTextColor: @selectedTextColor;
+@secondaryPointingInvertedItemHoverTextColor: @invertedSelectedTextColor;
 @secondaryPointingInvertedActiveBorderColor: @white;
 @secondaryPointingInvertedActiveColor: @invertedSelectedTextColor;
 
@@ -407,7 +407,7 @@
 @invertedMenuPressedColor: @invertedSelectedTextColor;
 
 /* Inverted Active */
-@invertedActiveBackground: @strongTransparentWhite;
+@invertedActiveBackground: @invertedArrowActiveColor;
 @invertedActiveColor: @invertedSelectedTextColor;
 @invertedArrowActiveColor: #3D3E3F;