Shadows main navigation active links

[callerpatty]

Been scouring around to see how we can get the active main navigation link to be different. I can get the hover state to change, but there doesn't appear to be anything in the standard set up to indicate that a nav is selected/active? I would think that this would be standard navigation handling.

Anyone have any ideas?

Here is what I've tried to see if I could fool it into working:
.x-transfigure-navigation .c-navigation__link--active, .x-transfigure-navigation .c-navigation__link:active, a.c-navigation__link:hover, a.c-navigation__link:active {background-color:#34638B !important; color:#ffffff !important;}

The hover works as expected,,, but I can't get the active to work no matter what I try.

https://yourcovers.com/differential-covers.html - I would expect the differential covers menu item to be able to be called out.

[Matt Zimmermann]

To achieve something like that, you would have to modify the code for the primary navigation to check if you are on a category page and if the current category or its parent category is the one targeted by the link. Then, you could add an active state class to the element and style as you like.

[RTHOMASDESIGN]

Take a look at the "Category Tree Template" under Global Settings. You'll notice that the class "x-category-tree__link--current" is assigned to the current category. That template should easily get you started :)

[RTHOMASDESIGN]

I should also note that the "active" selector can be used on any element. An element becomes "active" after a user clicks on it. The selector has nothing to do with what page you're on (unlike the visited selector). Which is why you'd need to assign a class with template logic like Matt suggested and style it accordingly.