forked from ChanceArthur/tailwindcss-dark-mode
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
126 lines (108 loc) · 4.49 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
module.exports = function() {
return function({addVariant, theme, e}) {
const darkSelector = theme('darkSelector', '.mode-dark');
addVariant('dark', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark${separator}${className}`)}`;
});
});
addVariant('dark-hover', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-hover${separator}${className}`)}:hover`;
});
});
addVariant('dark-focus', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-focus${separator}${className}`)}:focus`;
});
});
addVariant('dark-active', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-active${separator}${className}`)}:active`;
});
});
addVariant('dark-disabled', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-disabled${separator}${className}`)}:disabled`;
});
});
addVariant('dark-group-hover', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .group:hover .${e(`dark-group-hover${separator}${className}`)}`;
});
});
addVariant('dark-focus-within', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-focus-within${separator}${className}`)}:focus-within`;
});
});
addVariant('dark-even', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-even${separator}${className}`)}:nth-child(even)`;
});
});
addVariant('dark-odd', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-odd${separator}${className}`)}:nth-child(odd)`;
});
});
addVariant('dark-placeholder', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${darkSelector} .${e(`dark-placeholder${separator}${className}`)}::placeholder`;
});
});
};
return function({addVariant, theme, e}) {
const sepiaSelector = theme('sepiaSelector', '.mode-sepia');
addVariant('sepia', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia${separator}${className}`)}`;
});
});
addVariant('sepia-hover', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-hover${separator}${className}`)}:hover`;
});
});
addVariant('sepia-focus', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-focus${separator}${className}`)}:focus`;
});
});
addVariant('sepia-active', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-active${separator}${className}`)}:active`;
});
});
addVariant('sepia-disabled', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-disabled${separator}${className}`)}:disabled`;
});
});
addVariant('sepia-group-hover', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .group:hover .${e(`sepia-group-hover${separator}${className}`)}`;
});
});
addVariant('sepia-focus-within', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-focus-within${separator}${className}`)}:focus-within`;
});
});
addVariant('sepia-even', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-even${separator}${className}`)}:nth-child(even)`;
});
});
addVariant('sepia-odd', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-odd${separator}${className}`)}:nth-child(odd)`;
});
});
addVariant('sepia-placeholder', ({modifySelectors, separator}) => {
modifySelectors(({className}) => {
return `${sepiaSelector} .${e(`sepia-placeholder${separator}${className}`)}::placeholder`;
});
});
};
};