-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.js
72 lines (63 loc) · 1.82 KB
/
tailwind.config.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
/* eslint-disable @typescript-eslint/no-var-requires */
const formsPlugin = require('@tailwindcss/forms')
const typographyPlugin = require('@tailwindcss/typography')
const colors = require('tailwindcss/colors')
const plugin = require('tailwindcss/plugin')
/** @type { import('tailwindcss/tailwind-config').TailwindConfig } */
const config = {
mode: 'jit',
content: ['./src/**/*.{js,ts,jsx,tsx}', 'index.html'],
theme: {
fontFamily: {
mono: ['IBM Plex Mono'],
},
extend: {
colors: {
transparent: colors.transparent,
black: colors.black,
white: colors.white,
brand: colors.sky,
accent: colors.cyan,
important: colors.amber,
danger: colors.rose,
dangerAccent: colors.red,
neutral: colors.slate,
},
typography: (theme) => ({
DEFAULT: {
css: {
'ul > li > input[type=checkbox]:first-child:last-child': {
marginTop: 0,
marginBottom: 0,
marginRight: theme('spacing.4'),
},
},
},
}),
},
},
plugins: [
typographyPlugin,
formsPlugin,
plugin(({ addVariant, e }) => {
addVariant('not-first', ({ modifySelectors, separator }) => {
modifySelectors(
({ className }) =>
`.${e(`not-first${separator}${className}`)}:not(:first-child)`,
)
})
addVariant('enabled', ({ modifySelectors, separator }) => {
modifySelectors(
({ className }) =>
`.${e(`enabled${separator}${className}`)}:not(:disabled)`,
)
})
addVariant('current', ({ modifySelectors, separator }) => {
modifySelectors(
({ className }) => `.current.${e(`current${separator}${className}`)}`,
)
})
}),
],
}
module.exports = config