diff --git a/src/css/nav.css b/src/css/nav.css index 3585d5e6..f5ccf746 100644 --- a/src/css/nav.css +++ b/src/css/nav.css @@ -62,6 +62,13 @@ html.is-clipped--nav { overflow-y: hidden; } +@media screen and (max-width: 1023px) { + html.is-clipped--nav .toolbar { + position: fixed; + width: 100%; + } +} + .nav-panel-menu { overflow-y: scroll; display: flex; diff --git a/src/js/01-nav.js b/src/js/01-nav.js index 38d47aac..2c922f22 100644 --- a/src/js/01-nav.js +++ b/src/js/01-nav.js @@ -148,4 +148,14 @@ if (!el) return return selector ? el[el.matches ? 'matches' : 'msMatchesSelector'](selector) && el : el } + + // Remove clipped nav + function removeClippedNav () { + var html = document.querySelector('html') + if (window.innerWidth >= 1024 && html.classList.has('is-clipped--nav')) { + html.classList.remove('is-clipped--nav') + } + } + + window.addEventListener('resize', removeClippedNav) })() diff --git a/src/partials/header-content.hbs b/src/partials/header-content.hbs index a8632654..624d78f9 100644 --- a/src/partials/header-content.hbs +++ b/src/partials/header-content.hbs @@ -131,7 +131,11 @@