This commit is contained in:
wangbudui 2020-01-05 15:48:24 +08:00
parent 5eba78f6bc
commit c26b1436cc
2 changed files with 24 additions and 3 deletions

View File

@ -5,3 +5,15 @@ code {
font-family: "Lucida Console", Monaco, monospace; font-family: "Lucida Console", Monaco, monospace;
font-size: 85%; font-size: 85%;
} }
/* menu */
@media (max-width: 768px) {
nav#menu {
display: none;
}
/* Style the button when the checkbox is checked */
#expand-toggle:checked ~ nav#menu {
display: block;
}
}

View File

@ -1,8 +1,17 @@
<header class="flex flex-col w-full md:w-1/5 md:text-right md:pr-8 bg-white text-center"> <header class="flex flex-col w-full md:w-1/5 md:text-right md:pr-8 bg-white text-center">
<h1 class="font-medium mt-4 md:mb-12">Wrong.Wang</h1> <h1 class="font-medium mt-4 md:mb-12"><a href="#">Wrong.Wang</a></h1>
<p class="font-thin italic">前进</p> <p class="font-thin italic">前进</p>
<nav class="my-2 md:flex-row-reverse"> <input type="checkbox" class="hidden" id="expand-toggle" />
<ul class="list-none pl-0"> <div class="block absolute right-0 lg:hidden">
<label for="expand-toggle" id="expand-btn" class="flex items-center px-3 py-2 border rounded">
<svg class="h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<title>Menu</title>
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
</svg>
</label>
</div>
<nav id="menu" class="my-2 md:flex-row-reverse">
<ul class="list-none pl-0">
{{ range .Site.Menus.main }} {{ range .Site.Menus.main }}
<li class="my-4 border-black border-b-2 md:border-none pb-1"> <li class="my-4 border-black border-b-2 md:border-none pb-1">
<a class="md:border-black md:border-b-2 md:pb-1" href="{{ .URL }}">{{ .Name }}</a> <a class="md:border-black md:border-b-2 md:pb-1" href="{{ .URL }}">{{ .Name }}</a>