Docs

[maria]

Hi,
I’ve gone through the forum but only managed to change the link colors, and NOT the hover link colors, drop-downs or the indicator bar above the nav item (see image attached).

How do I change all links in all states & the indicator bar? Thanks

NB: I’ve added this CSS to selected pages (not global CSS)…

.x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
color: #00C380;
}
.x-navbar .desktop .x-nav > .x-active > a:hover, .x-navbar .desktop .x-nav > .current-menu-item > a:hover {
color: #00C380;
}

[Prasant Rai]

Hello There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[maria]

Sure. Here is the url http://ecbiz206.inmotionhosting.com/~hnporg5/become-a-friar/

[Joao]

Hi There,

Please add the following code to change all hover and active states.

.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a, .x-navbar .desktop .sub-menu a:hover, .x-navbar .desktop .sub-menu .x-active > a, .x-navbar .desktop .sub-menu .current-menu-item > a, .x-navbar .desktop .x-nav .x-megamenu > .sub-menu > li > a, .x-navbar .mobile .x-nav li > a:hover, .x-navbar .mobile .x-nav .x-active > a, .x-navbar .mobile .x-nav .current-menu-item > a {
    color: #00C380;
}
.x-navbar .desktop .x-nav > li > a:hover, .x-navbar .desktop .x-nav > .x-active > a, .x-navbar .desktop .x-nav > .current-menu-item > a {
    box-shadow: inset 0 4px 0 0 #00C380;

Hope it helps

Joao

[maria]

Thanks! That works!

[Prasant Rai]

You are most welcome. 🙂

[Author]

Posts