Add ring-inset, always reset ring variables

This commit is contained in:
Adam Wathan 2020-11-11 21:58:54 -05:00
parent f9ea7797ae
commit 879f0887ed
5 changed files with 2897 additions and 867 deletions

View file

@ -21,8 +21,12 @@ export default function () {
return [
nameClass('ring', modifier),
{
'--ring-offset-shadow': `0 0 0 var(--ring-offset-width, 0) var(--ring-offset-color, #fff)`,
'--ring-shadow': `0 0 0 calc(${value} + var(--ring-offset-width, 0px)) var(--ring-color, ${ringColorDefault})`,
'--ring-inset': 'var(--tailwind-empty,/*!*/ /*!*/)',
'--ring-offset-width': '0px',
'--ring-offset-color': '#fff',
'--ring-color': ringColorDefault,
'--ring-offset-shadow': `var(--ring-inset) 0 0 0 var(--ring-offset-width) var(--ring-offset-color)`,
'--ring-shadow': `var(--ring-inset) 0 0 0 calc(${value} + var(--ring-offset-width)) var(--ring-color)`,
'box-shadow': [
`var(--ring-offset-shadow)`,
`var(--ring-shadow)`,
@ -32,6 +36,16 @@ export default function () {
]
})
)
addUtilities(utilities, variants('ringWidth'))
addUtilities(
[
utilities,
{
'.ring-inset': {
'--ring-inset': 'inset',
},
},
],
variants('ringWidth')
)
}
}