Debut Theme - Mobile Fix

The Debut theme's mobile menu has a z-index of 1. This needs to be set to anything higher than 10 to ensure it shows "above" page content. This includes our mobile menu. Use the following code to fix the height issue:

Use the following code within either our CSS editor or your theme's CSS/SCSS to fix the height issue: 

.mobile-nav-wrapper {
    z-index: 300;
}

 

 
 
Have more questions? Submit a request

4 Comments

  • 1
    Avatar
    Daniela Rodriguez

    Hey! I'm having this problem here, where should I put this code exactly? (which file of the HTML/CSS editor?). Thank you!

  • 1
    Avatar
    Daniela Rodriguez

    I also have a problem retracting the menus after opening them in the mobile version. We also have the issue of opening menu options, only the sub items are opening pages. This adds to the previous problem of menu showing beneath the page content.

    Thanks so much for the support!

  • 1
    Avatar
    Helium Support

    Hey Daniela!

     

    Thanks for the comments! So this needs to be applied to the theme.scss.liquid. You will need to apply this directly to the .mobile-nav-wrapper class. 

    Regarding the retracting menus - the retracting could be due to this same issue, but we'd need to see it first hand. 

    Edited by Helium Support
  • 0
    Avatar
    Greg.

    there needs to be a colon after the 'z-index'... i put that and it worked perfectly. Thanks for all you do!

    .mobile-nav-wrapper {
        z-index: 300;
    }
Please sign in to leave a comment.
Powered by Zendesk