fix(list-container): card border color should match Figma spec#1242
Closed
igor-monteiro-almeida wants to merge 1 commit into
Closed
fix(list-container): card border color should match Figma spec#1242igor-monteiro-almeida wants to merge 1 commit into
igor-monteiro-almeida wants to merge 1 commit into
Conversation
The card variant of ListContainer (used by ListSelectable, ListReadOnly and any other type='card' consumer) currently uses $color-interface-light-deep (#CED1E1) for its border. The Figma spec for these list cards specifies $color-interface-light-down (#E0E2EE), which is one step lighter. Switching the token aligns the implementation with the design source of truth across all card-style list components. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
6 tasks
Contributor
Author
|
Fechando para recriar a partir de branch direto no repo principal — assim o Chromatic publica o preview visual automaticamente (PRs de fork não conseguem usar os secrets do CI). Vou abrir um novo PR equivalente em seguida. Nada mudou no código. |
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
The card variant of
ListContainercurrently uses$color-interface-light-deep(#CED1E1) for its border. The Figma spec for list cards specifies$color-interface-light-down(#E0E2EE), which is one step lighter. Switching the token aligns the implementation with the design source of truth across all card-style list components.Affected components
ListContaineris shared, so this change visually affects every card-style consumer:ListSelectable(type='card')ListReadOnly(type='card')ListAction,ListExpandable,ListSettingsand any future component that wrapsListContainerwithtype='card'The change is only the border color — width, radius, padding and content layout are unchanged.
Token values
$color-interface-light-deep(current)#CED1E1$color-interface-light-down(Figma)#E0E2EETest plan
yarn jest(ocean-react) — all suites passing, no regressions caused by this changeListSelectable,ListReadOnly,ListActionContext
Found while implementing the Highlight Corner Tag in
ListSelectable(#1240). The divergence is pre-existing and not caused by that PR — opening this as a separate fix to keep concerns isolated and make the visual change reviewable in isolation.🤖 Generated with Claude Code