diff --git a/inc/navbar.php b/inc/navbar.php
index 248f573..892441f 100644
--- a/inc/navbar.php
+++ b/inc/navbar.php
@@ -36,6 +36,7 @@ function loginBar($sp = 'default-sp') {
} else {
$result .= "\tgetLoginURL()) . "\">logg inn\n";
}
+ $result .= "\t\n";
return $result;
}
diff --git a/www/css/style.css b/www/css/style.css
index 0499c9b..d3a5612 100644
--- a/www/css/style.css
+++ b/www/css/style.css
@@ -21,6 +21,16 @@ h1, h2, h3, h4, h5, h6, li, a.btn, p.login{
font-variant: normal;
}
+nav, #menu {
+ background: #024;
+}
+nav {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ height: 3em;
+}
nav ul {
position: fixed;
top: 0;
@@ -28,21 +38,25 @@ nav ul {
right: 0;
margin: .1em auto 0 auto;
text-align: center;
- background: #024;
margin: 0;
z-index: 3;
}
nav li {
+ margin: auto .25em;
+}
+nav #menu_toggle {
+ margin: 0;
+}
+nav li, nav #menu_toggle {
display: inline-block;
line-height: 3em;
- margin: auto .5em;
}
nav a {
display: inline-block;
margin: auto;
color: white;
text-decoration: none;
- margin: 0 .5em;
+ margin: 0 .75em;
}
nav li.active, nav li:hover {
border-bottom: 2px solid white;
@@ -55,6 +69,57 @@ nav .login{
z-index: 3;
color: gray;
}
+nav #menu_toggle {
+ display: none;
+}
+
+@media(max-width: 800px){
+ nav {
+ z-index: 1000;
+ }
+ nav li.active, nav li:hover {
+ border: none;
+ }
+ nav #menu {
+ position: fixed;
+ text-align: left;
+ top: 3em;
+ left: 0;
+ right: 0;
+ padding: 0;
+ }
+ nav #menu li, nav #menu li a {
+ margin-left: 0;
+ }
+ nav #menu, nav #menu li.active a {
+ padding-left: 1em;
+ }
+ nav #menu li {
+ display: none;
+ }
+ nav #menu:target li, nav #menu li.active {
+ display: block;
+ }
+ nav #menu li.active {
+ position: fixed;
+ top: 0;
+ left: 0;
+ }
+
+ nav #menu_toggle, nav #menu:target li.active a {
+ display: block;
+ position: fixed;
+ left: 0;
+ right: 0;
+ }
+ nav #menu_toggle {
+ text-align: center;
+ }
+ nav #menu_toggle:hover {
+ background: rgba(255,255,255,.1);
+ }
+
+}
header {
margin-top: 3rem;
height: 16rem;