Mobile Nav / Header Edit

Site URL: https://www.kaizenmarketplace.com

Hey guy, how would I edit the mobile menu so it functions differently. I'd prefer it to open out with a transparent background rather then going full screen with larger text. I have attached screen grabs of the current site (see the soft green colour) and I'm hoping to get something similar to the alldey.com mobile nav bar, also attached a screen grab! Thank you :)

What is access password?

LAUNCH

Add to Home > design > Custom CSS

.header-menu-bg.theme-bg--primary {
    background: transparent !important;
}
.header-menu-nav-folder-content {
    justify-content: flex-start;
}

Amazing, thank you.

Is it possible to have all text sit under the menu button in a much smaller font size? As well as changing the font size to Acumin small header?

I have added an example website image for visual reference.

Thank you for your help

Use this CSS

.header--menu-open .header-menu.white .header-menu-nav a {
    font-size: 10px;
    font-family: monospace !important;
}

That looks really great, thank you.

One last thing, when we now x out of the menu, there's a slight glitch and we see the larger fonted previous menu flash before the menu is closed.

tell me one thing that if i want to edit my nav bar same as above in my website ninja store, then what i have to edit in my website code. also i don't know much about coding i.e. help me with your suggestions.

On 4/9/2020 at 2:57 PM, SSchroder said:

That looks really great, thank you.

 

One last thing, when we now x out of the menu, there's a slight glitch and we see the larger fonted previous menu flash before the menu is closed.

I can't access your site. Can you check again?

Apologies, we have just changed the URL, it is now www.publicfibre.com - we don't have the menu up at the moment, let me know if this is an issue and we can reach out once the section is live.