aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPaul Duncan <pabs@pablotron.org>2021-10-17 19:52:10 -0400
committerPaul Duncan <pabs@pablotron.org>2021-10-17 19:52:10 -0400
commitba930dfe0ec42e181000a4e2c460805fceeb2d9a (patch)
tree59456802f7534cc0dac0fe2584eaed1638ca7243
parenta3e0e3d86e0d2257c4ac5eff458a5605191ec533 (diff)
downloadpablotron.org-ba930dfe0ec42e181000a4e2c460805fceeb2d9a.tar.bz2
pablotron.org-ba930dfe0ec42e181000a4e2c460805fceeb2d9a.zip
add menu script, fix menu rendering on mobile
-rw-r--r--data/menu.yaml4
-rw-r--r--themes/hugo-pt2021/assets/script.js15
-rw-r--r--themes/hugo-pt2021/layouts/partials/head.html11
-rw-r--r--themes/hugo-pt2021/layouts/partials/header.html8
4 files changed, 33 insertions, 5 deletions
diff --git a/data/menu.yaml b/data/menu.yaml
index 2002fc0..d25e7bd 100644
--- a/data/menu.yaml
+++ b/data/menu.yaml
@@ -19,10 +19,11 @@ start:
# help: "Links"
# right-aligned navbar menu entries
-# (these are usually icon-only)
+# (names of these items are only shown on mobile)
end:
- id: "github"
href: "https://github.com/pablotron"
+ name: "GitHub"
icon: "/ims/github.svg"
help: "github page"
#
@@ -33,5 +34,6 @@ end:
#
- id: "rss"
href: "/index.xml"
+ name: "Feed"
icon: "/ims/rss.svg"
help: "blog feed"
diff --git a/themes/hugo-pt2021/assets/script.js b/themes/hugo-pt2021/assets/script.js
new file mode 100644
index 0000000..bc95b27
--- /dev/null
+++ b/themes/hugo-pt2021/assets/script.js
@@ -0,0 +1,15 @@
+// enable burger menu support
+// src: https://bulma.io/documentation/components/navbar/
+document.addEventListener('DOMContentLoaded', () => {
+ "use strict";
+ // iterate through burgers
+ Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0).forEach(e => {
+ e.addEventListener('click', () => {
+ // get target from data-target attribute
+ const t = document.getElementById(e.dataset.target);
+
+ // toggle is-active on both burger and menu
+ [e, t].forEach(e => e.classList.toggle('is-active'));
+ });
+ });
+});
diff --git a/themes/hugo-pt2021/layouts/partials/head.html b/themes/hugo-pt2021/layouts/partials/head.html
index 37ec18c..56468e4 100644
--- a/themes/hugo-pt2021/layouts/partials/head.html
+++ b/themes/hugo-pt2021/layouts/partials/head.html
@@ -10,7 +10,7 @@
{{- end -}}
</title>
- {{/* set stylesheet */}}
+ {{/* load stylesheet */}}
{{- $options := (dict "targetPath" "style.css" "outputStyle" "compressed" "enableSourceMap" false) -}}
{{- $style := resources.Get "style.sass" | resources.ToCSS $options | resources.Fingerprint -}}
<link
@@ -20,6 +20,15 @@
integrity='{{ $style.Data.Integrity }}'
/>
+ {{/* load javascript */}}
+ {{- $script := resources.Get "script.js" | js.Build "script.js" | minify | fingerprint -}}
+ <script
+ type='text/javascript'
+ src='{{ $script.Permalink }}'
+ integrity='{{ $script.Data.Integrity }}'
+ defer
+ ></script>
+
{{/* add feeds */}}
{{- range .AlternativeOutputFormats -}}
{{- printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML -}}
diff --git a/themes/hugo-pt2021/layouts/partials/header.html b/themes/hugo-pt2021/layouts/partials/header.html
index 20abe46..cdeebb9 100644
--- a/themes/hugo-pt2021/layouts/partials/header.html
+++ b/themes/hugo-pt2021/layouts/partials/header.html
@@ -30,7 +30,7 @@
</a>
</div>
- <div id='page-menu' class='navbar-menu'>
+ <div id='page-menu' class='navbar-menu is-black'>
<div class='navbar-start'>
{{- range $.Site.Data.menu.start -}}
<a
@@ -68,7 +68,7 @@
{{- if .icon -}}
<img
src='{{.icon}}'
- class='menu-icon'
+ class='menu-icon is-hidden-touch'
width='{{$icon_width}}'
height='{{$icon_height}}'
title='{{.help}}'
@@ -77,7 +77,9 @@
{{- end -}}
{{- if .name -}}
- {{- .name -}}
+ <span class='is-hidden-desktop'>
+ {{- .name -}}
+ </span>
{{- end -}}
</a><!-- navbar-item -->
{{- end -}}