add footer with navigation links to all pages

The architecture and reply-to-this pages were orphaned
with no way to navigate to or between them.

Add a simple footer with horizontal flexbox links to provide basic
site navigation.

Also normalize unquoted `href`/`src` attributes before
parsing generated HTML in `graphviz-ssr.js`.
This prevents `node-html-parser` from rewriting links like
`href=../architecture/` into empty anchors during SSR.

Author: ritorhymes

assets/sass/main.scss

@@ -78,6 +78,29 @@ div.feature-matrix {
     vertical-align: center;
   }
 }
+footer nav ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5em 1em;
+  justify-content: center;
+  text-align: center;
+}
+footer nav ul li a {
+  text-decoration: none;
+}
+.footer-favicon {
+  width: 24px;
+  height: 24px;
+  display: block;
+}
+.footer-home-link {
+  display: block;
+  width: 24px;
+  margin: 0.75em auto 0;
+}
 @media screen and (max-width: 450px) {
   big {
     font-size: 300%;

layouts/_default/index.html

@@ -1,3 +1,4 @@
 {{ define "main" }}
 {{ .Content | replaceRE "(<h2 id=\"([^\"]+)\".+)(</h[1-9]+>)" `${1} <a href="#${2}">#</a> ${3}` | safeHTML }}
+{{ partial "footer.html" . }}
 {{ end }}

layouts/_default/single.html

@@ -2,4 +2,5 @@
 <div class="block">
 {{ .Content }}
 </div>
+{{ partial "footer.html" . }}
 {{ end }}

layouts/partials/footer.html

@@ -0,0 +1,13 @@
+<footer>
+  <hr>
+  <nav>
+    <ul>
+      <li><a href="{{ relURL "/" }}">Home</a></li>
+      <li><a href="{{ relURL "architecture/" }}">Architecture</a></li>
+      <li><a href="{{ relURL "reply-to-this/" }}">Reply to this</a></li>
+    </ul>
+  </nav>
+  <a class="footer-home-link" href="{{ relURL "/" }}" aria-label="Home">
+    <img class="footer-favicon" src="{{ relURL "favicon.ico" }}" alt="" aria-hidden="true">
+  </a>
+</footer>

script/graphviz-ssr.js

@@ -13,7 +13,10 @@ import Viz from "../static/js/viz-global.js"
   for (const { Path: pathInPublic } of JSON.parse(readFileSync("public/diagram-list.json", "utf-8"))) {
     const path = `public${pathInPublic}.html`
     const contents = readFileSync(path, "utf-8")
-    const html = parse(contents)
+    // `node-html-parser` can misparse unquoted URLs ending in `/` (e.g. `href=../architecture/`)
+    // and rewrite links as empty anchors. Quote these attribute values before parsing.
+    const normalized = contents.replace(/\b(href|src)=([^"'`\s>]+)/g, '$1="$2"')
+    const html = parse(normalized)
     const vizImport = html.querySelector('script[src$="viz-global.js"]')
     if (!vizImport) {
       console.error(`No 'viz-global.js' import found in ${path}; skipping`)