Fix kbd shadow colors not being calculated on oklch colors
#387
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
philipp-spiess
force-pushed
the
main
branch
from
0493eea to
c67233c
Compare
There was a problem hiding this comment.
Hey! Thanks for the PR! I decided to use a different approach that is a tiny bit more robust. In Tailwind v3, the tailwindcss/colors export is always in hex and our code here also only handled hex, so I left this as-is. However, if hex can not be parsed I'm now using color-mix(…) syntax and we assume we're in v4 where we can use that! That avoids us introspecting the color values and won't break things.
I was trying to add a unit test but because this is operating off a static export, mocking is a total PITA and I was able to verify it works only with test.only.
Will try to add this in a v4 sample app briefly just to be sure but I think we're good now!
|
Ok, works 😅 
|
* fix: correctly apply alpha to kbd shadows when not hex * Use `color-mix(…)` for non hex values * Add changelog --------- Co-authored-by: Philipp Spiess <[email protected]>
| // only handled these values. We keep the old behavior for backward | ||
| // compatibility with v3 codebases but use color-mix for any other color | ||
| // values. | ||
| hex = color.replace('#', '') |
There was a problem hiding this comment.
The hex variable is not defined because in the previous version it originated from the functions' arguments:
// v0.5.16
const hexToRgb = (hex) => {
hex = hex.replace('#', '')
// ...
}We need to declare the variable to avoid the issue.
// v0.5.17
const opacity = (color, opacity) => {
let hex = color.replace('#', '')
// ...
}
Make
--tw-prose-kbd-shadowsto have 10% alpha color even if the colors are in oklch (Tailwind v4)Fixes #386