Allow multiples of .25 in aspect-* fractions (#19688)
This PR reduces the restrictions of the `aspect-*` utilities when dealing with fractional values. Up until now, the numbers had to be positive integers, so `aspect-1/2` was valid, but `aspect-8.5/11` was not. This PR allows for any multiple of `.25` as a valid value, so `aspect-8.5/11` is now valid, but `aspect-8.3/11` is not, this will still require `aspect-[8.3/11]` arbitrary value syntax to be valid. This behavior of allowing multiples of `.25` is consistent with other utilities that handle bare values such as `w-2.5`. ## Test plan 1. Existing tests pass 2. Added a test for `aspect-8.5/11` Fixes: #19663 Closes: #19680, #19669
This commit is contained in:
parent
d74f8b8392
commit
6eb3b32434
3 changed files with 8 additions and 2 deletions
|
|
@ -26,6 +26,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
- Fix class extraction for Rails' strict locals ([#19525](https://github.com/tailwindlabs/tailwindcss/pull/19525))
|
||||
- Align `@utility` name validation with Oxide scanner rules ([#19524](https://github.com/tailwindlabs/tailwindcss/pull/19524))
|
||||
- Fix infinite loop when using `@variant` inside `@custom-variant` ([#19633](https://github.com/tailwindlabs/tailwindcss/pull/19633))
|
||||
- Allow multiples of `.25` in `aspect-*` fractions ([#19688](https://github.com/tailwindlabs/tailwindcss/pull/19688))
|
||||
|
||||
### Deprecated
|
||||
|
||||
|
|
|
|||
|
|
@ -3156,7 +3156,7 @@ test('aspect-ratio', async () => {
|
|||
}
|
||||
@tailwind utilities;
|
||||
`,
|
||||
['aspect-video', 'aspect-[10/9]', 'aspect-4/3'],
|
||||
['aspect-video', 'aspect-[10/9]', 'aspect-4/3', 'aspect-8.5/11'],
|
||||
),
|
||||
).toMatchInlineSnapshot(`
|
||||
":root, :host {
|
||||
|
|
@ -3167,6 +3167,10 @@ test('aspect-ratio', async () => {
|
|||
aspect-ratio: 4 / 3;
|
||||
}
|
||||
|
||||
.aspect-8\\.5\\/11 {
|
||||
aspect-ratio: 8.5 / 11;
|
||||
}
|
||||
|
||||
.aspect-\\[10\\/9\\] {
|
||||
aspect-ratio: 10 / 9;
|
||||
}
|
||||
|
|
@ -3188,6 +3192,7 @@ test('aspect-ratio', async () => {
|
|||
'aspect--4/3',
|
||||
'aspect--4/-3',
|
||||
'aspect-4/-3',
|
||||
'aspect-1.23/4.56',
|
||||
]),
|
||||
).toEqual('')
|
||||
})
|
||||
|
|
|
|||
|
|
@ -981,7 +981,7 @@ export function createUtilities(theme: Theme) {
|
|||
handleBareValue: ({ fraction }) => {
|
||||
if (fraction === null) return null
|
||||
let [lhs, rhs] = segment(fraction, '/')
|
||||
if (!isPositiveInteger(lhs) || !isPositiveInteger(rhs)) return null
|
||||
if (!isValidSpacingMultiplier(lhs) || !isValidSpacingMultiplier(rhs)) return null
|
||||
return fraction
|
||||
},
|
||||
handle: (value) => [decl('aspect-ratio', value)],
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue