[Resolved] Delete icon menu mobile

Home Forums Support [Resolved] Delete icon menu mobile

Home Forums Support Delete icon menu mobile

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1524579
    Matthieu

    Hello, I would like to remove the menu icon on mobile, is this possible ?

    Thanks

    #1524580
    Leo
    Staff
    Customer Support

    Hi there,

    Try this CSS:

    .menu-toggle .gp-icon {
        display: none;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    Let me know if this helps πŸ™‚

    #1524599
    Matthieu

    It works thanks !

    I added social network icons via the Block – Hook element
    generate_menu_bar_items. Is it possible to have the icons of social networks on the left of the page, keep the site logo in the center and the basket on the right ?

    Thanks

    #1524618
    Elvin
    Staff
    Customer Support

    Is it possible to have the icons of social networks on the left of the page, keep the site logo in the center and the basket on the right ?

    Definitely possible:

    Try this CSS:

    nav#site-navigation, .menu-bar-items  {
        width: 100%;
    }
    
    span.menu-bar-item.wc-menu-item {
        order: 2;
        margin-left: auto;
        margin-right: 20px;
    }

    A wise man once said:
    "Have you cleared your cache?"

    #1524621
    Matthieu

    Perfect thanks ! Is there a solution to have a different layout on mobile ?

    #1524627
    Elvin
    Staff
    Customer Support

    Perfect thanks ! Is there a solution to have a different layout on mobile ?

    You can set different settings for mobile by using @media (max-width:768px) rule.

    Example:

    /* desktop and tablet */
    .your-selector  {
        [add your style for desktop here]
    }
    /* mobile */
    @media (max-width:768px){
    .your-selector  {
        add your style for mobile here]
    }
    }

    A wise man once said:
    "Have you cleared your cache?"

    #1524631
    Matthieu

    The problem is that I wouldn’t know what to put to change this… πŸ˜… Could you maybe help me?

    If you reduce my page to mobile size : https://www.mmgraphik.com/ , you will see that the site logo is on the top left and the social media icons and the cart below on the same line.

    I would like to know if it was possible to align the cart icons on the same line as the logo and leave the social media icons on the line below.

    Thanks πŸ˜ƒ

    #1524640
    Elvin
    Staff
    Customer Support

    I would like to know if it was possible to align the cart icons on the same line as the logo and leave the social media icons on the line below.

    100% possible, but we may have to reduce the sizes or paddings of a few things so they fit in 1 row. πŸ™‚

    Try this CSS:

    @media (max-width: 768px){
    nav#mobile-header .navigation-branding .main-title {
        transform: translate(-50%, -50%);
    }
    nav#mobile-header .navigation-branding {
        position: absolute;
        top: 50%;
        left: 50%;
    }
    nav#mobile-header .inside-navigation.grid-container.grid-parent {
        position: relative;
    }
    nav#mobile-header a.gb-button {
        padding: 10px !important;
    }
    }

    A wise man once said:
    "Have you cleared your cache?"

    #1524642
    Matthieu

    Wow this is great ! Thank you so much ! 😁

    #1524644
    Matthieu

    It’s perfect ! Thanks again

    #1524647
    Elvin
    Staff
    Customer Support

    It’s perfect ! Thanks again

    No problem. Glad to be of any help. πŸ™‚

    A wise man once said:
    "Have you cleared your cache?"

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