mobile menu fixes
This commit is contained in:
parent
947f06ea08
commit
3660f4d9dc
|
@ -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;
|
||||||
|
|
|
@ -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">
|
||||||
|
|
Loading…
Reference in New Issue