[Resolved] Where to set background colors hamburger menu button

Home Forums Support [Resolved] Where to set background colors hamburger menu button

Home Forums Support Where to set background colors hamburger menu button

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #2056443
    Rene

    Hi,
    I made my first simple test website with generatepress and generateblocks. Nice theme to use.
    I have only 1 issue.

    On mobile i used the off canvas menu.
    The hamburger-menu have a background-color.
    Very light grey. I dont know where to set this. I want it white.

    And when i click on my mobile phonoe on the hamburger menu, the background color of the hamburger menu is changing to kind of blue color.
    I can’t find this color in the customizer.

    Any idea where i can set this?

    Thnx!

    #2056579
    David
    Staff
    Customer Support

    Hi there,

    it will require this CSS:

    .mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover, .mobile-menu-control-wrapper .menu-toggle:focus, .has-inline-mobile-toggle #site-navigation.toggled {
        background-color: #fff;
    }

    that Blue marker looks like an accessibility focus ring – are you seeing that on a live device ?

    #2056587
    Rene

    Hi David,
    Thnx for your answer. But it doenst do the job.
    The default background is fixed with this, but not the color when i click on it.
    I see this on a live device (my own samsung galaxy s21).

    Maybe you can check it on your mobile phone? When you click on the hamburger… the yellow menu slides in, and then you see a strange colored box on the location of the hamburger.
    The domain you can see in my screenshots i added previously.

    Thnx!

    #2056881
    David
    Staff
    Customer Support

    On my iPhone i only see the default tap target shadow the phone generates. I have asked one of the support team who use Android to take a look.

    #2057192
    Elvin
    Staff
    Customer Support

    Hi there,

    Were you pertaining to the box that shows up before the panel slides in?

    If so,

    Can you try adding this CSS?

    nav#mobile-menu-control-wrapper.toggled {
        display: none;
    }
    #2057422
    Rene

    Hi Elvin,

    This fixed the issue! Thnx a lot.
    Hope you can fix this in future updates so i dont have to fix this in every site manually.
    Same to the background-color of the hamburger menu. Would be fine if we can set this in the customizer instead of custom css.

    Thnx!

    #2061322
    Elvin
    Staff
    Customer Support

    I’ve forwarded it to the dev team for them to have a look if in case a better solution can be implemented. Hopefully it gets added to the next version. ๐Ÿ™‚

    No problem. Happy holidays! ๐Ÿ˜€

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.