Archived topic
Different color on Mobile primary navigation
21 replies · Started by Huseyin on July 11, 2020
Hi GeneratePress,
Hope your weekend is going well?
So I need help on changing the color Mobile primary navigation. The colors I chose for the default is basically white background white, black text with a black coloured logo.
But I want to have a black background, white text with a white logo on mobile devices.
Wondering how could I achieve this with CSS?
However, I have seen this post from Jamal regarding
https://generatepress.com/forums/topic/how-to-style-navigation-menu/#post-347001
Hi there,
Any chance you can link us to the site in question?
You can edit the original topic and use the private URL field.
Let me know :)
Thanks for the reply Leo,
I have inserted the URL but the site is not live so I have attached the wp-admin details too
Are you referring to just the header or the actual navigation as well?
https://www.screencast.com/t/423Rg7fByM
Just the header, please
Hi there,
if you're using the Mobile Header then try this CSS:
#mobile-header {
background-color: #ff0000;
}Hi David,
That CSS code doesn't work.
Try turning on the mobile header option:
https://docs.generatepress.com/article/mobile-header/
Then you can upload a separate (white) logo and use David's CSS.
Done, got the white logo upload and inserted David's CSS.
However, can't get the .menu-toggle to be white. Also used the same code from Jamal but doesn't seem to work.
https://generatepress.com/forums/topic/how-to-style-navigation-menu/#post-347001
Can you disable the maintenance mode so I can see the site and provide the CSS?
sorry for the late reply.
I have disabled the maintenance mode
Try this CSS:
.mobile-header .menu-toggle {
color: #FFFFFF !important;
}Hi Leo,
It's not working.
(SORRY FOR THE LATE REPLY, BEEN VERY BUSY)
What is not working?
I see the last CSS I've provided working fine:
https://www.screencast.com/t/P2FubXLB1Y
Ohhhhhh sh*t sorry mate,
Sorry for wasting your valuable time.
Once again thank you for helping out.
