From: Nicolas Coden <nicolas@ncoden.fr>
Date: Thu, 2 Aug 2018 22:34:27 +0000 (+0200)
Subject: fix: fix Dropdown Menu top level item properties #11412
X-Git-Tag: v6.6.0~3^2~122^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6a0e3240b;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

fix: fix Dropdown Menu top level item properties #11412

Changes:
- Only apply top-level styles to top-level items. This increase specificity but this markup structure is alreaddy assumed elsewhere in the component.
- Remove the default `$white` background on top-level items: it was never applied before #11377 and could now cause visual changes.

Closes https://github.com/zurb/foundation-sites/issues/11412
---

diff --git a/scss/components/_dropdown-menu.scss b/scss/components/_dropdown-menu.scss
index 6972df4b9..d2d348033 100644
--- a/scss/components/_dropdown-menu.scss
+++ b/scss/components/_dropdown-menu.scss
@@ -28,11 +28,11 @@ $dropdownmenu-min-width: 200px !default;
 
 /// Background color for top level items.
 /// @type Color
-$dropdownmenu-background: $white !default;
+$dropdownmenu-background: null !default;
 
 /// Background color for dropdowns.
 /// @type Color
-$dropdownmenu-submenu-background: $dropdownmenu-background !default;
+$dropdownmenu-submenu-background: $white !default;
 
 /// Padding for top level items.
 /// @type Number
@@ -148,12 +148,16 @@ $dropdown-menu-item-background-active: transparent !default;
 
     a {
       @include disable-mouse-outline;
+    }
+
+    // Top-level item
+    > li > a {
       background: $dropdownmenu-background;
       padding: $dropdownmenu-padding;
     }
 
-    // Active state
-    .is-active > a {
+    // Top-level item active state
+    > li.is-active > a {
       background: $dropdown-menu-item-background-active;
       color: $dropdown-menu-item-color-active;
     }