diff options
| 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 |
| commit | 5346283419f792276c22dc4d4c4b1b2c6f357073 (patch) | |
| tree | dfbed7903cdc7e194887d17c7fc7f1bc09fb2d17 | |
| parent | 4a1663d8d1728402f1dd9e95d6ae5b764224802c (diff) | |
| download | hugo-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.html | 12 | ||||
| -rw-r--r-- | layouts/partials/header.html | 34 |
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 × </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> |