Web UI: navigation, Juniper-derived design system, accessibility floor

One shared stylesheet (static/app.css) replaces the two ad-hoc style
blocks, with tokens drawn from the mascot drawing: sky background,
cream game-board cards inside confident outlines with flat offset
shadows, hair-purple for brand and actions, shirt-green for go,
bow-tie orange for danger, pipe-fitting gold for trim, jeans navy for
chrome — and the rainbow game path as a stripe under the header, the
one loud element. Accent colors split into object and *-ink variants
so text on light surfaces holds AA contrast.

Navigation: both pages share a header with brand-home link, a Primary
nav with aria-current, and tally counts that link to the lists they
count (dashboard tallies deep-link into the review catalog; review
tallies jump to their sections). Accessibility: skip link, landmark
nav, polite live region for stage activity, status role on banners,
the dropzone is a real button, candidate rows are focusable and
activate with Enter/Space, focus-visible ring throughout, reduced
motion respected.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Eric Wagoner
2026-08-02 17:21:14 -04:00
parent 6ecdd43ed2
commit d3cf0c6151
6 changed files with 432 additions and 367 deletions
+1 -1
View File
@@ -27,7 +27,7 @@ Full design lives in `bgg-shelf-pipeline-spec.md` (read it before changing pipel
## Layout
- `src/bggpipe/``cli.py` (typer app), one module per stage (`extract`, `resolve`, `review` + `webreview`, `diff`, `upload`, `enrich`), plus `bgg_client.py` (rate-limited XML API2 client that caches responses to `data/bgg_cache/`), `jobs.py` (single-slot background stage runner for the web UI), `normalize.py` (title normalization), `models.py` (dataclasses), `config.py`, `fsio.py` (atomic writes), `init_wizard.py` (first-run setup).
- `src/bggpipe/``cli.py` (typer app), one module per stage (`extract`, `resolve`, `review` + `webreview`, `diff`, `upload`, `enrich`); `templates/` + `static/app.css` are the web UI (one shared stylesheet is the design system — its tokens derive from the mascot art), plus `bgg_client.py` (rate-limited XML API2 client that caches responses to `data/bgg_cache/`), `jobs.py` (single-slot background stage runner for the web UI), `normalize.py` (title normalization), `models.py` (dataclasses), `config.py`, `fsio.py` (atomic writes), `init_wizard.py` (first-run setup).
- `scripts/``write_stub_fixtures.py` / `write_photo_fixtures.py` generate synthetic fixtures; `record_fixtures.py` re-records real API responses once a token exists.
- `tests/fixtures/bgg_cache/` — stub XML fixtures the offline tests run against.
- `data/` — pipeline state (CSV/JSON artifacts are committed; caches are not — see Git).