yolo/arr
3
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

Colour-code state chips #165

New Issue
Closed
opened 2026-08-24 11:23:47 +01:00 by naps62-yolo · 0 comments
naps62-yolo commented 2026-08-24 11:23:47 +01:00
Owner
Copy Link
Copy Source

Chips are monochrome, so a season row does not say at a glance whether it is
satisfied, waiting on a grab, or not tracked at all.

Per the amended §4.2, the status palette becomes a state ramp:

  • on disk / complete — green (--signal-ok)
  • wanted but not yet found — amber (--signal-warn)
  • downloading — violet (--status-airing)
  • untracked — neutral
  • TMDB rating stars — amber

Every token already exists in web/src/style.css.

What to change

Apply the ramp wherever a chip carries one of those states:

  • the season counts chip (N/M on disk) — green when N == M and M > 0,
    amber when episodes are wanted and missing, neutral when the season is
    untracked and nothing is wanted
  • episode state chips
  • the derived-status chip (§4.2: airing, incomplete, waiting, complete,
    ended)
  • movie state chips, so movies and series read the same
  • the rating star in starIcon, and its smaller .row-rating variant

Drive it from data attributes on the chip, as the stylesheet already does for
data-verdict and data-status. No inline styles.

Constraints

The word stays in every chip. Colour is an accelerator, never the only carrier
of state — that part of §4.2's original reasoning survives the amendment, and
the amended text says so.

Contrast: these sit on --panel-raised at small text sizes. Check each
foreground against its actual background rather than trusting the token names.

Done looks like

  • A fully-satisfied season reads green, one with missing wanted episodes amber,
    a downloading one violet, an untracked one neutral.
  • Rating stars are amber everywhere they appear, detail pages and search rows
    alike.
  • Verified in the browser against a real library, not only a fixture.

Non-goals

  • Geometry is owned by the control-sizing issue this one depends on. Do not
    resize anything here.
  • Release verdict chips (eligible / waived / rejected, §9.3) keep the
    colours they have. That scheme is already deliberate and is not part of this
    change.

Depends on: #159, #164

Chips are monochrome, so a season row does not say at a glance whether it is satisfied, waiting on a grab, or not tracked at all. Per the amended §4.2, the status palette becomes a state ramp: - on disk / complete — green (`--signal-ok`) - wanted but not yet found — amber (`--signal-warn`) - downloading — violet (`--status-airing`) - untracked — neutral - TMDB rating stars — amber Every token already exists in `web/src/style.css`. ## What to change Apply the ramp wherever a chip carries one of those states: - the season counts chip (`N/M on disk`) — green when `N == M` and `M > 0`, amber when episodes are wanted and missing, neutral when the season is untracked and nothing is wanted - episode state chips - the derived-status chip (§4.2: `airing`, `incomplete`, `waiting`, `complete`, `ended`) - movie state chips, so movies and series read the same - the rating star in `starIcon`, and its smaller `.row-rating` variant Drive it from data attributes on the chip, as the stylesheet already does for `data-verdict` and `data-status`. No inline styles. ## Constraints The word stays in every chip. Colour is an accelerator, never the only carrier of state — that part of §4.2's original reasoning survives the amendment, and the amended text says so. Contrast: these sit on `--panel-raised` at small text sizes. Check each foreground against its actual background rather than trusting the token names. ## Done looks like - A fully-satisfied season reads green, one with missing wanted episodes amber, a downloading one violet, an untracked one neutral. - Rating stars are amber everywhere they appear, detail pages and search rows alike. - Verified in the browser against a real library, not only a fixture. ## Non-goals - Geometry is owned by the control-sizing issue this one depends on. Do not resize anything here. - Release verdict chips (`eligible` / `waived` / `rejected`, §9.3) keep the colours they have. That scheme is already deliberate and is not part of this change. --- Depends on: #159, #164
naps62-yolo added this to the Feedback pass milestone 2026-08-24 11:23:47 +01:00
naps62-yolo added the phase/5-uitype/featuredifficulty/moderatearea/web labels 2026-08-24 11:23:47 +01:00
naps62-yolo added a new dependency 2026-08-24 11:23:53 +01:00
#159 Amend DESIGN.md for the feedback pass
naps62-yolo added a new dependency 2026-08-24 11:23:53 +01:00
#164 Unify control and chip geometry at 2rem
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
area/api
arr-api
 area/ci
CI and test harness
 area/compat
arr-compat
 area/core
arr-core
 area/daemon
arr-daemon
 area/db
arr-db
 area/dl
arr-dl
 area/indexer
arr-indexer
 area/infra
workspace and tooling
 area/meta
arr-meta
 area/parse
arr-parse
 area/probe
arr-probe
 area/subs
arr-subs crate: providers, extraction, translation, sync
 area/web
web/
 difficulty/easy
bounded, obvious approach, few files
 difficulty/hard
subtle correctness or cross-cutting
 difficulty/moderate
multiple files, judgement, an interface to design
 difficulty/trivial
one file, mechanical, no design decisions
 phase/1-skeleton
workspace, CI, config, database, empty API and SPA
 phase/2-logic
parsing and policy engine, pure, no network
 phase/3-sourcing
TMDB and Prowlarr, read-only
 phase/4-movies
movies end to end
 phase/5-ui
search, buckets, library views, queues
 phase/6-tv
seasons, episodes, tracking, derived status
 phase/7-people
owner tags and notifications
 phase/8-compat
Jellyseerr shim
 phase/9-subtitles
build order: subtitles, DESIGN.md §15
 type/bug
type/chore
type/feature
type/test
No labels area/web difficulty/moderate phase/5-ui type/feature
Milestone
No items
No Milestone Feedback pass
Projects
Clear projects
No projects
Assignees
Clear assignees
hermes (Hermes (agent)) naps62 (Miguel Palhas) naps62-yolo (naps62-yolo (agent))
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Depends on
#159 Amend DESIGN.md for the feedback pass
yolo/arr
#164 Unify control and chip geometry at 2rem
yolo/arr
Reference: yolo/arr#165