Design/neutral tokens and login - #24
Merged
Merged
Conversation
Dark theme greys were all hue-286 (blue/mauve cast). Swapped for the neutral palette from the Paper file (tripwire / rework) — every grey is now equal-RGB. Adds --accent-blue for the rule/workflow toggle "on" state, exposed as the accent-blue Tailwind color. - background #0d0d0d, card #262626, muted/well #171717, border 10% white - surface-0 inset shell / surface-1 well / surface-2 raised card - login: card layout from the "new login" artboard, using the existing Dither, Button and TripwireLogo components Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Rule card follows the new spec: surface-2 shell with the header sitting on it, body and subordinate actions moved into a recessed surface-1 well. Drops the dither from custom rule headers — no rules carry a dither, custom included. Switch turns accent-blue when on. Raw <button> swapped for the Button primitive throughout (enable, re-confirm, delete rule). Login: dev personas collapsed into its own bubble instead of sitting open; inset panel now bg-surface-1 to match the dashboard shell. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Card matches the rule card construction (surface-2 shell, 10px radius, p-1). The house dither now renders only on enabled workflows — a disabled card reads flat, per the design comments. Switch turns accent-blue when on. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
The header was one wrapping flex row with the stat+toggle pushed right by ml-auto. A third chip (block + custom + medium) left the rail nowhere to go, so it wrapped to a second line, doubling the header height and knocking every card in the grid out of alignment. Splits it into two lanes that can't collide: an identity column that truncates (min-w-0) with chips on their own row, and a shrink-0 rail holding the sparkline, a fixed 32px stat column and the toggle. Any number of chips now leaves the rail where it is. Also unifies chip styling behind one CHIP constant — severity becomes a 5px dot instead of a filled amber pill that out-shouted the rule name — and moves delete into the well's action lane so every card's actions sit on one line. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
…Boring-Software-Inc/v2 into design/neutral-tokens-and-login
The dither was scoped to the header row and static. In the design it backs the entire card and animates — moved it to the card root as the first child at speed 1.22, still enabled-only so disabled cards stay flat. Custom rules empty state: card moves to the surface-2 shell with the dither behind the whole card (the one rules surface that keeps one), copy and the white new-rule button centred in a surface-1 well. Drops the dither prop from that button. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
The workflow card had no body well, so moving the dither to the card root let it bleed through the whole card. The design's body layer is named "body (filled)" for a reason: it's an opaque surface-1 well that covers the dither, leaving the texture visible only in the header band and the 2px gutters around it. Card metrics were also 2x off — computed styles are padding 2px and gap 4px, not the 4/8 I used. Corrected on all three cards (workflow, rule, custom rules empty state), and the well is rounded-md with px-2 py-1 to match. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
…Boring-Software-Inc/v2 into design/neutral-tokens-and-login
seven design/review skills — accessibility, colors, interface, layout, typography, ui, writing — under .agents/skills, symlinked into .claude/skills so both harnesses resolve them. skills-lock.json records the pinned set.
token layer: - split destructive into three roles (text / surface / on-surface). dark `text-destructive` measured 1.50–1.93:1 against the surface ladder — form errors were near-unreadable. now 4.82–6.19 dark, 4.56–5.53 light. fills keep their old values so buttons and badges render identically. - add `brand-text`; `brand` as text was 3.42:1 on white. - drop the dead `--font-pixel` token (silkscreen was never loaded) and the two unimported fontsource deps it implied. accessibility: - motion is opt-in: MotionConfig reducedMotion="user" for framer, a media query for css keyframes. the spinner is exempt. - add the `main` landmark and a skip link — the app had neither. - inset dialog gains a focus trap, focus restore, and an accessible name; its backdrop is no longer a viewport-sized tab stop. same for the palette. - skeletons are aria-hidden; route transitions announce once instead. - inputs render at 16px under sm so ios stops zooming on focus. - restore focus rings on three controls that killed them outright. - name every nav landmark, chip remove, and rule toggle. fixes: - workflow cards were entirely unclickable: the stretched link had no z-index, so the header and body painted over it. link to z-10, controls to z-20. - the skip link rendered as a visible blob — react-grab writes an inline clip-path that beats sr-only. park it off-screen by transform instead. - switch `tone` prop replaces a dead `data-[state=checked]` class that never matched base-ui's `data-checked`. also: remove the redundant view-raw disclosure from rule cards, feedback form gets real labels and keeps submit enabled, and commitlint now guards commit-msg (see DECISIONS.md — the config accepts the `TRP-123 ` prefix, which stock conventional-commits rejects).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.