polish(renderer): captionStyle variants, wired track colors, token cleanup, dead CSS, a11y#57
Merged
Merged
Conversation
…dead CSS, a11y Closes the Phase 6 polish items: - captionStyle now actually varies (it was decorative — karaoke/block/word all rendered the single active word). "word" keeps the single-word look; "block" shows the current phrase; "karaoke" shows the phrase with the active word in the accent color. Phrase grouping breaks on a speech pause or a length cap. captionLineAt/activeWordIndexAt are pure + unit-tested. - Timeline track colors wired: the markup emitted tl-chip-video/-text/-audio but no CSS consumed the --action-* design tokens; now tinted per type. - Raw hex -> token: the recording button's #c0392b -> --foreground-danger. - Dead CSS removed from styles.css (~120 lines: .kv/.prompt/.dropzone*/ .audio-actions/.swatch*/.style-row*/.critique*/.field(s)/.mt), each verified to have zero JSX references. - a11y: ui/Modal gains aria-modal, initial focus, a Tab focus trap, and focus restore on close; Home tiles and timeline clips are keyboard- operable (Enter/Space activate; clips expose role/aria-label/selected). captionStyle grouping tests added (6). Deferred (noted): full arrow-key clip nudging and merging ExportModal/SettingsModal onto ui/Modal. Co-authored-by: Cursor <cursoragent@cursor.com>
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
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.
Summary
Audit roadmap Phase 6 (final polish).
captionStylevariants — the theme's caption style was decorative:karaoke/block/wordall rendered the single active word. Nowwordkeeps the single-word look,blockshows the current phrase, andkaraokeshows the phrase with the active word highlighted in the accent color. Phrase grouping breaks on a speech pause (>0.6s) or a length cap.captionLineAt/activeWordIndexAtare pure and unit-tested (6 cases).tl-chip-video/-text/-audiobut no CSS consumed the--action-*design tokens (chips all rendered generic gray). Now tinted per type from the tokens.#c0392b→--foreground-danger.styles.css:.kv,.prompt,.dropzone*,.audio-actions,.swatch*,.style-row*,.critique*,.field(s)/.field-row,.mt) — each verified to have zero JSX references (.input.compact,.field-label,.section-hare still used and kept).ui/Modalgainsaria-modal, initial focus into the dialog, a Tab focus trap, and focus restore to the opener on close; Home project/album tiles and timeline clips are keyboard-operable (Enter/Space activate; clips exposerole/aria-label/aria-pressed).Renderer-only — no dev-server restart needed.
Deferred (noted, not blocking): full arrow-key clip nudging on the timeline, and merging
ExportModal/SettingsModal's bespoke overlays ontoui/Modal(both are larger and carry more visual-regression risk than the rest of this PR).Test plan
components/+App.tsxcaptionStylein the Inspector and scrub — word vs phrase vs karaoke differ; video/text/audio chips are tinted; Tab is trapped in dialogs and returns to the opener on closeMade with Cursor