diff --git a/style.css b/style.css index 64fc19749..c10ea24e0 100644 --- a/style.css +++ b/style.css @@ -673,6 +673,22 @@ ul { display: inline-block; } +@media (max-width: 768px) { + .nav-wrapper .hide-on-mobile { + border: 0; + clip: rect(0 0 0 0); + -webkit-clip-path: inset(50%); + clip-path: inset(50%); + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute; + width: 1px; + white-space: nowrap; + } +} + .nav-wrapper .menu-button { background: none; border: 0; diff --git a/styles/_header.scss b/styles/_header.scss index 4b052d0d0..22ef72daa 100644 --- a/styles/_header.scss +++ b/styles/_header.scss @@ -62,6 +62,12 @@ $header-height: 71px; &.sign-in { display: inline-block; } } + .hide-on-mobile { + @include mobile { + @include visually-hidden; + } + } + .menu-button { @include tablet { display: none; } background: none; diff --git a/templates/header.hbs b/templates/header.hbs index 6405612b9..bb3a013ea 100644 --- a/templates/header.hbs +++ b/templates/header.hbs @@ -20,10 +20,12 @@