[Resolved] Header setup / mobile

[Kevin Wabiszewski]

Hello, how could I make it so that the search magnifying glass turns black on mobile and so that the black lines stay there when the menu is clicked?

Here is the current CSS I am using

.main-navigation {
border-bottom: 2px #ba1f1f solid;
}

.post-template-default .widget_search {
margin-top: 57px;
}

@media (max-width: 768px) {
#mobile-header {
background-color: #ffffff;
}
.main-navigation .main-nav ul li a {
background-color: #ad0500;
}
button.menu-toggle {
color: #000000;
}
}

GeneratePress 2.2.2

GP Premium 1.7.7

[Tom]

Hi there,

Try this CSS:

button.menu-toggle:hover, 
button.menu-toggle:focus, 
.main-navigation .mobile-bar-items a, 
.main-navigation .mobile-bar-items a:hover, 
.main-navigation .mobile-bar-items a:focus {
    color: #000;
}

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Kevin Wabiszewski]

Worked great thanks a lot!

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts