Skip to content
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

Add variable fallback to fix Chrome issue #15003

Merged
merged 4 commits into from
Nov 14, 2024

Conversation

thecrypticace
Copy link
Contributor

@thecrypticace thecrypticace commented Nov 14, 2024

This works around an issue in Chrome where ::selection does not read from variables defined on ::selection thus breaking all uses of color utilities with the selection variant. e.g. selection::bg-red-200.

We now add a fallback value of 1 to all uses of var(--tw-bg-opacity), var(--tw-text-opacity), var(--tw-border-opacity), etc… since Chrome treats the variable as if it did not exist because it's not defined on the parent.

In Chrome 131 (until the change is rolled back) existing utilities like these will not work:

  • selection:text-opacity-50
  • selection:[--tw-text-opacity:0.5]

Fixes #15000

@thecrypticace thecrypticace force-pushed the fix/workaround-chrome-change branch from d655fcd to cdcab04 Compare November 14, 2024 18:04
@thecrypticace thecrypticace marked this pull request as ready for review November 14, 2024 18:09
@thecrypticace thecrypticace requested a review from a team as a code owner November 14, 2024 18:09
@thecrypticace thecrypticace merged commit d093dce into main Nov 14, 2024
13 checks passed
@thecrypticace thecrypticace deleted the fix/workaround-chrome-change branch November 14, 2024 18:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants