Docs

[bperry420]

Site info:

Home

WordPress 4.7.2 running X – Child Theme theme
Cornerstone Version 1.3.3

I was able to figure out how to make my mobile menu icon turn green with white bars.
I want it to have green bars when you hover over it.
What is the proper css code for changing the colors for those on hover?

Here is the css code I have used so far:

.x-btn-navbar
{
  background-color: #9ba500;
  padding:10px 15px;
  color:#fff;
  margin-top:27px;
  border-radius: 5px;
}

.x-btn-navbar.collapsed 
{
  background-color: #9ba500;
  padding:10px 15px;
  color:#fff;
  margin-top:27px;
  border-radius: 5px;
}

.x-icon-bars
{
  color:#fff;
}

[Thai]

Hi There,

Please add the following CSS:

a.x-btn-navbar:hover i {
    color: #9ba500
}

Hope it helps 🙂

[bperry420]

Thanks, but there is one other issue…
When I click on the mobile nav icon, while it’s clicked it shows 4 horizontal lines in the icon.
I only want it to show 3 at all times.

[Christopher]

Hi there,

Please remove this code :

a.x-btn-navbar:hover i {
    color: #9ba500;
    background-color: #fff;
}

And add this code :

.x-btn-navbar:hover {
    color: #fff;
}

.x-btn-navbar.collapsed:hover {
       color: #9ba500;
    background-color: #fff;
}

Hope it helps.

[bperry420]

Thanks! You guys are the best!

[Thai]

You’re most welcome 🙂

[Author]

Posts