mobile menu fixes

This commit is contained in:
dave 2019-07-05 21:29:19 -07:00
parent 947f06ea08
commit 3660f4d9dc
2 changed files with 10 additions and 5 deletions

View File

@ -49,11 +49,16 @@ a {
.nav-inner { .nav-inner {
display: none; display: none;
} }
#nav.active .nav-inner { // Maybe put a little X in unclickable space to close the menu
display: block; #nav>button:active {
padding: 2em 0; border: 1px solid #f0f;
} }
#nav>button + .nav-inner:active,
#nav>button:focus + .nav-inner {
display: block;
background-color: #252a3a;
}
#nav { #nav {
.pure-menu { .pure-menu {
@ -68,7 +73,7 @@ a {
} }
.pure-menu-link { .pure-menu-link {
color: #fff; color: #fff;
margin-left: 0.5em; // margin-left: 0.5em;
} }
.pure-menu-heading { .pure-menu-heading {
border-bottom: none; border-bottom: none;

View File

@ -9,7 +9,7 @@
<body> <body>
<div id="layout" class="content pure-g"> <div id="layout" class="content pure-g">
<div id="nav" class="pure-u"> <div id="nav" class="pure-u">
<a href="#" class="nav-menu-button">Menu</a> <button class="nav-menu-button">Menu</button>
<div class="nav-inner"> <div class="nav-inner">
<div class="pure-menu"> <div class="pure-menu">
<ul class="pure-menu-list"> <ul class="pure-menu-list">