wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Remove double translate-z-px values (#16718)

Browse source 
This PR fixes an issue where if you used `translate-z-px` or
`-translate-z-px` that the utility was generated twice:
```css
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
```

With this PR, it will only generate once:
```css
.translate-z-px {
  --tw-translate-z: 1px;
  translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
```
This commit is contained in:
Robin Malfait 2025-02-21 15:08:46 +01:00 • committed by GitHub
parent 113142a0e4
commit b47b6d2290
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 9 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

1
CHANGELOG.md
View file

@ -24,6 +24,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Vite: Ensure utility classes are read without escaping special characters ([#16631](https://github.com/tailwindlabs/tailwindcss/pull/16631))
- Allow `theme(…)` options when using `@import` ([#16514](https://github.com/tailwindlabs/tailwindcss/pull/16514))
- Use amount of properties when sorting ([#16715](https://github.com/tailwindlabs/tailwindcss/pull/16715))
- Remove double generated `translate-z-px` utilities ([#16718](https://github.com/tailwindlabs/tailwindcss/pull/16718))
## [4.0.7] - 2025-02-18

10
packages/tailwindcss/src/utilities.test.ts
View file

@ -4213,16 +4213,22 @@ test('translate-y', async () => {
})
test('translate-z', async () => {
expect(await run(['translate-z-px', '-translate-z-[var(--value)]'])).toMatchInlineSnapshot(`
expect(
await run(['-translate-z-px', 'translate-z-px', '-translate-z-[var(--value)]']),
).toMatchInlineSnapshot(`
".-translate-z-\\[var\\(--value\\)\\] {
--tw-translate-z: calc(var(--value) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
.-translate-z-px {
--tw-translate-z: -1px;
translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
.translate-z-px {
--tw-translate-z: 1px;
translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
}
@property --tw-translate-x {

10
packages/tailwindcss/src/utilities.ts
View file

@ -1230,16 +1230,6 @@ export function createUtilities(theme: Theme) {
supportsNegative: true,
},
)
staticUtility(`-translate-z-px`, [
translateProperties,
[`--tw-translate-z`, '-1px'],
['translate', 'var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z)'],
])
staticUtility(`translate-z-px`, [
translateProperties,
[`--tw-translate-z`, '1px'],
['translate', 'var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z)'],
])
staticUtility('translate-3d', [
translateProperties,