Docs

[barnettbailbonds]

Is there a way to change the nav bar current page indicator? Instead of the faint colored circle around “home” for example, can I change it to the “Home” with a bold underline? Would like the bold underline to be this color (Hex#aa710a).
I prefer that one but If it is not possible, then I will settle with just having darker ovals around the selected menu items and also when they hover, just as it is now, just darker.

[barnettbailbonds]

This reply has been marked as private.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

.x-navbar .desktop .x-nav>li>a>span {
    border: none;
    border-radius: 0;
}
.x-navbar .desktop .x-nav>li>a:hover>span,.x-navbar .desktop .x-nav>.x-active>a>span, .x-navbar .desktop .x-nav>.current-menu-item>a>span {
    border-bottom: 1px solid #aa710a;
}

Hope that helps.

[barnettbailbonds]

Hello, thank you all for the continued assistance but that code didn’t work. I tried to put in only half of the code just to make the circle borders disappear and that didn’t work either. please help.
Thank you!

[Thai]

Hi There,

You forgot to close the curly bracket(}) in your custom CSS. Please find this CSS:

@media only screen and (max-width: 767px) {
.x-topbar {
  position: relative;
}
.x-topbar .x-btn {
  display: block;
  float: none;
  margin: 10px auto !important;
  max-width: 200px;
  width: 100%;
}

And change to this:

@media only screen and (max-width: 767px) {
.x-topbar {
  position: relative;
}
.x-topbar .x-btn {
  display: block;
  float: none;
  margin: 10px auto !important;
  max-width: 200px;
  width: 100%;
}
}

Hope it helps 🙂

[barnettbailbonds]

Thanks for the help! Worked perfectly!!

How can I highlight a hovered item in the drop down menu?

something along the lines of this demo site. http://demo.theme.co/integrity-9/

I would like my locations tab and case status tab to look like the drop down menu for home tab looks in demo site please.

[Jade]

Hi there,

Please use this CSS code:

.desktop .sub-menu a:hover {
    text-decoration: none;
    background-color: rgba(0,0,0,0.0175);
}

Hope this helps.

[Jade]

Hi there,

Please use this CSS code:

.desktop .sub-menu a:hover {
    text-decoration: none;
    background-color: rgba(0,0,0,0.0175);
}

Hope this helps.

[barnettbailbonds]

Thanks! That did the trick!
lastly with the drop down menu, how do you erase the padding or spacing that is above the first and last item in the drop down menu. For example, in my two drop down menus there is spacing ABOVE general district court, and Hampton bail bonds, and spacing or padding BELOW Virginia Beach bail bonds and Juvenile and Domestic relations.

[Joao]

Hi There,

Please add the following code to Appereance > Customizer > custom > CSS

.masthead-inline .x-navbar .desktop .sub-menu {
    padding: 0;
}

Hope it helps

Joao

[barnettbailbonds]

Awesome! Thanks Joao!

[Prasant Rai]

You are most welcome. 🙂

[barnettbailbonds]

Hello again, how can i adjust the height of my buttons in the top bar. I would like the three gold buttons to come down some. Pretty much want the buttons Centered vertically. Thanks in advanced!

[Paul R]

Hi,

You can add this under Custom > Edit Global CSS in the Customizer.

.x-topbar .x-btn.x-btn-small {
    margin-top: 5px;
}

Hope that helps

[Author]

Posts