feat(homepage): rebuild the theme on canonical Australis tokens

The predecessor theme was ugly for two structural reasons, not one.

It did not use the design system's colours. It built a parallel OKLCH
palette "derived from the Australis philosophy" and swapped the canonical
typeface for Supreme -- a fork, not a theme. Every hex here is now copied
verbatim from ~/.claude/skills/australis-design/colors_and_type.css, and
build.py re-checks all 19 against that file at build time and warns on
drift so it cannot quietly fork again. Type is the canonical stack: Space
Grotesk / Inter / JetBrains Mono, vendored as latin-subset VARIABLE woff2
(one file per family, 102 KB total against 56 KB for three static Supreme
cuts, and no Google Fonts request at page load).

It also carried a generated full-bleed aurora image behind the entire
dashboard. Canon forbids exactly that -- "solid fills only on chrome, no
full-bleed photography, no decorative gradients", and the aurora motif
"never as a background fill behind text". The predecessor knew, said so in
its own header, and dialled the opacity down rather than dropping it. The
image is gone; the aurora survives as a 1px accent edge under the tab bar,
which is where canon sanctions it. The asset stays in images/ in case it
is ever revisited.

Direction is instrument panel. Group headings become the Australis mono
eyebrow with a hairline to the right edge -- canon calls the eyebrow a
system signature, and it turns the groups into register bands instead of
headings floating over a grid. Status stops shouting: the filled emerald
chips read louder than the service names they annotated, so they are now a
semantic dot plus a mono micro-label at tertiary contrast. Cards are
bordered and opaque, per canon's border-over-shadow rule for chrome.

Alignment, per operator feedback that pills and cards did not line up:

- The status cluster is centred on the service name's line rather than
  parked in the card's top-right corner, where Homepage's `absolute top-0`
  left it floating ~7px above the title's optical centre. The offsets
  reconstruct the title line box and are documented as moving together.
- Descriptions get a two-line minimum, so the common one-line/two-line mix
  bottom-aligns across a row. This is what made the grid look ragged.
  useEqualHeights stays false: it inflated short cards to match a widget
  card twice their height, which was the worse failure.
- The status dot is flex-centred rather than nudged with vertical-align,
  so it stays centred if the type scale changes.

Retires the Skyfall sources and the Supreme faces; theme/ now has one
source of truth.
This commit is contained in:
vh
2026-08-19 09:14:13 -07:00
parent b92097688c
commit b271db1f44
14 changed files with 1076 additions and 1369 deletions
File diff suppressed because one or more lines are too long
+23 -25
View File
@@ -3,31 +3,26 @@
title: ... all my base ...
theme: dark
# `color:` only accepts Homepage's built-in Tailwind ramps, and none of them is
# the Skyfall Sea ramp. slate is the nearest cool neutral and acts as the base
# under conf/custom.css, which is where the real palette lives.
# the Australis Sea ramp. slate is the nearest cool neutral and acts as the
# base under conf/custom.css, which is where the real palette lives.
color: slate
# Background — generated locally, not stock art. Arbo (irv-ml1:8201) rendered
# it from the `t2i-ui-background` workflow: abstract full-bleed, no subject,
# aurora blue->cyan->green on near-black, which is the one decorative motif
# Australis Skyfall permits and its "cool temperature always" imagery rule.
# Job 13f0891f4e42, seed 26, flux2-klein-9b, 2048x1152.
# NO `background:` BLOCK — DELIBERATE, DO NOT RE-ADD WITHOUT ASKING.
#
# Served from /app/public/images via the read-only mount in compose.yaml —
# NOT from the config dir, which Homepage will not serve static files out of.
# This carried a generated full-bleed aurora image (Arbo job 13f0891f4e42,
# seed 26, flux2-klein-9b) at opacity 30. It went in on an explicit request
# for an Arbo-generated background and came out on 2026-08-19 when the
# operator called the result ugly.
#
# ⚠️ opacity is the load-bearing number, not decoration. Skyfall's rule is that
# the aurora motif never sits behind body text; this dashboard breaks that on
# purpose, so the image has to stay far enough back that card contrast never
# suffers. The render is considerably brighter than the "mostly empty" brief,
# which is exactly what this dials out. Raise it and the cards start fighting
# the ribbon.
background:
image: /images/skyfall-aurora.webp
blur: sm
saturate: 90
brightness: 90
opacity: 30
# The image was also against canon on its own terms: Australis says "solid
# fills only on chrome — no full-bleed photography, no decorative gradients",
# and permits the aurora motif "never as a background fill behind text". A
# whole dashboard is text. The predecessor knew and dialled the opacity down
# instead of dropping it, which is how you end up with a quiet version of the
# wrong thing. The asset is still in `images/` if this is ever revisited.
#
# The aurora now appears exactly where canon sanctions it: a 1px accent edge
# under the tab bar, in conf/custom.css.
headerStyle: boxedWidgets
providers:
@@ -43,10 +38,13 @@ quicklaunch:
showStats: false
statusStyle: ""
# Force all cards in a row to match the tallest card's height. Without
# this, widget-bearing cards (Plex stats, Traefik metrics) stand taller
# than plain link cards and the grid looks ragged.
useEqualHeights: true
# Cards size to their own content. This was `true` to stop widget-bearing
# cards (Uptime Kuma's stat strip, Paperless's counts) standing taller than
# plain link cards and leaving the grid ragged — but the cure was worse than
# the disease: every short card in the row inflated into a hollow box to match
# the tall one. A ragged bottom edge reads as content; a stretched empty card
# reads as a rendering fault.
useEqualHeights: false
# Function-first layout, four-tab split:
# Main - daily-use apps, media, bookmarks, monitoring