[Resolved] Mobile Header Color Issue – GP Pro Awaken theme

[Bailey]

Dev Site – https://killian.tech

The header looks great on the home page and everything is fine on the desktop view. The mobile view is where the color gets messed up. The background color for the menu is set is #d5232f but when I look at the mobile site on any pages that aren’t the homepage the header is either shade of light grey or white or transparent so it makes seeing the Title and Menu almost impossible to read. I can’t figure out where the color is off at that it needs to be fixed.

[David]

Hi there,

the Mobile Header uses the colors set in Customizer > Layout > Primary Navigation. Try changing them and let me know.

[Bailey]

I think you meant Customizer > Colors > Primary Navigation and not Layout.

That color is rgba(255,255,255,0) and is necessary for the Awaken theme Homepage on Desktop. This one needs a separate setting or a custom css because it needs to be that for the desktop version but messes up the mobile header.

[David]

Oops – sorry 🙂
Change the colors in the Customizer for the entire site.

Then in Appearance > Elements edit the Header Element assigned to the front page, and go to the Site Header tab, there you can edit the navigation colors for that page :

https://docs.generatepress.com/article/header-element-overview/

[Bailey]

Thanks! That fixed it.

[David]

You’re welcome

[Author]

Posts