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 future flag to disable color opacity utility plugins #9088

Merged
merged 2 commits into from Aug 15, 2022

Conversation

thecrypticace
Copy link
Contributor

@thecrypticace thecrypticace commented Aug 12, 2022

Since we have the opacity modifier syntax these are no longer necessary and this will become the default in Tailwind CSS v4.0

If you need to be able to control the opacity independently from the color channels you have two options:

  1. Use the opacity modifier syntax with CSS variables (recommended):
<div class="bg-blue-200/[var(--bg-opacity)] text-blue-900/[var(--text-opacity)]" style="--text-opacity: 0.75; --bg-opacity: 0.25;">Test</div>
  1. Re-enable the appropriate corePlugin in your config file:
corePlugins: {
  backgroundOpacity: true,
  textOpacity: true,
}

@thecrypticace thecrypticace marked this pull request as draft August 12, 2022 20:08
@thecrypticace thecrypticace changed the title Add future flag to disable opacity utility plugins Add future flag to disable color opacity utility plugins Aug 12, 2022
@thecrypticace thecrypticace force-pushed the feature/disable-opacity-plugins branch from afa3ff6 to 020d9aa Compare August 15, 2022 15:58
@thecrypticace thecrypticace force-pushed the feature/disable-opacity-plugins branch from 020d9aa to 4f3d254 Compare August 15, 2022 17:40
@thecrypticace thecrypticace marked this pull request as ready for review August 15, 2022 17:44
@thecrypticace thecrypticace merged commit b0018e2 into master Aug 15, 2022
@thecrypticace thecrypticace deleted the feature/disable-opacity-plugins branch August 15, 2022 17:45
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.

None yet

1 participant