Add support for active state variant

This commit is contained in:
fedeTibaldo 2018-02-09 16:51:58 +01:00
parent f593535c7c
commit b8ca236400
2 changed files with 12 additions and 2 deletions

View File

@ -804,7 +804,8 @@ module.exports = {
| Here is where you control which modules are generated and what variants are
| generated for each of those modules.
|
| Currently supported variants: 'responsive', 'hover', 'focus', 'group-hover'
| Currently supported variants: 'responsive', 'hover', 'active', focus',
| 'group-hover'
|
| To disable a module completely, use `false` instead of an array.
|

View File

@ -12,6 +12,15 @@ const variantGenerators = {
container.before(cloned.nodes)
},
active: (container, config) => {
const cloned = container.clone()
cloned.walkRules(rule => {
rule.selector = `${buildClassVariant(rule.selector, 'active', config.options.separator)}:active`
})
container.before(cloned.nodes)
},
focus: (container, config) => {
const cloned = container.clone()
@ -48,7 +57,7 @@ export default function(config) {
atRule.before(atRule.clone().nodes)
_.forEach(['focus', 'hover', 'group-hover'], variant => {
_.forEach(['hover', 'active', 'focus', 'group-hover'], variant => {
if (variants.includes(variant)) {
variantGenerators[variant](atRule, unwrappedConfig)
}