Permalink
Comparing changes
Choose two branches to see what’s changed or to start a new pull request.
If you need to, you can also or
learn more about diff comparisons.
Open a pull request
Create a new pull request by comparing changes across two branches. If you need to, you can also .
Learn more about diff comparisons here.
...
- 14 commits
- 18 files changed
- 3 contributors
Commits on Oct 14, 2024
-
Fix
var(…)as the opacity value inside thetheme(…)function (#14653) Inside the `theme(…)` function, we can use the `/` character for applying an opacity. For example `theme(colors.red.500 / 50%)` will apply a 50% opacity to the `colors.red.500` value. However, if you used a variable instead of the hardcoded `50%` value, then this was not parsed correctly. E.g.: `theme(colors.red.500 / var(--opacity))` _If_ we have this exact syntax (with the spaces), then it parses, but some information is lost: ```html <div class="bg-[theme(colors.red.500_/_var(--opacity))]"></div> ``` Results in: ```css .bg-\[theme\(colors\.red\.500_\/_var\(--opacity\)\)\] { background-color: color-mix(in srgb, #ef4444 calc(var * 100%), transparent); } ``` Notice that the `var(--opacity)` is just parsed as `var`, and the `--opacity` is lost. Additionally, if we drop the spaces, then it doesn't parse at all: ```html <div class="bg-[theme(colors.red.500/var(--opacity))]"></div> ``` Results in: ```css ``` This means that we have to handle 2 issues to make this work: 1. We have to properly handle the `/` character as a proper separator. 2. If we have sub-functions, we have to make sure to print them in full (instead of only the very first node (`var` in this case)).
-
Address follow-up work for #14639 (#14650)
This PR adds a few more test cases to #14639 and updates the documentation. --------- Co-authored-by: Jordan Pittman <jordan@cryptica.me>
-
-
-
-
-
-
-
-
-
-
Loading
This comparison is taking too long to generate.
Unfortunately it looks like we can’t render this comparison for you right now. It might be too big, or there might be something weird with your repository.
You can try running this command locally to see the comparison on your machine:
git diff 70c69a5...c68258f