-
Notifications
You must be signed in to change notification settings - Fork 4.4k
ComboboxControl: Replace undefined
variable usage with color-mix
for disabled selection
#69621
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
ComboboxControl: Replace undefined
variable usage with color-mix
for disabled selection
#69621
Conversation
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.
To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
fe899f3
to
2e494b3
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code changes LGTM 🚀 Thank you for the fix!
A nice follow-up would be to make the whole component themable
Thanks for the review, @ciampo.
Will follow-up on this shortly! |
…for disabled selection (WordPress#69621) * fix: remove transparent variant for accent color in theme variables * fix: use `color-mix` to derive color accent variant * fix: use `background` and reduce alpha to `4%` * chore: add changelog --- Co-authored-by: yogeshbhutkar <yogeshbhutkar@git.wordpress.org> Co-authored-by: ciampo <mciampini@git.wordpress.org> Co-authored-by: mirka <0mirka00@git.wordpress.org>
What and Why?
Closes #69593
This PR:
--wp-components-color-accent--rgb
property as thergb
variant does not exist.$components-color-accent-transparent-40
SASS variable in favor ofcolor-mix()
.dark backgrounds
.How?
The corresponding
scss
file is updated to reflect the above changes.Testing Instructions
npm run storybook:dev
)Testing Instructions for Keyboard
Same.
Screenshots
P.S. Please note that a tinted background (although faint) has been added to the first (disabled) option. The second option may appear invisible due to the lack of theming support, which will be addressed once theming is implemented for the component. (Ref. #69593 (comment))