Improved search interface

This commit is contained in:
Silvio Giebl
2019-12-03 09:12:54 +01:00
parent d66ebdec4b
commit 804cad6c4d
7 changed files with 134 additions and 82 deletions

View File

@@ -3,7 +3,7 @@
//
.side-bar {
z-index: 100;
z-index: 0;
display: flex;
flex-wrap: wrap;
background-color: $sidebar-color;
@@ -48,15 +48,13 @@
}
.main-header {
@include container;
z-index: 0;
display: none;
padding-top: $gutter-spacing-sm;
padding-bottom: $gutter-spacing-sm;
background-color: $sidebar-color;
@include mq(md) {
display: flex;
justify-content: flex-end;
justify-content: space-between;
height: $header-height;
background-color: $body-background-color;
border-bottom: $border $border-color;
@@ -83,7 +81,14 @@
}
.site-nav {
display: none;
&.nav-open {
display: block;
}
@include mq(md) {
display: block;
padding-top: $sp-8;
padding-bottom: $gutter-spacing-sm;
overflow-y: auto;
@@ -97,7 +102,6 @@
align-items: center;
@include mq(md) {
z-index: 101;
height: $header-height;
max-height: $header-height;
border-bottom: $border $border-color;
@@ -137,17 +141,22 @@
height: 100%;
padding: $gutter-spacing-sm;
align-items: center;
}
@include mq(md) {
@include mq(md) {
.site-header .site-button {
display: none;
}
}
.site-title:hover,
.site-button:hover {
.site-title:hover {
background-image: linear-gradient(-90deg, rgba($feedback-color, 1) 0%, rgba($feedback-color, 0.8) 80%, rgba($feedback-color, 0) 100%);
}
.site-button:hover {
background-image: linear-gradient(-90deg, rgba($feedback-color, 1) 0%, rgba($feedback-color, 0.8) 100%);
}
// stylelint-disable selector-max-type
body {