alfred/cityuni-webserver
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Provide a CSS Upgrade to prepare for JS supported nav modification on resize.
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Captain ALM 2022-08-17 13:04:03 +01:00
parent f5a850efd5
commit 5fcfb11c65
Signed by: alfred
GPG Key ID: 4E4ADD02609997B1
4 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
base.css
View File

@ -59,6 +59,14 @@ main{
overflow: hidden; overflow: hidden;
max-height: 0; max-height: 0;
} }
.vnav{
max-height: none;
top: 0;
position: relative;
float: right;
width: auto;
overflow: hidden;
}
.so-pane{ .so-pane{
display: none; display: none;
overflow: hidden; overflow: hidden;
@ -112,10 +120,16 @@ main{
.nav-menu, .sort-menu{ .nav-menu, .sort-menu{
display: none; display: none;
} }
.menu a{ .menu a, .vmenu a{
display: block; display: block;
padding: 24px 16px; padding: 24px 16px;
} }
.vmenu li{
float: left;
}
.vmenu a:hover{
background-color: transparent;
}
.hmb{ .hmb{
cursor: pointer; cursor: pointer;
float: right; float: right;
@ -142,7 +156,7 @@ main{
.hmb-line::after{ .hmb-line::after{
top: -5px; top: -5px;
} }
.nav-menu:checked ~ nav, .nav-open{ .nav-menu:checked ~ #nav, .nav-open{
max-height: 100%; max-height: 100%;
} }
.nav-menu:checked ~ .hmb .hmb-line, .nav-open-hmb .hmb-line{ .nav-menu:checked ~ .hmb .hmb-line, .nav-open-hmb .hmb-line{
@ -274,7 +288,7 @@ main{
border-width: 1px; border-width: 1px;
margin: 2px; margin: 2px;
} }
@media (min-width: 560px){ @media (min-width: 600px){
.main-box > div{ .main-box > div{
padding: 12px; padding: 12px;
} }

6
dark.css
View File

@ -10,13 +10,13 @@ body{
a{ a{
color: #b0b0f0; color: #b0b0f0;
} }
.header, .nav, footer, .so-pane{ .header, nav, footer, .so-pane{
background-color: #1d1d1e; 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; 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; background-color: #606061;
} }
.hmb-line, .hmb-line::before, .hmb-line::after{ .hmb-line, .hmb-line::before, .hmb-line::after{

4
index.go.html
View File

@ -95,6 +95,10 @@
</div> </div>
<input class="nav-menu" type="checkbox" id="nav-menu"/> <input class="nav-menu" type="checkbox" id="nav-menu"/>
<label class="hmb" for="nav-menu" title="Navigation Links"><span class="hmb-line"></span></label> <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"> <nav class="nav" id="nav">
<ul class="menu no-lst-style"> <ul class="menu no-lst-style">
{{ range .Data.GetHeaderLabels }} {{ range .Data.GetHeaderLabels }}

6
light.css
View File

@ -10,13 +10,13 @@ body{
a{ a{
color: #4f4fff; color: #4f4fff;
} }
.header, .nav, footer, .so-pane{ .header, nav, footer, .so-pane{
background-color: #e2e2e1; 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; 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; background-color: #9f9f9e;
} }
.hmb-line, .hmb-line::before, .hmb-line::after{ .hmb-line, .hmb-line::before, .hmb-line::after{