Hover frustration

[ThunderBird2]

It is sort of frustration to find Style Properties's hover color, it doesn't change the blue background and text even though I tried all hovers settings in Appearances. Could you please tell me where exact to change hover and underline....

 

[Shelley]

This will change the colour of the tab and the font colour on hover by adding to EXTRA.CSS you'll have to change accordingly to your preference but i'm sure it's in Style Properties.

.navTabs .navTab.PopupOpen .navLink:hover, .navTabs .navTab.PopupClosed .navLink:hover {
background: url("@imagePath/xenforo/gradients/navigation-tab.png") repeat-x scroll center top red;
color: green;
}

 

[Shelley]

And your border problem you can change by pasting in EXTRA.CSS with the following adjusting accordingly.

.Menu .primaryContent {
    border-bottom: 0px solid green;}

Edit: Set the value of the bottom-border to zero.

 

[ThunderBird2]

This will change the colour of the tab and the font colour on hover by adding to EXTRA.CSS you'll have to change accordingly to your preference but i'm sure it's in Style Properties.

.navTabs .navTab.PopupOpen .navLink:hover, .navTabs .navTab.PopupClosed .navLink:hover {
background: url("@imagePath/xenforo/gradients/navigation-tab.png") repeat-x scroll center top red;
color: green;
}

Shelly, thanks! As you know, some of us don't use CSS due to lack of understanding codes.

I am trying to find navLink in Styles Properties but unable to do successfully. I ended up to change color palette's primaryLight, which working fine but still stuck with shiny gradient, anyone know how to remove gradients for that primaryLight hovering?

I found bottom-border problem in Building Blocks that is in PrimaryContent.

regards

 

[erich37]

in ACP there is a search-box at the top-right.

search for:
navtabs

this will give you the result:
Navigation Tabs Container @navTabs

click on this and you will be shown the right screen to change all colors for the Navigation-tabs there.



in order to get rid of the "shiny gradient", just remove the link to the ".png gradient-image" which is in one of the boxes which says "Background" there....

@imagePath/xenforo/gradients/navigation-tab.png

hope this helps.....

 

[ThunderBird2]

in ACP there is a search-box at the top-right.

search for:
navtabs

this will give you the result:
Navigation Tabs Container @navTabs

click on this and you will be shown the right screen to change all colors for the Navigation-tabs there.

in order to get rid of the "shiny gradient", just remove the link to the ".png gradient-image" which is in one of the boxes which says "Background" there....

@imagePath/xenforo/gradients/navigation-tab.png

hope this helps.....

I already typed search, the result shown navigation, navigation.css and EXTRA.CSS. It doesn't show Navigation Tabs Container @navTabs. The search results didn't provide specific listings of navtabs or primaryContent. "No items matched your filter."

Then carefully I removed gradients and text-shadow under navigation.css hiding somewhere and somewhere.

 

[erich37]

I would not change anything in the file "navigation.css"


just go for this route in ACP:

ACP > Appearance > Style Properties > Header and Navigation > Navigation Tab

and change your stuff there.




Keep in mind to create your own "custom style" first, so you do not make any changes to the "default style", but to make changes to your "custom style" (which is a child-style of your default style).

 

[ThunderBird2]

Thank you, erich. It is solved.

 

[ThunderBird2]

ACP > Styles Properties > Buttons..........I even tried to get rid of white background of this circle in login area in order to transparent with black background. Both Styles Properties Login Bar and Sign Up Buttons container doesn't answer my problem, where is exactly we do that specifically?

 

[TPerry]

ACP > Styles Properties > Buttons..........I even tried to get rid of white background of this circle in login area in order to transparent with black background. Both Styles Properties Login Bar and Sign Up Buttons container doesn't answer my problem, where is exactly we do that specifically?

Don't take this as gospel (it's been so long since I changed it) but for the popups (system wide) I think I did this in EXTRA.css

/* Darken background on popups */
a.callToAction span {
background: #4B4848 url('styles/default/xenforo/gradients/form-button-white-25px.png') repeat-x center -8px !important;
color: rgb(253, 222, 156) !important;
}
a.callToAction {
padding: 0px;
color: #353534 !important;
}
.xenForm fieldset {
color: orange;
}
.xenForm .ctrlUnit {
color: orange;
}

Mine looks like this

 

[ThunderBird2]

Tracy, you look neat. To clarify, it is a bit odd. I found that Firefox and IE doesn't have problem and all clear but Chromo still have this kind of white circle issue.

 

[TPerry]

Tracy, you look neat. To clarify, it is a bit odd. I found that Firefox and IE doesn't have problem and all clear but Chromo still have this kind of white circle issue.

The screenshot from above was from the latest Chrome on my Mac Mini. Just plug that into your EXTRA.css and see if it changes it. If so, you can always edit the colors to your liking (or delete it from the EXTRA.css).