fix: toggle visibility on mobile nav (#93)
This commit is contained in:
parent
311f01102c
commit
96a9792f5b
|
@ -14,7 +14,7 @@
|
||||||
<nav class="gblog-nav">
|
<nav class="gblog-nav">
|
||||||
<input type="checkbox" id="menu-control" class="hidden">
|
<input type="checkbox" id="menu-control" class="hidden">
|
||||||
<div class="gblog-nav__control">
|
<div class="gblog-nav__control">
|
||||||
<label for="menu-control" class="flex align-center justify-center">
|
<label for="menu-control" class="flex align-center justify-center">
|
||||||
<svg class="icon gblog_menu"><use xlink:href="#gblog_menu"></use></svg>
|
<svg class="icon gblog_menu"><use xlink:href="#gblog_menu"></use></svg>
|
||||||
<svg class="icon gblog_clear"><use xlink:href="#gblog_clear"></use></svg>
|
<svg class="icon gblog_clear"><use xlink:href="#gblog_clear"></use></svg>
|
||||||
<span>Nav</span>
|
<span>Nav</span>
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
max-height: 0;
|
max-height: 0;
|
||||||
|
visibility: hidden;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -70,6 +71,7 @@
|
||||||
|
|
||||||
#menu-control:checked ~ .gblog-nav__list {
|
#menu-control:checked ~ .gblog-nav__list {
|
||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
#menu-control:checked ~ .gblog-nav__control {
|
#menu-control:checked ~ .gblog-nav__control {
|
||||||
|
|
Loading…
Reference in New Issue