search

zerostaticthemes / hugo-hero-theme

A multi-page Hugo theme with fullscreen hero images and fullwidth sections.
https://hugo-hero.netlify.com
MIT License
355 stars 252 forks source link

Opening mobile menu causes content shift #31

Closed finnmglas closed 3 years ago

finnmglas commented 3 years ago

Here's another problem I found:

Opening the mobile menu causes a content shift. The shift is equivalent to the header / top-navigation height.

Screenshots:

I managed to fix it in one of my customized versions of the hugo-hero-theme.

Screenshots:

I did it by removing this from _header.scss:

.lock-scroll {
  .header {
    &.header-absolute {
      position: static;
    }
  }
}

and changing z-index: 10; to z-index: 100;, so that the menu bar will be visible at all times (above the mobile menu).

I am not sure if that fix would be fine for your purposes, however, the content-shift is a bug.