Add opacity modifiers for color utilities

This commit is contained in:
Adam Wathan 2020-04-26 09:48:54 -04:00
parent 30e0cb10b7
commit 3b565d1f9c
25 changed files with 24761 additions and 521 deletions

View file

@ -1,5 +1,6 @@
import _ from 'lodash'
import flattenColorPalette from '../util/flattenColorPalette'
import withAlphaVariable from '../util/withAlphaVariable'
export default function() {
return function({ addUtilities, e, theme, variants }) {
@ -7,9 +8,11 @@ export default function() {
_.map(flattenColorPalette(theme('backgroundColor')), (value, modifier) => {
return [
`.${e(`bg-${modifier}`)}`,
{
'background-color': value,
},
withAlphaVariable({
color: value,
property: 'background-color',
variable: '--bg-opacity',
}),
]
})
)