archive-gh-me/tailwindcss
1
0
Fork 0
mirror of https://github.com/tailwindlabs/tailwindcss.git synced 2025-12-08 21:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Rename first-child and last-child to first and last

Browse Source
This commit is contained in:
Adam Wathan 2019-07-20 11:14:25 -04:00
parent 893f5c049a
commit 78554a34d2
2 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
__tests__/variantsAtRule.test.js
View File

@ -137,7 +137,7 @@ test('it can generate focus-within variants', () => {
test('it can generate first-child variants', () => {
const input = `
@variants first-child {
@variants first {
.banana { color: yellow; }
.chocolate { color: brown; }
}
@ -146,8 +146,8 @@ test('it can generate first-child variants', () => {
const output = `
.banana { color: yellow; }
.chocolate { color: brown; }
.first-child\\:banana:first-child { color: yellow; }
.first-child\\:chocolate:first-child { color: brown; }
.first\\:banana:first-child { color: yellow; }
.first\\:chocolate:first-child { color: brown; }
`
return run(input).then(result => {
@ -158,7 +158,7 @@ test('it can generate first-child variants', () => {
test('it can generate last-child variants', () => {
const input = `
@variants last-child {
@variants last {
.banana { color: yellow; }
.chocolate { color: brown; }
}
@ -167,8 +167,8 @@ test('it can generate last-child variants', () => {
const output = `
.banana { color: yellow; }
.chocolate { color: brown; }
.last-child\\:banana:last-child { color: yellow; }
.last-child\\:chocolate:last-child { color: brown; }
.last\\:banana:last-child { color: yellow; }
.last\\:chocolate:last-child { color: brown; }
`
return run(input).then(result => {

8
src/lib/substituteVariantsAtRules.js
View File

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