-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.js
111 lines (101 loc) · 2.17 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
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
/*
** TailwindCSS Configuration File
**
** Docs: https://tailwindcss.com/docs/configuration
** Default: https://github.com/tailwindcss/tailwindcss/blob/master/stubs/defaultConfig.stub.js
*/
module.exports = {
purge: {
enabled: process.env.NODE_ENV === 'production',
content: [
'components/**/*.vue',
'layouts/**/*.vue',
'pages/**/*.vue',
'plugins/**/*.js',
'nuxt.config.js'
],
whitelist: ['html', 'body'],
whitelistPatterns: [/\[disabled]/g],
extractors: [{
extractor: content => content.match(/[A-z0-9-:\/]+/g) || [],
extensions: ['js', 'vue', 'scss', 'css']
}]
},
theme: {
extend: {
colors: {
gray: {
'100': '#f5f7f7',
'200': '#eeeff0',
'300': '#ced5d9',
'400': '#a8afb3',
'500': '#939799',
'600': '#797d80',
'700': '#616466',
'800': '#3b3c3d',
'900': '#272829'
},
red: '#EE3D3D',
green: '#34C816',
blue: '#006DA4',
primary: '#00a1f2'
},
borderRadius: {
xl: '24px',
'2xl': '34px',
'3xl': '54px',
'4xl': '64px'
}
},
fontFamily: {
body: ['Inter', 'sans-serif']
},
rotate: {
'0': '0deg',
'1': '1deg',
'2': '2deg',
'3': '3deg',
'6': '6deg',
'12': '12deg',
'18': '18deg',
'45': '45deg',
'90': '90deg',
'180': '180deg',
'-180': '-180deg',
'-90': '-90deg',
'-45': '-45deg',
'-12': '-12deg',
'-6': '-6deg',
'-3': '-3deg',
'-2': '-2deg',
'-1': '-1deg'
}
},
variants: {},
corePlugins: {
container: false
},
plugins: [
function ({ addComponents }) {
addComponents({
'.container': {
paddingLeft: '1rem',
paddingRight: '1rem',
maxWidth: '100%',
'@screen sm': {
maxWidth: '640px',
},
'@screen md': {
maxWidth: '768px',
},
'@screen lg': {
maxWidth: '1024px',
},
'@screen xl': {
maxWidth: '1024px'
}
}
})
}
]
}