How to stop hover color on specific nav items - Brooklyn Theme

Store Design
1

Hi Guys,

I tried a few fixes for this but it seems every time I try to take away the hover colour on the “side nav with sub items” the hover colour stops for the whole side nav.

I just want the yellow hover color to not show on the two main side nav items which have drop down items inside . ‘shop by destination’ and ‘shop by collection’

Does anyone know how I would do this?

I’ve tried a lot of ways by the class etc and it always seems to override the others.

Store is: https://bradenboutique.myshopify.com/

password: braden

Side Nav Issue.PNG
Side Nav Issue.PNG349×701 19.6 KB

1 Like
2

Hi!

Add this rule to the bottom of theme.scss.css

#Label-1:hover {
    color: inherit;
}

#Label-2:hover {
    color: inherit;
}
1 Like
3

@klackenb

Please add the following code at the bottom of your assets/timber.scss.liquid file.

.mobile-nav__has-sublist a.mobile-nav__link:hover {
    color: #000 !important;
}

Hope this works.

Thanks!

4

thanks @Nick_Marketing that worked perfectly!

and @dmwwebartisan thanks for taking the time to help! I tried it that way like you said, and for sure that would normally work, but maybe my code is a bit of a mess! Thanks again!

1 Like