Add mobile nav

Pure CSS, baby!
This commit is contained in:
2022-07-03 18:47:45 +02:00
parent 28b79acd1f
commit 05e2d5abd2
3 changed files with 202 additions and 15 deletions

View File

@@ -38,4 +38,14 @@
.content a:hover { @apply text-sky-700 border-b border-zinc-400; }
.content a:visited { @apply text-indigo-600 }
.content a:active { @apply text-sky-500; }
input#mobile-nav-is-open + div > a svg:last-of-type { @apply hidden; }
input#mobile-nav-is-open:checked + div > a svg:first-of-type { @apply hidden; }
input#mobile-nav-is-open:checked + div > a svg:last-of-type { @apply block; }
input#mobile-nav-is-open + div > div.backdrop { @apply hidden; }
input#mobile-nav-is-open:checked + div > div.backdrop { @apply block; }
input#mobile-nav-is-open + div > nav { @apply hidden; }
input#mobile-nav-is-open:checked + div > nav { @apply block }
}