Give every fastext destination a distinct mark; add skip-link, fix aria-label
All checks were successful
Deploy / deploy (push) Successful in 23s

Colours: "if the intent is to have them all different colors than
lets have them all different colors." The locked eight only give five
safe as full text (blue fails contrast, black's invisible on black),
so the other three get their own treatments instead of sharing plain
ink: Watch gets blue as a swatch-only accent (the button cap's colour,
not the label), Activity gets an ordered-dither swatch (the other
legal way to mark something without a ninth colour), and Settings
alone keeps plain ink deliberately, as the one page with no live
status of its own.

Accessibility (items 1 and 3 from the design review, item 2 skipped
per request — the header's download figure stays live and unmuted):
- Added a skip-link, off-screen until focused, jumping past the
  8-item top nav straight to each page's #main-content.
- Renamed the nav's aria-label from "Fastext" (meaningless without
  the visual teletext context) to "Page navigation".
This commit is contained in:
Barely Removable 2026-08-30 09:24:52 -07:00
parent 15936027de
commit 5dd49c505c
4 changed files with 79 additions and 28 deletions

View file

@ -105,18 +105,22 @@ the user's Unraid home server. Server-side project directory is still named
under the header on every page but the index — those pages carry no
other nav, so it needs no scroll to reach. The index overrides it
with `HOME_FASTEXT`, the original four-entry row, as its own closing
line, since its body already lists every destination once. The
original four (Index/Library/Discover/System) keep their `r`/`g`/
`y`/`c` keyboard shortcut and colour; Requests also gets a colour
(magenta, `--pending`) without a shortcut — a deliberate fit, not
an arbitrary fifth pick, since Requests already is "waiting on a
human" everywhere else magenta appears. That's the ceiling: the
locked eight colours leave exactly five that read as legible text
on black (blue fails contrast there, black is invisible), so Watch/
Activity/Settings share plain ink rather than a sixth colour that
doesn't exist in this palette. Whichever entry matches the current
page renders as a `.fastext-here` span instead of a link — a page
linking to itself did nothing, so it isn't offered as a click.
line, since its body already lists every destination once. Every
destination gets its own distinct mark — the locked eight colours
only give five that read as legible text on black, so getting to
eight took three treatments: five flat colours as text+swatch
(Index/Library/Discover/System keep their `r`/`g`/`y`/`c` shortcut;
Requests gets magenta/`--pending` with no shortcut — a deliberate
fit, since Requests already is "waiting on a human" everywhere else
magenta appears); Watch gets blue as a swatch-only accent (`.k-blue`
— blue fails contrast as body text, so only the small cell carries
it, not the row's own label); Activity gets an ordered-dither swatch
(`.k-dither`, same mechanism as `--dither-mid`) rather than a flat
colour. Settings alone keeps plain ink with no swatch treatment —
deliberately, as the one page with no live status of its own.
Whichever entry matches the current page renders as a
`.fastext-here` span instead of a link — a page linking to itself
did nothing, so it isn't offered as a click.
- **Nothing is clipped, hidden, or sticky.** All seven page numbers and
every fastext entry stay visible at every width, reflowing to another
row rather than scrolling, truncating, or folding into a menu. No