So I’m having to rebuild my site after a security breach. I have upgraded my X to Pro and have rebuilt most of the site. I’m having difficulty getting the line under the active navbar item (the current page) to change color. I managed to get everything else the right colors, just not the line under the active item. I tried to use the suggestion in this post: I can't change color in navbar .x-active > a but it does not seem to work. Here is my current custom CSS related to the navbar:
.x-navbar .desktop .x-nav>li>a,
.x-navbar .mobile .x-nav>li>a
{color: #673695;}
.x-navbar .desktop .x-nav li.current-menu-item > a,
.x-navbar .desktop .x-nav li > a:hover,
.x-navbar .mobile .x-nav li.current-menu-item > a,
.x-navbar .mobile .x-nav li > a:hover
{color: #BF1E2E;}
.x-btn-navbar.collapsed,
.x-btn-navbar
{ background-color: #673695;
color: #BF1E2E;}
.x-btn-navbar.collapsed:hover,
.x-btn-navbar:hover
{ background-color: #BF1E2E;
color: #673695;}
Here is an image of the navbar with what I’m trying to change color circled in green:
Any help is greatly appreciated.