Change Background Color of Dropdown Menu

[EmilSinding]

Hello,

Im having trouble changing the background and text color of my dropdown menu. I want it all black, with white text.

I have attatched a screenshot to helt you understand my issue.

Thank you in advance,
Emil

[Ecommpremium]

hi @EmilSinding  can you please provide store URL so i can give you its solution?

[EmilSinding]

adamocph.com

Pass: Eyy

[Ecommpremium]

Add this in bottom of theme.scss.liquid for  using DAWN theme put in the bottom of Base.css

.megamenu .site-nav__dropdown-link:not(.site-nav__dropdown-link--top-level) {
background-color: black;
    color: white;
}

[KetanKumar]

@EmilSinding 

thanks for url can you please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

.megamenu .site-nav__dropdown-link:not(.site-nav__dropdown-link--top-level) {
    background-color: #ffffff;
    color: #000;
}

[EmilSinding]

This white box is still a problem. Can you also help me remove the box around "Shop" and make an underline like shown on picture nr 2?

[Kinjaldavra · Accepted solution]

hello @EmilSinding 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

 .site-nav__item:hover .site-nav__link, .site-nav__item:hover .site-nav__dropdown-link  {
     background: transparent !important; 
    color: #ffffff !important;
}
.site-nav__item .site-nav__dropdown-link {
     background: transparent !important; 
    color: #ffffff !important;
}
.site-nav--has-dropdown .site-nav__link--underline::after {
    border-bottom-color: #ffffff;
} 

[Zworthkey]

Hii, @EmilSinding 
Paste this code on top of the theme.scss file.

a.site-nav__dropdown-link.site-nav__dropdown-link--top-level {
    background-color: black !important;
    color: white !important;
}

Thank You.

[KetanKumar]

@EmilSinding 

yes please try thsi code

.site-nav--has-dropdown.is-focused>a,.site-nav--has-dropdown:hover>a{
  color: #ffffff !important;
  color:var(--colorTextBody) !important;
  background-color: #000000;
  background-color:var(--colorBody);
}
.site-nav__dropdown a {
background-color: transparent;
    color: #fff;
}