wrapper/tailwindcss
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

add odd and even nth child pseudo selectors

Browse source
This commit is contained in:
Cody 2019-07-14 00:10:08 -05:00
parent c9bba9d1b1
commit d4aac290ac
2 changed files with 46 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/lib/substituteVariantsAtRules.js
View file

@ -3,13 +3,13 @@ import postcss from 'postcss'
import selectorParser from 'postcss-selector-parser'
import generateVariantFunction from '../util/generateVariantFunction'
function generatePseudoClassVariant(pseudoClass) {
function generatePseudoClassVariant(pseudoClass, pseudoSelector = pseudoClass) {
return generateVariantFunction(({ modifySelectors, separator }) => {
return modifySelectors(({ selector }) => {
return selectorParser(selectors => {
selectors.walkClasses(sel => {
sel.value = `${pseudoClass}${separator}${sel.value}`
sel.parent.insertAfter(sel, selectorParser.pseudo({ value: `:${pseudoClass}` }))
sel.parent.insertAfter(sel, selectorParser.pseudo({ value: `:${pseudoSelector}` }))
})
}).processSync(selector)
})
@ -38,6 +38,8 @@ const defaultVariantGenerators = {
active: generatePseudoClassVariant('active'),
visited: generatePseudoClassVariant('visited'),
disabled: generatePseudoClassVariant('disabled'),
'odd-child': generatePseudoClassVariant('odd-child', 'nth-child(odd)'),
'even-child': generatePseudoClassVariant('even-child', 'nth-child(even)'),
}
export default function(config, { variantGenerators: pluginVariantGenerators }) {