Overhaul interactive surface tokens and icon handling - #32
Merged
Merged
Conversation
Retune accent to shadcn semantics — a neutral hover/selected surface in both themes — and rebuild every interactive state on it: - globals.css: dark --accent was aliased to the primary blue, so any bg-accent hover flashed blue in dark mode; it is now a neutral (oklch 0.269 0.007 34.298) with standard foreground text - dropdown/select/combo-box/menu/list-box, command, tabs, toggle, toggle-group, grid-list, and outline/plain button hover/selected surfaces all use accent; muted-based surfaces (invisible at oklch 0.97 on white) are gone - grid-list drop-target border moves from accent to primary, matching the DropIndicator rule Icons now inherit currentColor like shadcn: the --btn-icon/-active dimming vars (icons mixed 60% toward the button background) are removed from button and the dead copies in toggle/toggle-group/select cleaned up. Toggle and toggle-group gain button-style svg.lucide sizing and the un-sized-svg fallback; their demos' raw lucide icons previously escaped all sizing rules. Also: GridListLabel/Description render as block so label and description stack with spacing; wider GridListSpacer; toggle-group drops the heavy selected ring and unifies multiple-selection mode with the single-mode chip look; Toggle wires up its previously dead isCircle prop (it leaked to the DOM); badge secondary hover deepens instead of fading; command-menu Esc hint hover is visible in light mode. Registry JSON rebuilt via registry:build. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
Bugbot is not enabled for your account, so this pull request was not reviewed. Enable Bugbot in the Cursor dashboard to get automatic reviews on future PRs. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
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
Reworks how interactive states (hover / selected / focused) are colored across the registry, fixing two recurring bug classes:
muted(oklch 0.97 on a white page): grid-list selection, toggle/toggle-group selected state, outline/plain button hover, badge secondary hover, command-menu Esc hint.accent, which was aliased to the primary blue in the dark theme: select/dropdown/menu/combo-box item hover, command palette selection, selected-tab hover.Token change
Dark
--accentis retuned from the primary blue to a neutral (oklch 0.269 0.007 34.298), givingaccentshadcn-ecosystem semantics: a neutral interactive surface in both themes. All hover/selected surfaces now use it; vendored shadcn components (e.g. command) work unedited. The one legitimately-blue accent consumer (grid-list drop-target border) moves toprimary, matching the existingDropIndicatorrule.Icon handling
Icons inside buttons/toggles/triggers now inherit
currentColorlike shadcn, instead of being mixed 60% toward the button background (the "muddy" look). The--btn-icon/--btn-icon-activeindirection is removed from button and its dead copy-pasted references cleaned out of toggle, toggle-group, and select. Toggle + toggle-group also gain button-stylesvg.lucidesizing and the un-sized-svg fallback — their own demo icons previously escaped every sizing rule.Component polish
blockon theTextspans); wider spacer with a minimum gapinset-ring-foreground/20selected outline removed; multiple-selection mode unified with the single-mode rounded-chip lookisCircleprop was typed but never wired — it now works and no longer leaks onto the DOM buttonbg-border) instead of fading toward whiteregistry:buildTest plan
pnpm typecheckand ESLint pass on all touched files🤖 Generated with Claude Code