82034ec327
This PR is similar to and a follow up of #18815, but this time to migrate the `data` theme keys. Let's imagine you have the following Tailwind CSS v3 configuration: ```ts export default { content: ['./src/**/*.html'], theme: { extend: { data: { // Automatically handled by bare values foo: 'foo', // ^^^ ^^^ ← same names // Not automatically handled by bare values bar: 'baz', // ^^^ ^^^ ← different names // Completely custom checked: 'ui~="checked"', }, }, }, } ``` Then we would generate the following Tailwind CSS v4 CSS: ```css @custom-variant data-bar (&[data-baz]); @custom-variant data-checked (&[data-ui~="checked"]); ``` Notice how we didn't generate a custom variant for `data-foo` because those are automatically handled by bare values. |
||
|---|---|---|
| .. | ||
| src | ||
| package.json | ||
| README.md | ||
| tsconfig.json | ||
| tsup.config.ts | ||
A utility-first CSS framework for rapidly building custom user interfaces.
Documentation
For full documentation, visit tailwindcss.com.
Community
For help, discussion about best practices, or feature ideas:
Discuss Tailwind CSS on GitHub
Contributing
If you're interested in contributing to Tailwind CSS, please read our contributing docs before submitting a pull request.