diff --git a/src/plugins/boxShadow.js b/src/plugins/boxShadow.js index c5bf5e2a5..846c64199 100644 --- a/src/plugins/boxShadow.js +++ b/src/plugins/boxShadow.js @@ -1,11 +1,6 @@ import transformThemeValue from '../util/transformThemeValue' let transformValue = transformThemeValue('boxShadow') -let shadowReset = { - '*, ::before, ::after': { - '--tw-shadow': '0 0 #0000', - }, -} let defaultBoxShadow = [ `var(--tw-ring-offset-shadow, 0 0 #0000)`, `var(--tw-ring-shadow, 0 0 #0000)`, @@ -15,9 +10,20 @@ let defaultBoxShadow = [ export default function () { return function ({ config, matchUtilities, addBase, addUtilities, theme, variants }) { if (config('mode') === 'jit') { - addBase(shadowReset) + addBase({ + '*::tailwind': { + '--tw-shadow': '0 0 #0000', + }, + }) } else { - addUtilities(shadowReset, { respectImportant: false }) + addUtilities( + { + '*, ::before, ::after': { + '--tw-shadow': '0 0 #0000', + }, + }, + { respectImportant: false } + ) } matchUtilities( diff --git a/src/plugins/filter.js b/src/plugins/filter.js index 017e5d560..904cf556d 100644 --- a/src/plugins/filter.js +++ b/src/plugins/filter.js @@ -2,7 +2,7 @@ export default function () { return function ({ config, addBase, addUtilities, variants }) { if (config('mode') === 'jit') { addBase({ - '*, ::before, ::after': { + '*::tailwind': { '--tw-blur': 'var(--tw-empty,/*!*/ /*!*/)', '--tw-brightness': 'var(--tw-empty,/*!*/ /*!*/)', '--tw-contrast': 'var(--tw-empty,/*!*/ /*!*/)', diff --git a/src/plugins/ringWidth.js b/src/plugins/ringWidth.js index f4f5c978d..c3de5d106 100644 --- a/src/plugins/ringWidth.js +++ b/src/plugins/ringWidth.js @@ -9,21 +9,31 @@ export default function () { `rgba(147, 197, 253, ${ringOpacityDefault})` ) - let ringReset = { - '*, ::before, ::after': { - '--tw-ring-inset': 'var(--tw-empty,/*!*/ /*!*/)', - '--tw-ring-offset-width': theme('ringOffsetWidth.DEFAULT', '0px'), - '--tw-ring-offset-color': theme('ringOffsetColor.DEFAULT', '#fff'), - '--tw-ring-color': ringColorDefault, - '--tw-ring-offset-shadow': '0 0 #0000', - '--tw-ring-shadow': '0 0 #0000', - }, - } - if (config('mode') === 'jit') { - addBase(ringReset) + addBase({ + '*::tailwind': { + '--tw-ring-inset': 'var(--tw-empty,/*!*/ /*!*/)', + '--tw-ring-offset-width': theme('ringOffsetWidth.DEFAULT', '0px'), + '--tw-ring-offset-color': theme('ringOffsetColor.DEFAULT', '#fff'), + '--tw-ring-color': ringColorDefault, + '--tw-ring-offset-shadow': '0 0 #0000', + '--tw-ring-shadow': '0 0 #0000', + }, + }) } else { - addUtilities(ringReset, { respectImportant: false }) + addUtilities( + { + '*, ::before, ::after': { + '--tw-ring-inset': 'var(--tw-empty,/*!*/ /*!*/)', + '--tw-ring-offset-width': theme('ringOffsetWidth.DEFAULT', '0px'), + '--tw-ring-offset-color': theme('ringOffsetColor.DEFAULT', '#fff'), + '--tw-ring-color': ringColorDefault, + '--tw-ring-offset-shadow': '0 0 #0000', + '--tw-ring-shadow': '0 0 #0000', + }, + }, + { respectImportant: false } + ) } matchUtilities(