Re-theme the UptimeFlare fork's chrome (surfaces, borders, type, header
wordmark, footer line) to the openshopgraph.org design tokens, sourced
from openshopgraph-frontend-v2 src/styles/site-tokens.css. Monitor set,
check logic and page title/links config are untouched.
- Copy the site's self-hosted Cabinet Grotesk / Switzer / Martian Mono
woff2 faces (~124 KB) into public/fonts and remap Mantine's CSS
variables (--mantine-font-family[-headings/-monospace]) to the same
stacks; drop the next/font/google Inter import (font-CDN-free, same
rule as the main site's CSP).
- Remap Mantine surface/text/border variables per color scheme
(--mantine-color-body/text/white/dark-6/dark-4/anchor/dimmed,
--mantine-primary-color-filled) to --paper/--ink/--card/--hair from
site-tokens.css; keeps following prefers-color-scheme via Mantine's
existing defaultColorScheme="auto" script, matching the main site's
light/dark behavior. Semantic monitor-state colors (green/red icons)
are left alone on purpose.
- Bump --mantine-radius-{sm,md,lg} to the main site's softer values.
- Replace the generic UptimeFlare <Image> logo in Header.tsx with the
OSG two-dot wordmark (same glyph as BaseLayout.astro's .top-brand
mark), linking to https://openshopgraph.org.
- Set pageConfig.customFooter to a one-line footer matching the main
site's "Verified data, not ads." tone instead of the stock UptimeFlare
attribution line.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
b9f8546044