[jbspeakr]

Requested by Jan · project thread

What this changes

Review follow-up 4, reworked after the first version: the filters and the drawing felt disconnected, and the phone got a squeezed desktop drawing. The proposal behind this is "Standards map: a second take" in the project.

Head. h1 is "The standards map" (plan 5.1). The three counts move into the lede. The "Recently revised" line goes; it is a view of the map now (below).

The rail is the legend, the filter and the reading pane. Beside the drawing:

• relation types as toggles, each drawn as its own line sample. References are off by default (22 of 67 lines, the least telling), so the map opens as a dependency tree;
• publishing bodies as toggles. A band label inside the drawing toggles the same body;
• the maturity chips, the live count, a reset;
• a card that names the hovered or focused node's relations in words ("builds on OAuth 2.0; is profiled by 3").

The toggles are plain checkboxes. Stylesheet rules on :has() hide what an unchecked toggle covers, in the drawing and in the outline, so filtering needs no JavaScript. An unchecked toggle fades its line sample and drops its label to the second ink, which keeps the label's contrast. The island only keeps the count, mirrors the state in the URL (?type=…&body=…&view=recent), shows the card and highlights the neighbourhood.

Layout by ELK at build time. src/lib/graph.ts hands the dependency relations (builds-on, profiles, replaces) to elkjs (layered, orthogonal routing, merged edges, model order kept). A spec sits a column right of what it builds on (FR-005), each column groups by body in BODY_ORDER behind a tinted band with the body's name, and dependency edges are routed around nodes instead of curving through them. Cross links stay curves over the drawing. elkjs is a dev dependency, runs only during astro build, ships 0 bytes and is deterministic; plan 016 gets the deviation note. The drawing fills the column at full height, so the frame does not scroll inside the page.

Phones get an outline, not a drawing. Below 40rem the SVG is hidden and StandardsOutline.astro shows the dependency forest (buildForest): 4 trees (OAuth 2.0, WIMSE architecture, SD-JWT, eIDAS 2) plus the standalone and withdrawn documents, indented by builds-on, cross links as <details> chips that open the named documents in place, the builds-on spine as a hairline. The outline is on every screen: it replaces the flat list and carries body, family, revision and both links (FR-015), so the page is shorter.

Recently revised as a view. A "Recently revised" toggle in the rail fades everything but the five dated nodes; those carry their revision date on the node.

Tests. e2e: filtering without JavaScript, references off by default, an unchecked toggle keeping its label contrast, the outline on phones, the reading pane, the recent view, the frame with no inner scroll, hover/focus/spine on the visible drawing. Unit: layoutGraph (columns, bands, borders, polylines vs curves, determinism) and buildForest. tasks.md gets R-04.

Screenshots

From astro preview of this branch at 1440 px and Pixel 7, reduced motion. Before: main (first row), as in the earlier version of this description.

	Before (main)	After
desktop, light
desktop, dark
desktop, hovering PKCE
desktop, recently revised view
the whole drawing	(old map, phone crop)
phone, light
phone, dark
phone, the outline
phone, a chip opened

The screenshots were committed once for stable URLs and removed in the next commit, so the squashed diff carries no images.

Code checklist

• pnpm check passes.
• The page reads fully without JavaScript, and now filters without it too.
• Both themes checked; reduced motion keeps the spine complete.
• One new dev dependency, elkjs, with the deviation noted in plan 016.
• Screenshot baselines: the standards page and its greyscale shot change as intended, regenerated by the refresh-screenshots workflow on this head.

🤖 Generated with Claude Code

https://claude.ai/code/session_015K8n6c3uztMvwMXWSzxJW1