Added search button and menu icon

(cherry picked from commit 468264941d08b00252a4f6f081bc2dff5920bffe)
This commit is contained in:
Silvio Giebl
2019-07-21 21:56:50 +02:00
parent 52bcb26ddd
commit cc0b57727d
4 changed files with 69 additions and 24 deletions

View File

@@ -147,16 +147,10 @@
}
.site-button {
appearance: none;
display: flex;
height: 100%;
padding: $gutter-spacing-sm;
align-items: center;
color: $link-color;
text-transform: uppercase;
background: transparent;
border: 0;
@include fs-3;
@include mq(md) {
display: none;
@@ -197,3 +191,9 @@ body {
justify-self: end;
}
}
.icon {
width: $sp-5;
height: $sp-5;
fill: $link-color;
}

View File

@@ -62,6 +62,8 @@
}
.search-icon {
width: 1.2rem;
height: 1.2rem;
align-self: center;
margin-right: $sp-2;
fill: $grey-dk-000;
@@ -165,3 +167,17 @@
font-weight: bold;
color: $link-color;
}
.search-button {
position: fixed;
display: flex;
width: $sp-9;
height: $sp-9;
bottom: $sp-4;
right: $sp-4;
background-color: $search-background-color;
border-radius: #{$sp-9 / 2};
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 3px 10px rgba(0, 0, 0, 0.08);
align-items: center;
justify-content: center;
}