Make search bar "sticky" for tablets and mobile

This commit is contained in:
Matt-Yorkley
2020-04-21 13:40:42 +02:00
parent f24969edb1
commit ff69389bb0
3 changed files with 13 additions and 1 deletions

View File

@@ -171,7 +171,7 @@ nav.top-bar {
.tab-bar {
background-color: white;
border-bottom: 1px solid $light-grey-transparency;
height: 2.8em;
height: $mobile-nav-height;
position: fixed;
width: 100%;
z-index: 1;
@@ -210,6 +210,10 @@ nav.top-bar {
}
}
.off-canvas-wrap {
overflow: inherit;
}
.off-canvas-list li.language-switcher ul li {
list-style-type: none;
padding-left: 0.5em;

View File

@@ -39,6 +39,12 @@
}
}
@include breakpoint(desktop) {
position: -webkit-sticky;
position: sticky;
top: $mobile-nav-height;
}
@include breakpoint(mobile) {
font-size: 0.9em;
}

View File

@@ -31,6 +31,8 @@ $topbar-dropdown-bg: $white;
$topbar-dropdown-link-bg: $white;
$topbar-dropdown-link-bg-hover: $white;
$mobile-nav-height: 2.8em;
$radius-small: 0.25em;
$radius-medium: 0.5em;