aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorÓscar Nájera <hello@oscarnajera.com>2018-07-08 23:38:03 +0200
committerÓscar Nájera <hello@oscarnajera.com>2018-07-08 23:38:03 +0200
commit5346283419f792276c22dc4d4c4b1b2c6f357073 (patch)
treedfbed7903cdc7e194887d17c7fc7f1bc09fb2d17
parent4a1663d8d1728402f1dd9e95d6ae5b764224802c (diff)
downloadhugo-minimalist-theme-5346283419f792276c22dc4d4c4b1b2c6f357073.tar.gz
hugo-minimalist-theme-5346283419f792276c22dc4d4c4b1b2c6f357073.tar.bz2
hugo-minimalist-theme-5346283419f792276c22dc4d4c4b1b2c6f357073.zip
Hide and show sidebar
-rw-r--r--layouts/partials/head.html12
-rw-r--r--layouts/partials/header.html34
2 files changed, 32 insertions, 14 deletions
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index f061a00..45eb8db 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -14,6 +14,10 @@
<!-- CSS -->
<style>
+ #sidebar {
+ position:fixed;
+ z-index: 1;
+ }
.post-header {
text-shadow: 0 2px 1px rgba(0,0,0,0.9);}
@@ -22,3 +26,11 @@
color: #dcdcdc;
padding: 0.5em;}
</style>
+<script>
+function w3_open() {
+ document.getElementById("sidebar").style.display = "block";
+}
+function w3_close() {
+ document.getElementById("sidebar").style.display = "none";
+}
+</script>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 83f724f..f989b8e 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -4,22 +4,11 @@
{{ .Scratch.Set "authorPicture" (absURL .Site.Author.picture) }}
{{ end }}
-<nav class="dt w-100 border-box pa2">
-
- <i class="dtc dib v-mid dim fa fa-lg fa-bars"></i>
-
- <a href="{{ "/" | relLangURL }}" class="dtc v-mid link dim tc">
- <div class="f4 dib black-50">{{ .Site.Title }}</div>
- </a>
-
- {{ with ($.Scratch.Get "authorPicture") }}
- <a href="/#about" class="dtc dim tr">
- <img class="dib v-mid dib w2 h2 br-100" src="{{ . }}{{ if in . "//www.gravatar.com/avatar/" }}?s=90{{ end }}"/>
+<nav id="sidebar" class="w-25-ns bg-gray" style="display:none">
+ <a class="bg-black white link dim db pa3 tc pointer" onclick="w3_close()">
+ Close &times;
</a>
- {{ end }}
-</nav>
-<nav id="sidebar" class="w-25-ns ba">
<div class="tc pv4">
<a href="/#about" class="">
{{ with ($.Scratch.Get "authorPicture") }}
@@ -40,3 +29,20 @@
</li>
</ul>
</nav>
+
+<nav class="dt w-100 border-box pa2">
+
+ <a class="dtc dib v-mid dim " onclick="w3_open()">
+ <i class="fa fa-lg fa-bars"></i>
+ </a>
+
+ <a href="{{ "/" | relLangURL }}" class="dtc v-mid link dim tc">
+ <div class="f4 dib black-50">{{ .Site.Title }}</div>
+ </a>
+
+ {{ with ($.Scratch.Get "authorPicture") }}
+ <a href="/#about" class="dtc dim tr">
+ <img class="dib v-mid dib w2 h2 br-100" src="{{ . }}{{ if in . "//www.gravatar.com/avatar/" }}?s=90{{ end }}"/>
+ </a>
+ {{ end }}
+</nav>