1.0.3 • Published 5 years ago
tailwindcss-pseudo v1.0.3
Pseudo Selector Plugin for Tailwind CSS
Installation
yarn add tailwindcss-pseudo
Usage
// tailwind.config.js
{
theme: {
backgroundColor: {
'black': 'black',
},
pseudo: { // defaults to {'before': 'before', 'after': 'after'}
'before': 'before',
'after': 'after',
'not-first': 'not(:first-child)',
}
},
variants: {
backgroundColor: ['not-first'],
empty: ['before', 'after'], // defaults to []
},
plugins: [
require('tailwindcss-pseudo')({
empty: true, // defaults to true
}),
],
}
This plugin generates the following utilities:
.bg-black {
background-color: black;
}
.not-first\:bg-black:not(:first-child) {
background-color: black;
}
.empty {
content: '';
}
.before\:empty::before {
content: '';
}
.after\:empty::after {
content: '';
}