Skip to content

Consolidate main-window styles into one design system - #892

Merged
enaboapps merged 2 commits into
mainfrom
882-design-system
Sep 25, 2026
Merged

enaboapps merged 2 commits into
mainfrom
882-design-system

Conversation

@enaboapps

@enaboapps enaboapps commented Sep 25, 2026 •

Copy link
Copy Markdown
Contributor

Closes #882. First layer of the stack tracked in #891.

What changed

  • src/styles.css now only declares layers and imports. The legacy compact stylesheet and the large-target overrides are merged into one components layer in src/ui/app.css, ordered tokens, base, controls, page areas, responsive.
  • Button, Input and Select no longer carry Tailwind size utilities, which outranked every variant. Their shape lives in .btn and .field-control, so variants can differ.
  • Button variants now have distinct weight: primary (filled brand), secondary (outlined), text, icon and danger (outlined error, filled error for confirmations).
  • Disabled controls turn neutral grey instead of fading brand red to pink. Inside a disabled fieldset the group still dims as a whole so the selected choice stays visible.
  • New tokens: strong border, disabled surface and ink, attention status, error border, radii and dialog shadow. Existing token names are kept.

Layout is otherwise unchanged. Later layers restyle rows, Home, tabs, forms, Switches, Mobile and dialogs.

Validation

Node 24.13.0, Rust 1.97.1, on this head:

  • npm run lint passed
  • npm test passed: 224 Vitest tests and 5 Node tests
  • npm run build passed
  • cargo fmt --check, cargo clippy --all-targets -D warnings passed
  • cargo test passed: 566 tests, 1 ignored
  • Rendered every view and dialog in headless Chrome at 920px and 620px, light and dark, and compared against main.

Review follow-up

An independent review of this layer's head raised these points, now addressed:

  • Disabled fields inside a disabled fieldset keep their normal colours, because the fieldset already dims the group. Before this, they dimmed twice.
  • Two layout differences from main are intentional. Profile rows now lay out as a grid instead of a centred row, and Scanning mode card content is left-aligned. Both came from Tailwind utilities that used to outrank the old rules.

🤖 Generated with Claude Code

Rebase validation (2026-09-25)

Rebased onto current main (7fb8fce, including #881) in stack order. git range-diff shows every commit in this PR is patch-equivalent to its previous head, and the intended parent remains its PR base. On the final stack tip (40c75cc), Node 24.19.0 lint, tests and build passed; Rust 1.97.1 format check, Clippy and tests passed. An independent review of the updated PR heads found no actionable findings. CI is rerunning on each new head.

@enaboapps enaboapps added this to the v1.0.0-rc.16 milestone Sep 25, 2026
@enaboapps
enaboapps marked this pull request as ready for review September 25, 2026 11:49
OwenMcGirr and others added 2 commits September 25, 2026 12:49
Merge the legacy compact stylesheet and the large-target overrides into a
single component layer with named tokens. Move Button, Input and Select
sizing from Tailwind utilities into .btn and .field-control so variants
can actually differ: primary, secondary, text, icon and danger now each
have their own weight, and disabled controls go neutral instead of
fading the brand red to pink.

Closes #882

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
A disabled fieldset already dims its whole group, so fields inside it
keep their normal colours rather than also turning grey, matching how
buttons are treated.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@enaboapps
enaboapps marked this pull request as draft September 25, 2026 11:50
@enaboapps
enaboapps marked this pull request as ready for review September 25, 2026 13:09
@enaboapps
enaboapps merged commit 593460e into main Sep 25, 2026
6 checks passed
@enaboapps
enaboapps deleted the 882-design-system branch September 25, 2026 13:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Consolidate main-window styles into one design system

2 participants