Skip to content
This repository was archived by the owner on May 27, 2021. It is now read-only.

Commit 40232f1

Browse files
committed
Add variant for nth-child(even) pseudo-selector
Addition to nth-child(odd) from #13
1 parent bbd8749 commit 40232f1

File tree

2 files changed

+8
-1
lines changed

2 files changed

+8
-1
lines changed

README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ Variants for dark mode are based on [Tailwind's own variants](https://tailwindcs
2828
- `dark-active`
2929
- `dark-group-hover`
3030
- `dark-focus-within`
31+
- `dark-even`
3132
- `dark-odd`
3233

3334
... and are used in the same way.
@@ -50,7 +51,7 @@ As with existing variants such as `hover` and `focus`, variants for dark mode mu
5051

5152
```javascript
5253
variants: {
53-
backgroundColor: ['dark', 'dark-hover', 'dark-group-hover', 'dark-odd'],
54+
backgroundColor: ['dark', 'dark-hover', 'dark-group-hover', 'dark-even', 'dark-odd'],
5455
borderColor: ['dark', 'dark-focus', 'dark-focus-within'],
5556
textColor: ['dark', 'dark-hover', 'dark-active']
5657
}

index.js

+6
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,12 @@ module.exports = function() {
3737
});
3838
});
3939

40+
addVariant('dark-even', ({modifySelectors, separator}) => {
41+
modifySelectors(({className}) => {
42+
return `${darkSelector} .${e(`dark-even${separator}${className}`)}:nth-child(even)`;
43+
});
44+
});
45+
4046
addVariant('dark-odd', ({modifySelectors, separator}) => {
4147
modifySelectors(({className}) => {
4248
return `${darkSelector} .${e(`dark-odd${separator}${className}`)}:nth-child(odd)`;

0 commit comments

Comments
 (0)