Avada Forums Community Forum How do I change the colour of the hamburger menu?

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • Goodfolk
    Participant
    Post count: 1

    From what I can tell, the menu icon colour change requires css. Is this correct? If so, how do I go about doing that? I’m a novice so if someone could help by providing a step-by-step process it would be much appreciated.

    Thanks

    marklchaves
    Participant
    Post count: 873

    Hi,

    This CSS works for me.

    
    
    /* Change "orange" to the colour of your choice. */
    
    .fusion-header-has-flyout-menu .fusion-flyout-menu-icons .fusion-flyout-menu-toggle:hover .fusion-toggle-icon-line,
    .fusion-header-has-flyout-menu .fusion-flyout-menu-icons .fusion-flyout-search-toggle:hover .fusion-toggle-icon-line {
        background-color: orange;
    }
    
    .fusion-header-has-flyout-menu.fusion-flyout-active .fusion-flyout-menu-icons .fusion-flyout-menu-toggle:hover .fusion-toggle-icon-line, .fusion-header-has-flyout-menu.fusion-flyout-active .fusion-flyout-menu-icons .fusion-flyout-search-toggle:hover .fusion-toggle-icon-line {
        background-color: orange;
    } 
    
    

    Copy. Then paste to your Addtional CSS or Custom CSS area.

    https://theme-fusion.com/documentation/avada/how-to/how-to-apply-custom-css/

    goclimbing
    Participant
    Post count: 2

    I figured out the problem. It’s not the CSS (at least it wasn’t for me).
    Edit the header with the menu
    Edit the mobile tab
    add a Mobile Menu Trigger Expand Icon and a Mobile Menu Trigger Collapse Icon

    The reason why the CSS didn’t work for some is there was nothing to style. And I don’t think the custom CSS is needed.

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