add svg menu icon
This commit is contained in:
parent
d661cae78e
commit
6736625dc7
|
@ -1,6 +1,13 @@
|
||||||
.navigation {
|
.navigation {
|
||||||
height: 6rem;
|
height: 6rem;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
|
> .container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
a,
|
a,
|
||||||
span {
|
span {
|
||||||
display: inline;
|
display: inline;
|
||||||
|
@ -85,6 +92,7 @@
|
||||||
display: none;
|
display: none;
|
||||||
@media only screen and (max-width: 768px) {
|
@media only screen and (max-width: 768px) {
|
||||||
display: block;
|
display: block;
|
||||||
|
display: flex;
|
||||||
font-size: 2.4rem;
|
font-size: 2.4rem;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
line-height: 6rem;
|
line-height: 6rem;
|
||||||
|
@ -94,6 +102,9 @@
|
||||||
&:focus {
|
&:focus {
|
||||||
color: $link-color;
|
color: $link-color;
|
||||||
}
|
}
|
||||||
|
.svg-menu {
|
||||||
|
height: 1em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
</a>
|
</a>
|
||||||
{{ if or .Site.Menus.main .Site.IsMultiLingual }}
|
{{ if or .Site.Menus.main .Site.IsMultiLingual }}
|
||||||
<input type="checkbox" id="menu-toggle" />
|
<input type="checkbox" id="menu-toggle" />
|
||||||
<label class="menu-button float-right" for="menu-toggle"><i class="fas fa-bars"></i></label>
|
<label class="menu-button float-right" for="menu-toggle">{{ partial "svg/hamburger.svg" }}</label>
|
||||||
<ul class="navigation-list">
|
<ul class="navigation-list">
|
||||||
{{ with .Site.Menus.main}}
|
{{ with .Site.Menus.main}}
|
||||||
{{ range sort . }}
|
{{ range sort . }}
|
||||||
|
|
|
@ -0,0 +1,3 @@
|
||||||
|
<svg class="svg-menu" viewBox="0 0 24 24">
|
||||||
|
<path fill="currentColor" d="M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z" />
|
||||||
|
</svg>
|
After Width: | Height: | Size: 134 B |
Loading…
Reference in New Issue