2021-04-04 19:09:34 -04:00
|
|
|
import _ from 'lodash'
|
2021-04-30 16:58:40 +02:00
|
|
|
import nameClass from '../util/nameClass'
|
|
|
|
|
import { asValue } from '../util/pluginUtils'
|
2021-04-04 19:09:34 -04:00
|
|
|
|
|
|
|
|
export default function () {
|
|
|
|
|
return function ({ config, matchUtilities, addUtilities, theme, variants }) {
|
|
|
|
|
if (config('mode') === 'jit') {
|
|
|
|
|
matchUtilities({
|
|
|
|
|
'backdrop-invert': (modifier, { theme }) => {
|
|
|
|
|
let value = asValue(modifier, theme.backdropInvert)
|
|
|
|
|
|
|
|
|
|
if (value === undefined) {
|
|
|
|
|
return []
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
[nameClass('backdrop-invert', modifier)]: {
|
|
|
|
|
'--tw-backdrop-invert': `invert(${value})`,
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
const utilities = _.fromPairs(
|
|
|
|
|
_.map(theme('backdropInvert'), (value, modifier) => {
|
|
|
|
|
return [
|
|
|
|
|
nameClass('backdrop-invert', modifier),
|
|
|
|
|
{
|
|
|
|
|
'--tw-backdrop-invert': Array.isArray(value)
|
|
|
|
|
? value.map((v) => `invert(${v})`).join(' ')
|
|
|
|
|
: `invert(${value})`,
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
})
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
addUtilities(utilities, variants('backdropInvert'))
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|