From df56450813b04c09cd24783c6ae3093f189c4519 Mon Sep 17 00:00:00 2001
From: batsumaru <>
Date: Wed, 1 Jul 2026 17:46:11 +0900
Subject: Add scientifica bitmap font and wire it into the status page

Bundle scientifica.ttf/Bold/Italic in statuspage/fonts/ (dropped the
.bdf/.otb variants - those are X11/console bitmap formats, browsers
can't load them via @font-face). Mark font extensions as binary in
.gitattributes so git never attempts CRLF conversion on them.

render.sh now symlinks fonts/ into the Caddy-served output directory
on every run (idempotent) since Caddy serves /usr/local/www/status,
not this checkout - the font file has to physically exist next to
index.html for the browser to fetch it.

Also: fixed bad kerning/cramped line spacing from an earlier attempt
at applying the font's recommended Terminal.app settings (which don't
translate 1:1 to CSS), and added a hanging indent (.label class,
text-indent + padding-left) so long wrapped label text - notably
pf.sh's rule listing - aligns under the label instead of the status
square when it wraps to a second line.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 statuspage/fonts/scientifica.ttf       | Bin 0 -> 120736 bytes
 statuspage/fonts/scientificaBold.ttf   | Bin 0 -> 108444 bytes
 statuspage/fonts/scientificaItalic.ttf | Bin 0 -> 122064 bytes
 statuspage/render.sh                   |  14 ++++++++++++--
 4 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 statuspage/fonts/scientifica.ttf
 create mode 100644 statuspage/fonts/scientificaBold.ttf
 create mode 100644 statuspage/fonts/scientificaItalic.ttf

(limited to 'statuspage')

diff --git a/statuspage/fonts/scientifica.ttf b/statuspage/fonts/scientifica.ttf
new file mode 100644
index 0000000..1753d31
Binary files /dev/null and b/statuspage/fonts/scientifica.ttf differ
diff --git a/statuspage/fonts/scientificaBold.ttf b/statuspage/fonts/scientificaBold.ttf
new file mode 100644
index 0000000..0cd01a7
Binary files /dev/null and b/statuspage/fonts/scientificaBold.ttf differ
diff --git a/statuspage/fonts/scientificaItalic.ttf b/statuspage/fonts/scientificaItalic.ttf
new file mode 100644
index 0000000..ef29a47
Binary files /dev/null and b/statuspage/fonts/scientificaItalic.ttf differ
diff --git a/statuspage/render.sh b/statuspage/render.sh
index 301b85d..aec302c 100755
--- a/statuspage/render.sh
+++ b/statuspage/render.sh
@@ -12,11 +12,17 @@ set -u
 SELF_DIR=$(cd "$(dirname "$0")" && pwd)
 CHECKS_DIR="$SELF_DIR/checks"
 OUT=${STATUSPAGE_OUT:-/usr/local/www/status/index.html}
+OUT_DIR=$(dirname "$OUT")
 HOST=$(hostname)
 NOW=$(date "+%Y-%m-%d %H:%M:%S %Z")
 
 . "$SELF_DIR/lib/common.sh"
 
+# Caddy serves $OUT_DIR, not this checkout - symlink the font files in so
+# the @font-face rules below can actually fetch them. Idempotent, cheap
+# enough to just check every run rather than a separate one-time setup step.
+[ -L "$OUT_DIR/fonts" ] || ln -sf "$SELF_DIR/fonts" "$OUT_DIR/fonts" 2>/dev/null || true
+
 JSONL=$(mktemp)
 AWKFILE=$(mktemp)
 trap 'rm -f "$JSONL" "$AWKFILE"' EXIT INT TERM
@@ -120,13 +126,17 @@ END {
     print "<title>" htmlesc(host) " status</title>"
     print "<meta http-equiv=\"refresh\" content=\"30\">"
     print "<style>"
-    print "body { background:#15111d; color:#e4dcee; font-family: monospace; padding: 2em; }"
+    print "@font-face { font-family: 'scientifica'; src: url('fonts/scientifica.ttf') format('truetype'); font-weight: normal; font-style: normal; }"
+    print "@font-face { font-family: 'scientifica'; src: url('fonts/scientificaBold.ttf') format('truetype'); font-weight: bold; font-style: normal; }"
+    print "@font-face { font-family: 'scientifica'; src: url('fonts/scientificaItalic.ttf') format('truetype'); font-weight: normal; font-style: italic; }"
+    print "body { background:#15111d; color:#e4dcee; font-family: 'scientifica', monospace; font-size: 16px; line-height: 1.4; padding: 2em; }"
     print "h1 { color: #e0c3ff; margin-bottom: 0; display: inline-block; border-bottom: 2px solid #d9a441; padding-bottom: 6px; }"
     print "h2 { color: #c084fc; border-bottom: 1px solid #3a2b4a; padding-bottom: 4px; }"
     print ".cols { column-width: 380px; column-gap: 2.5em; }"
     print ".section { break-inside: avoid; -webkit-column-break-inside: avoid; display: inline-block; width: 100%; vertical-align: top; margin-bottom: 1.5em; }"
     print "table { border-collapse: collapse; width: 100%; }"
     print "td { padding: 6px 10px; border-bottom: 1px solid #241c30; }"
+    print "td.label { padding-left: 28px; text-indent: -18px; }"
     print ".sq { display:inline-block; width:12px; height:12px; border-radius:2px; margin-right:6px; vertical-align:middle; }"
     print ".green { background:#3c3; }"
     print ".yellow { background:#cc3; }"
@@ -149,7 +159,7 @@ END {
         print "<table>"
         for (j = 1; j <= count[sect]; j++) {
             valcell = (V[sect, j] == "") ? "" : "<td class=\"val\">" htmlesc(V[sect, j]) "</td>"
-            print "<tr><td><span class=\"sq " sqclass(S[sect, j]) "\"></span>" htmlesc(L[sect, j]) "</td>" valcell "</tr>"
+            print "<tr><td class=\"label\"><span class=\"sq " sqclass(S[sect, j]) "\"></span>" htmlesc(L[sect, j]) "</td>" valcell "</tr>"
         }
         print "</table>"
         print "</div>"
-- 
cgit v1.3