diff --git a/CHANGELOG.md b/CHANGELOG.md index b9fcc4bbba73..38fe91eecdf8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed - Ensure `theme` values defined outside of `extend` in JS configuration files overwrite all existing values for that namespace ([#14672](https://github.com/tailwindlabs/tailwindcss/pull/14672)) +- Remove unnecessary variable fallbacks in gradient utilities ([#14705](https://github.com/tailwindlabs/tailwindcss/pull/14705)) - _Upgrade (experimental)_: Speed up template migrations ([#14679](https://github.com/tailwindlabs/tailwindcss/pull/14679)) - _Upgrade (experimental)_: Don't generate invalid CSS when migrating a complex `screens` config ([#14691](https://github.com/tailwindlabs/tailwindcss/pull/14691)) diff --git a/packages/tailwindcss/src/utilities.test.ts b/packages/tailwindcss/src/utilities.test.ts index c79ac61cf6e7..d37bf98d007a 100644 --- a/packages/tailwindcss/src/utilities.test.ts +++ b/packages/tailwindcss/src/utilities.test.ts @@ -9566,42 +9566,42 @@ test('bg', async () => { .bg-gradient-to-b { --tw-gradient-position: to bottom, ; - background-image: linear-gradient(var(--tw-gradient-stops, to bottom)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-bl { --tw-gradient-position: to bottom left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to bottom left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-br { --tw-gradient-position: to bottom right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to bottom right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-l { --tw-gradient-position: to left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-r { --tw-gradient-position: to right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-t { --tw-gradient-position: to top, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-tl { --tw-gradient-position: to top left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-tr { --tw-gradient-position: to top right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-\\[1\\.3rad\\] { @@ -9614,44 +9614,49 @@ test('bg', async () => { background-image: linear-gradient(var(--tw-gradient-stops, 125deg)); } - .bg-linear-\\[to_bottom\\], .bg-linear-to-b { + .bg-linear-\\[to_bottom\\] { --tw-gradient-position: to bottom, ; background-image: linear-gradient(var(--tw-gradient-stops, to bottom)); } + .bg-linear-to-b { + --tw-gradient-position: to bottom, ; + background-image: linear-gradient(var(--tw-gradient-stops)); + } + .bg-linear-to-bl { --tw-gradient-position: to bottom left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to bottom left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-br { --tw-gradient-position: to bottom right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to bottom right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-l { --tw-gradient-position: to left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-r { --tw-gradient-position: to right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-t { --tw-gradient-position: to top, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-tl { --tw-gradient-position: to top left, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top left)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-tr { --tw-gradient-position: to top right, ; - background-image: linear-gradient(var(--tw-gradient-stops, to top right)); + background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-\\[image\\:var\\(--my-gradient\\)\\] { diff --git a/packages/tailwindcss/src/utilities.ts b/packages/tailwindcss/src/utilities.ts index fb5758740c44..4df51fdc5c7e 100644 --- a/packages/tailwindcss/src/utilities.ts +++ b/packages/tailwindcss/src/utilities.ts @@ -2517,12 +2517,12 @@ export function createUtilities(theme: Theme) { ]) { staticUtility(`bg-gradient-to-${value}`, [ ['--tw-gradient-position', `to ${direction},`], - ['background-image', `linear-gradient(var(--tw-gradient-stops, to ${direction}))`], + ['background-image', `linear-gradient(var(--tw-gradient-stops))`], ]) staticUtility(`bg-linear-to-${value}`, [ ['--tw-gradient-position', `to ${direction},`], - ['background-image', `linear-gradient(var(--tw-gradient-stops, to ${direction}))`], + ['background-image', `linear-gradient(var(--tw-gradient-stops))`], ]) } @@ -2578,7 +2578,7 @@ export function createUtilities(theme: Theme) { return [ decl('--tw-gradient-position', `from ${value},`), - decl('background-image', `conic-gradient(var(--tw-gradient-stops,from ${value}))`), + decl('background-image', `conic-gradient(var(--tw-gradient-stops))`), ] } })