Fix decoration utility ambiguity (#6217)
* remove `any` data type for decoration color plugin The main reason for the `any` type is so that we don't have to parse the value and can assume that this plugin handles "any" value you give it. This is useful because `decoration-[var(--something)]` would be correctly translated to the correct decoration property. However, we introduce another plugin with the same `decoration` prefix. This means that now both `textDecorationColor` and `textDecorationThickness` have the same base utility name: `decoration`. - `textDecorationColor` had ['color', 'any'] - `textDecorationThickness` had ['length', 'percentage'] This means that `3px` fit both in the `length` data type of the `textDecorationThickness` plugin and in the `any` data type of the `textDecorationColor` plugin. Removing the `any` fixes this. TL;DR: Only have `any` when there are no conflicting utility names. * remove utility that doesn't generate css Having `decoration-[var(--abc)]` is ambiguous because there are multiple plugins that have a `decoration` utility name. In order for this to work you have to prefix it with the type: `decoration-[color:var(--abc)]` which is already tested in this file.
This commit is contained in:
parent
6b82ca89bc
commit
12ea363e1a
4 changed files with 23 additions and 5 deletions
|
|
@ -1670,7 +1670,7 @@ export let corePlugins = {
|
|||
return { 'text-decoration-color': toColorValue(value) }
|
||||
},
|
||||
},
|
||||
{ values: flattenColorPalette(theme('textDecorationColor')), type: ['color', 'any'] }
|
||||
{ values: flattenColorPalette(theme('textDecorationColor')), type: ['color'] }
|
||||
)
|
||||
},
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue