From 324091e0335cca833c4422f8aaf04a1e9f6f20de Mon Sep 17 00:00:00 2001 From: St33v Date: Wed, 10 Jun 2026 13:40:11 +1000 Subject: Memoir: radar follow-up session MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Captures the TLS-fallthrough fix, two more radars, cross-page nav, mobile sizing, and the Radars button on synoptic — all on 2026-06-10, day after the initial rollout. Co-Authored-By: Claude Opus 4.7 --- doc/radar-four-cities-and-nav.md | 97 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 97 insertions(+) create mode 100644 doc/radar-four-cities-and-nav.md diff --git a/doc/radar-four-cities-and-nav.md b/doc/radar-four-cities-and-nav.md new file mode 100644 index 0000000..de8a39b --- /dev/null +++ b/doc/radar-four-cities-and-nav.md @@ -0,0 +1,97 @@ +--- +title: "Radar follow-up — TLS, four cities, cross-page nav" +date-created: "2026-06-10" +type: "memoir" +status: "complete" +author: + - "st33v" + - "claude-opus-4-7" +model: + - "claude-opus-4-7" +tldr: "Short follow-up to the radar rollout the day before. Fixed an https→f3rr3t.com cert fall-through with certbot, added Canberra and Cairns, gave each radar page a nav strip with the others plus a Synoptic link, made the image fill mobile width without upscaling on desktop, and added a Radars button on the synoptic page." +chat-url: "https://claude.ai/chat/..." +session-kind: "infrastructure" +side-quests: 0 +reader-targets: + - "st33v" + - "claude-code" +related: + entities: + - "cremonde" + - "pestrel.com" + concepts: [] + songs: [] +tags: + - "bom" + - "radar" + - "nginx" + - "tls" + - "css" +provenance: + - "doc/bom-radar-rollout.md (previous day's memoir)" + - "doc/bom-radar-spec.md (v0.1)" +--- + +# Radar follow-up — TLS, four cities, cross-page nav + +## TL;DR + +The radar rollout left a few rough edges: HTTPS-curious browsers got bounced to f3rr3t.com because radar.pestrel.com had no TLS and no 443 default_server; the image was small on phones; only two radars; no easy way to move between them or back to the synoptic. Same-day fixes for all of them. + +## Context + +Continuing from `bom-radar-rollout.md` (2026-06-09). Sydney and Brisbane were live and looping; the next morning st33v reported the cert weirdness and asked for two more radars (IDR403 Canberra, IDR193 Cairns), mobile width, and inter-page navigation including a "Radars" button on the synoptic chart. + +## What was done + +### The HTTPS fall-through + +Diagnosis was quick once `/etc/nginx/conf.d/` was inspected: `radar.conf` only listened on port 80, and no server block on port 443 was marked `default_server`. So Chrome/Firefox's HTTPS-first upgrade for `radar.pestrel.com` hit 443 and nginx fell through to the alphabetically-first 443 block — `f3rr3t.conf`. User saw f3rr3t.com's cert + content, served from the same cremonde host. + +Fix: `sudo certbot --nginx -d radar.pestrel.com`, choosing redirect option 2. Pulled the resulting `radar.conf` back into the repo so the in-tree nginx config matches production. + +### Four cities + +Trivial extension thanks to the spec's product-code parameterisation: two more `ExecStart=-/opt/radar/radarFetch.sh IDRxxx` lines in `radar.service` and `radar-retry.service`, two more pages, two more dirs in setup.sh. No script changes. + +### Mobile sizing + +Original CSS used `img { max-width: 100%; max-height: 100vh; }`. `max-width` only constrains — doesn't expand — so on a 390px-wide phone the 512x512 BOM image stayed at 512 native and either overflowed or hit max-width and shrunk. Either way, not "filling width". Switched to: + +```css +img { width: 100%; max-width: 512px; max-height: 100%; height: auto; } +``` + +`width: 100%` makes it fill the container; `max-width: 512px` caps it at native resolution so desktop never upscales. Confirmed working full-width on phone. + +### Cross-page nav + +Layout shifted from "single-img full-bleed" to column flex: top `