Archived topic
Hook - menu-bar-items same color as merged header
4 replies · Started by tita on October 8, 2022
Hi,
How can i achieve - permanent mobile menu (burger toggle) with hooked cta-buttons, merged with feautured image in color white. menu and cta-buttons should switch to darkgrey when header slides in.
Config now:
Elements: Merged Header, navi color set to white.
Elements: Hooked cta-buttons (generate_menu_bar_items).
Not working yet is: Color of hooked elements (always grey)
Put hooked elements to right, just before the menu toggle (Customizer sets, cause of flexbox, the elements somewhere)
(GP Premium, GBlocks pro)
Should look like this: Logo center, burger-menu right, 2 cta-buttons left to burger-menu - all white.
when Header comes in - all darkgrey on white.
Please give advise how to achieve this with elements and customizer.
Thank you.
Hi there,
so it looks like the only remaining issue is the CTA Buttons require a different color when the header is merged.
Try this CSS:
#mobile-header:not(.is_stuck) {
--contrast: #fff;
--contrast-2: #fff;
}What it does is swap the Global Color values only for the #mobile-header and when it is NOT sticky.
Thanks, that worked perfect, now we have to bring the menu-bar-item to the right, just before the toggle burger-menu.
Any css for that?
Thanks a lot.
ah, this works.
.main-navigation .inside-navigation {justify-content:flex-end}
Glad to hear thats working!!
