diff --git a/CHANGELOG.md b/CHANGELOG.md index 5a59060fd..dd4f36eec 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed - Ensure `scale-*` utilities support percentage values ([#13182](https://github.com/tailwindlabs/tailwindcss/pull/13182)) +- Prevent `content-none` from being overridden when conditionally styling `::before`/`::after` ([#13187](https://github.com/tailwindlabs/tailwindcss/pull/13187)) ### Changed diff --git a/packages/tailwindcss/src/utilities.ts b/packages/tailwindcss/src/utilities.ts index e50f80c2b..d0c1e32ff 100644 --- a/packages/tailwindcss/src/utilities.ts +++ b/packages/tailwindcss/src/utilities.ts @@ -3430,7 +3430,10 @@ export function createUtilities(theme: Theme) { handle: (value) => [decl('will-change', value)], }) - staticUtility('content-none', [['content', 'none']]) + staticUtility('content-none', [ + ['--tw-content', 'none'], + ['content', 'none'], + ]) functionalUtility('content', { themeKeys: [], handle: (value) => [ diff --git a/packages/tailwindcss/tests/ui.spec.ts b/packages/tailwindcss/tests/ui.spec.ts index 42911ca98..7a7f357b0 100644 --- a/packages/tailwindcss/tests/ui.spec.ts +++ b/packages/tailwindcss/tests/ui.spec.ts @@ -233,6 +233,20 @@ test('scale can be a number or percentage', async ({ page }) => { expect(await getPropertyValue('#x', 'scale')).toEqual('1.5') }) +// https://github.com/tailwindlabs/tailwindcss/issues/13185 +test('content-none persists when conditionally styling a pseudo-element', async ({ page }) => { + let { getPropertyValue } = await render( + page, + html`