Provide a CSS Upgrade to prepare for JS supported nav modification on resize.
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
f5a850efd5
commit
5fcfb11c65
20
base.css
20
base.css
@ -59,6 +59,14 @@ main{
|
||||
overflow: hidden;
|
||||
max-height: 0;
|
||||
}
|
||||
.vnav{
|
||||
max-height: none;
|
||||
top: 0;
|
||||
position: relative;
|
||||
float: right;
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.so-pane{
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
@ -112,10 +120,16 @@ main{
|
||||
.nav-menu, .sort-menu{
|
||||
display: none;
|
||||
}
|
||||
.menu a{
|
||||
.menu a, .vmenu a{
|
||||
display: block;
|
||||
padding: 24px 16px;
|
||||
}
|
||||
.vmenu li{
|
||||
float: left;
|
||||
}
|
||||
.vmenu a:hover{
|
||||
background-color: transparent;
|
||||
}
|
||||
.hmb{
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
@ -142,7 +156,7 @@ main{
|
||||
.hmb-line::after{
|
||||
top: -5px;
|
||||
}
|
||||
.nav-menu:checked ~ nav, .nav-open{
|
||||
.nav-menu:checked ~ #nav, .nav-open{
|
||||
max-height: 100%;
|
||||
}
|
||||
.nav-menu:checked ~ .hmb .hmb-line, .nav-open-hmb .hmb-line{
|
||||
@ -274,7 +288,7 @@ main{
|
||||
border-width: 1px;
|
||||
margin: 2px;
|
||||
}
|
||||
@media (min-width: 560px){
|
||||
@media (min-width: 600px){
|
||||
.main-box > div{
|
||||
padding: 12px;
|
||||
}
|
||||
|
6
dark.css
6
dark.css
@ -10,13 +10,13 @@ body{
|
||||
a{
|
||||
color: #b0b0f0;
|
||||
}
|
||||
.header, .nav, footer, .so-pane{
|
||||
.header, nav, footer, .so-pane{
|
||||
background-color: #1d1d1e;
|
||||
}
|
||||
.home-button > div, .sort-button > div, .menu a, .so-pane > form > div > * > *{
|
||||
.home-button > div, .sort-button > div, .menu a, .vmenu a, .so-pane > form > div > * > *{
|
||||
color: #e0e0e0;
|
||||
}
|
||||
.home-button:hover, .menu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
|
||||
.home-button:hover, .menu a:hover, .vmenu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
|
||||
background-color: #606061;
|
||||
}
|
||||
.hmb-line, .hmb-line::before, .hmb-line::after{
|
||||
|
@ -95,6 +95,10 @@
|
||||
</div>
|
||||
<input class="nav-menu" type="checkbox" id="nav-menu"/>
|
||||
<label class="hmb" for="nav-menu" title="Navigation Links"><span class="hmb-line"></span></label>
|
||||
<nav class="vnav" id="vnav">
|
||||
<ul class="vmenu no-lst-style">
|
||||
</ul>
|
||||
</nav>
|
||||
<nav class="nav" id="nav">
|
||||
<ul class="menu no-lst-style">
|
||||
{{ range .Data.GetHeaderLabels }}
|
||||
|
@ -10,13 +10,13 @@ body{
|
||||
a{
|
||||
color: #4f4fff;
|
||||
}
|
||||
.header, .nav, footer, .so-pane{
|
||||
.header, nav, footer, .so-pane{
|
||||
background-color: #e2e2e1;
|
||||
}
|
||||
.home-button > div, .sort-button > div, .menu a, .so-pane > form > div > * > *{
|
||||
.home-button > div, .sort-button > div, .menu a, .vmenu a, .so-pane > form > div > * > *{
|
||||
color: #1f1f1f;
|
||||
}
|
||||
.home-button:hover, .menu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
|
||||
.home-button:hover, .menu a:hover, .vmenu a:hover, .hmb:hover, .sort-button:hover, .sort-menu:checked ~ .sort-button, .sort-button-active, .so-pane > form > div > span > input, .so-pane > form > div > div > select{
|
||||
background-color: #9f9f9e;
|
||||
}
|
||||
.hmb-line, .hmb-line::before, .hmb-line::after{
|
||||
|
Loading…
Reference in New Issue
Block a user