Navigation slider customization

Hi there. I feel like I’ve been looking through the documentation forever so I’ll just ask.

is there a way to customize the size/shape/color of the selector slider in the top menu navigation?
Here’s a screen shot with it circled…

I’d like to make it thinner and a different color, or even a triangle shape…
Thanks,
Megan

Hey @mwhite1231,

Please add following CSS in Global CSS section in theme options, Adjust color and thickness as per your requirement.

.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 2px 0 0 #000;
}

Hope this helps!

Regards

Do you mean in
appearance > customize > additional css

OR in
appearance > customize > custom > edit global css

If so, it doesn’t change anything that I can see in either of these areas…

Hey @mwhite1231,

Hope you are doing great :slight_smile:
The “appearance > customize > custom > edit global css” is from our theme while Additional CSS is from WordPress itself. Both serves the same. You can use either of it. But I recommend you to use Edit Global CSS so you can expand the CSS code portion :slight_smile:

Let me know how it goes.

Regards

Ok. I tried both and neither changes the way it looks.

Hi there,

It could be cache, would you mind providing the URL that has this issue?

Thanks!