Underline color for menu item in header

Hi,

I found the setting to underline the menu items in the header (active or on hover) but is there a setting to change the color of that underline (like in some of your demos) or is it custom CSS that needs to be applied ?

Thanks

Hello,

Please navigate to the Theme settings > Styles and Colors > Primary color and change it.

Best Regards

I already did that but it doesn’t change a thing.

Hello,

Make sure you are changing this option http://prntscr.com/mnj2yp

If it does not work deactivate all the plugins not related to the theme, and switch to the parent them if you are running the child one and check again, provide your site admin access to the private area if it does not work even after deactivating the plugins

Best Regards

This is the option I changed.
I switched to the parent theme. Still the same issue…

Hello,

The light color scheme takes the light underline as well, in order to change that, add this code to the Theme Settings > Custom CSS > Global:

body .whb-color-light .navigation-style-underline .item-level-0>a .nav-link-text:after,
body .navigation-style-underline .menu-mega-dropdown .color-scheme-light .nav-link-text:after {
	    background-color: #7cd647;
}

Best Regards

Thank you Elise, it works except for the “my account” menu.
Is there a way to get the same underline for that menu and submenu ?

Another related question. What code should I use to get the menu items font to have the same green color than the underline on “focus” and “hover” states ?

Thank you

Hello,

My Account is a separate element of Woocommerce and it does not have such an option. You can Add this page to your main menu and all the pages in the drop-down as the submenu items and then it will also have the underline.

In order to set the color for the main menu item, navigate to the Theme Settings > Typography > Advanced typography https://xtemos.com/docs/woodmart/advanced-typography-settings/

Best Regards

[Author]

Posts