fix(editor): timeline clip delete icon contrast in light theme - #480
Merged
Conversation
…treatment as its label .tlClipDelete sits on the same fixed dark frosted-glass chip as .tlClipLabel right next to it (both `color-mix(in srgb, #080a0d 55%, transparent)`, deliberately theme-independent since they overlay an arbitrary video thumbnail) — but its icon used `color: var(--muted)`, the app's own theme-dependent secondary-text token, instead of the "light text on a dark overlay" token the sibling chip's own text already uses (`.tlClipName` is a flat `#fff` for the same reason). In light theme `--muted` is a medium slate gray, close enough in tone to the chip's blended backdrop to read as nearly invisible — reported directly against a real clip's delete button in the timeline. Switched to `--overlay-text`, the token design-tokens.css defines for exactly this pairing (already used for scene/PiP overlay captions). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Contributor
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThe ChangesOverlay contrast
Estimated code review effort: 1 (Trivial) | ~2 minutes Suggested reviewers: ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
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.
Summary
Follow-up to #470/#474 — same class of bug, spotted directly against a real clip in the timeline.
.tlClipDelete(the trash icon on a timeline clip's thumbnail) sits on the same fixed dark frosted-glass chip as.tlClipLabelright next to it — both deliberately theme-independent since they overlay an arbitrary video thumbnail. But its icon usedcolor: var(--muted)(the app's own theme-dependent secondary-text token) instead of the "light text on a dark overlay" token its sibling already uses correctly (.tlClipNameis a flat#ffffor the same reason).--mutedis a medium slate gray close enough in tone to the chip's blended backdrop to read as nearly invisible.--overlay-text, the tokendesign-tokens.cssdefines specifically for this pairing (already used for scene/PiP overlay captions elsewhere).Testing
npx tsc --noEmit -p .— clean.tlClipNamerule one-for-one.🤖 Generated with Claude Code
Summary by CodeRabbit