This repository was archived by the owner on Sep 11, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3
Expand file tree
/
Copy pathtailwind.config.js
More file actions
109 lines (108 loc) · 2.39 KB
/
tailwind.config.js
File metadata and controls
109 lines (108 loc) · 2.39 KB
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
const plugin = require('tailwindcss/plugin');
module.exports = {
future: {
purgeLayersByDefault: true
},
purge: {
enabled: process.env.NODE_ENV === 'production',
content: [
'components/**/*.vue',
'layouts/**/*.vue',
'pages/**/*.vue',
'plugins/**/*.js',
'nuxt.config.js',
// TypeScript
'plugins/**/*.ts',
'nuxt.config.ts'
],
options: {
safelist: ['dark-mode']
}
},
theme: {
darkSelector: '.dark-mode',
extend: {
backgroundImage: {
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))'
},
height: {
'min-content': 'min-content'
},
maxHeight: {
144: '36rem',
160: '40rem'
},
width: {
'max-content': 'max-content'
},
maxwidth: {
'max-content': 'max-content'
},
boxShadow: {
xl:
'0 12px 18px 2px rgb(0 12 51 / 4%), 0 6px 22px 4px rgb(7 27 114 / 12%), 0 6px 10px -4px rgb(14 13 26 / 12%)'
},
fontFamily: {
sans: [
'Metropolis',
'Inter',
'system-ui',
'-apple-system',
'Segoe UI',
'Roboto',
'Ubuntu',
'Cantarell',
'Noto Sans',
'sans-serif',
'BlinkMacSystemFont',
'Oxygen',
'Fira Sans',
'Droid Sans',
'Helvetica Neue'
]
}
},
colors: {
white: '#ffffff',
black: '#000000',
grey: {
100: '#dae1e7',
300: '#b1b1b3',
500: '#8795a1',
600: '#606f7b',
700: '#4a4a4f',
800: '#2a2a2e',
900: '#0c0c0d'
},
blue: {
500: '#009BF5',
600: '#2D56D5',
700: '#2851CC'
},
red: {
700: '#CC2828'
}
}
},
variants: {
backgroundColor: ['dark', 'hover', 'responsive'],
borderColor: ['dark'],
borderWidth: ['dark', 'responsive'],
borderRadius: ['responsive'],
textColor: ['dark'],
padding: ['responsive']
},
darkMode: 'class',
plugins: [
require('tailwindcss-dark-mode')(),
plugin(function ({ addVariant, e }) {
addVariant('dragover', ({ modifySelectors, separator }) => {
modifySelectors(({ className }) => {
return `.${e(`.dragover dragover${separator}${className}`)}, .${e(
`.dragover`
)}`;
});
});
})
]
};