fix: mobiloverløb, stak-tekster og mermaid væk

Tabeller ruller nu inden i sig selv, så siden ikke bliver bredere end skærmen ved
390 px. Kodeblokke og tabeller kan igen nås med tastatur. Kolofon, uses, humans.txt
og banner beskriver den nye stak. Mermaid er fjernet, da intet indlæg bruger det.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

assets/site.css

@@ -56,6 +56,7 @@ html[data-theme="terminal"] {
 
 /* Kodeblokke */
 .prose pre { position: relative; }
+.tabel { overflow-x: auto; }
 .giallo-l { display: inline-block; min-height: 1lh; width: 100%; }
 .copy-btn {
   position: absolute; top: .45rem; right: .45rem;
@@ -66,8 +67,6 @@ html[data-theme="terminal"] {
 }
 .prose pre:hover .copy-btn, .copy-btn:focus-visible { opacity: 1; }
 .copy-btn:hover { color: var(--color-text); }
-.mermaid-diagram { margin: 1.5rem 0; overflow-x: auto; }
-.mermaid-diagram svg { max-width: 100%; height: auto; }
 
 /* /now */
 .heatmap { display: flex; gap: 3px; width: max-content; }

content/colophon.md

@@ -1,5 +1,5 @@
 ---
 title: "Kolofon"
-description: "Hvordan denne side er bygget: Astro, Bun, Tailwind, self-hosted alt, og ingen JS-frameworks."
+description: "Hvordan denne side er bygget: Zola, Tailwind, self-hosted alt, og ingen JS-frameworks."
 template: sider/colophon.html
 ---

data/colophon.json

@@ -2,15 +2,15 @@
  "stack": [
   {
    "k": "Generator",
-   "v": "Astro 5: statisk output, view transitions, content collections til bloggen"
+   "v": "Zola: statisk output, view transitions, page bundles til bloggen"
   },
   {
    "k": "Runtime",
-   "v": "Bun (build og dev)"
+   "v": "Ingen Node i byggekæden: Zola er én binær, og scripts i CI er Python"
   },
   {
    "k": "CSS",
-   "v": "Tailwind 4 med egne design-tokens; dark/light sat pre-paint uden flash"
+   "v": "Tailwind 4 (standalone-CLI) med egne design-tokens; dark/light sat pre-paint uden flash"
   },
   {
    "k": "Typografi",
@@ -22,7 +22,7 @@
   },
   {
    "k": "PWA",
-   "v": "Workbox service worker, siden virker offline og kan installeres"
+   "v": "Håndskrevet service worker, siden virker offline og kan installeres"
   },
   {
    "k": "Kommentarer",

data/uses.json

@@ -58,7 +58,7 @@
    "title": "Denne side",
    "items": [
     {
-     "name": "Astro 5 + Bun + Tailwind 4",
+     "name": "Zola + Tailwind 4",
      "note": "Statisk output, ingen JS-frameworks i browseren. Se kolofonen for detaljer."
     }
    ]

scripts/postbuild.py

@@ -2,6 +2,7 @@
 """Efterbehandling af Zolas output i public/:
 
 - overskrift-id'er som på den gamle side (bevarer æøå, så gamle #ankre stadig virker)
+- kodeblokke og tabeller ruller inden i sig selv og kan nås med tastatur
 - sitemap-index.xml + sitemap-0.xml med lastmod fra git og frontmatter
 - sw.js med precache-liste
 - PW_PREVIEW=1: hele sitet flyttes ind under /udkast, uden sitemap og service worker
@@ -31,7 +32,7 @@ def slug(text):
     return s.replace(" ", "-").removesuffix("-")
 
 
-def heading_ids():
+def prose():
     for f in pages():
         src = f.read_text()
         if 'class="prose' not in src:
@@ -44,8 +45,10 @@ def heading_ids():
             seen[s] = n + 1
             return f'<h{m[1]} id="{s}-{n}"{m[2]}>' if n else f'<h{m[1]} id="{s}"{m[2]}>'
 
-        f.write_text(re.sub(r'<h([1-6]) id="[^"]*"([^>]*)>(.*?)(?=</h\1>)',
-                            lambda m: fix(m) + m[3], src, flags=re.S))
+        src = re.sub(r'<h([1-6]) id="[^"]*"([^>]*)>(.*?)(?=</h\1>)', lambda m: fix(m) + m[3], src, flags=re.S)
+        src = src.replace('<pre class="giallo"', '<pre tabindex="0" class="giallo"')
+        src = src.replace("<table>", '<div class="tabel" tabindex="0"><table>').replace("</table>", "</table></div>")
+        f.write_text(src)
 
 
 def git_date(*files):
@@ -120,7 +123,7 @@ def service_worker():
     """Precache-listen afhænger af buildet, resten af sw.js ligger i scripts/sw.js."""
     exts = {".html", ".css", ".js", ".svg", ".png", ".woff2", ".xml", ".txt", ".webmanifest"}
     files = sorted(p for p in OUT.rglob("*") if p.is_file() and p.suffix in exts
-                   and p.name not in ("sw.js", "mermaid.min.js"))
+                   and p.name != "sw.js")
     h = hashlib.sha256()
     for p in files:
         h.update(p.read_bytes())
@@ -145,7 +148,7 @@ def rebase():
 
 def main():
     (OUT / "sitemap.xml").unlink(missing_ok=True)
-    heading_ids()
+    prose()
     if PREVIEW:
         rebase()
     else:

scripts/sw.js

@@ -8,7 +8,7 @@ self.addEventListener('install', (e) => {
   e.waitUntil(caches.open(CACHE).then((c) => c.addAll(URLS)).then(() => self.skipWaiting()));
 });
 
-// Rydder forrige version, også de gamle workbox-caches.
+// Rydder forrige version og caches fra tidligere service workers.
 self.addEventListener('activate', (e) => {
   e.waitUntil(caches.keys()
     .then((keys) => Promise.all(keys.filter((k) => k !== CACHE).map((k) => caches.delete(k))))

static/humans.txt

@@ -6,7 +6,7 @@
 
 /* SITE */
   Sprog: dansk
-  Stak: Astro + Bun + Tailwind, statisk output
+  Stak: Zola + Tailwind standalone, statisk output
   Hosting: egen Proxmox-infrastruktur (LXC), nginx bag NPMplus
   CI/CD: self-hosted Gitea Actions
   Ingen JS-frameworks.

templates/indlaeg.html

@@ -52,31 +52,6 @@
   })();
 </script>
 {%- endif %}
-<script>
-  // Mermaid-diagrammer: ```mermaid-blokke rendres client-side. Scriptet (self-hosted)
-  // hentes KUN på indlæg der faktisk har diagrammer.
-  (function () {
-    var blocks = document.querySelectorAll('code[data-lang="mermaid"]');
-    if (!blocks.length) return;
-    var s = document.createElement('script');
-    s.src = (document.documentElement.dataset.base || '') + '/js/mermaid.min.js';
-    s.onload = async function () {
-      mermaid.initialize({ startOnLoad: false,
-        theme: document.documentElement.dataset.theme === 'light' ? 'default' : 'dark' });
-      var i = 0;
-      for (var code of blocks) {
-        try {
-          var r = await mermaid.render('mmd-' + i++, code.textContent);
-          var el = document.createElement('div');
-          el.className = 'mermaid-diagram';
-          el.innerHTML = r.svg;
-          code.closest('pre').replaceWith(el);
-        } catch (_) { /* lad kodeblokken stå hvis diagrammet ikke parser */ }
-      }
-    };
-    document.head.appendChild(s);
-  })();
-</script>
 <script>
   (function () {
     document.querySelectorAll('.prose pre').forEach(function (pre) {

templates/partials/banner.html

@@ -5,6 +5,6 @@
   / ___ \ ___) | |_| | |___|  _ <
  /_/   \_\____/ \____|_____|_| \_\
 
-  Statisk Astro, self-hosted på Proxmox.
+  Statisk Zola, self-hosted på Proxmox.
   Prøv Cmd/Ctrl+K.. eller den gamle kode: op op ned ned venstre højre venstre højre B A.
 -->