-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.js
98 lines (97 loc) · 4.38 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
const colors = require('tailwindcss/colors');
const path = require('path');
module.exports = {
content: [
path.join(__dirname, 'data/*.js'),
path.join(__dirname, 'safelist.txt'),
path.join(__dirname, 'pages/**/*.vue'),
path.join(__dirname, 'components/**/*.vue'),
path.join(__dirname, 'composables/**/*.js'),
'/node_modules/vue-tailwind/dist/*.js',
],
theme: {
extend: {
fontFamily: {
'mono-lisa': 'MonoLisa',
'mono-jetbrains': 'JetbrainsMono',
},
cursor: {
'resize-width': 'ew-resize',
'resize-height': 'ns-resize',
},
colors: {
sky: colors.sky,
teal: colors.teal,
rose: colors.rose,
violet: colors.violet,
orange: colors.orange,
amber: colors.amber,
lime: colors.lime,
emerald: colors.emerald,
teal: colors.teal,
cyan: colors.cyan,
sky: colors.sky,
violet: colors.violet,
purple: colors.purple,
fuchsia: colors.fuchsia,
rose: colors.rose,
'blue-gray': colors.slate,
'cool-gray': colors.gray,
'true-gray': colors.neutral,
'warm-gray': colors.stone,
ui: {
focus: 'var(--color-ui-violet-500)',
'gray-50': 'var(--color-ui-gray-50)',
'gray-100': 'var(--color-ui-gray-100)',
'gray-200': 'var(--color-ui-gray-200)',
'gray-300': 'var(--color-ui-gray-300)',
'gray-400': 'var(--color-ui-gray-400)',
'gray-500': 'var(--color-ui-gray-500)',
'gray-600': 'var(--color-ui-gray-600)',
'gray-700': 'var(--color-ui-gray-700)',
'gray-800': 'var(--color-ui-gray-800)',
'gray-900': 'var(--color-ui-gray-900)',
'violet-500': 'var(--color-ui-violet-500)',
'violet-600': 'var(--color-ui-violet-600)',
'violet-900': 'var(--color-ui-violet-900)',
},
},
backgroundImage: {
conic: 'conic-gradient(var(--tw-gradient-stops))',
'conic-to-t': 'conic-gradient(at top, var(--tw-gradient-stops))',
'conic-to-b': 'conic-gradient(at bottom, var(--tw-gradient-stops))',
'conic-to-l': 'conic-gradient(at left, var(--tw-gradient-stops))',
'conic-to-r': 'conic-gradient(at right, var(--tw-gradient-stops))',
'conic-to-tl': 'conic-gradient(at top left, var(--tw-gradient-stops))',
'conic-to-tr': 'conic-gradient(at top right, var(--tw-gradient-stops))',
'conic-to-bl': 'conic-gradient(at bottom left, var(--tw-gradient-stops))',
'conic-to-br': 'conic-gradient(at bottom right, var(--tw-gradient-stops))',
radial: 'radial-gradient(ellipse at center, var(--tw-gradient-stops))',
'radial-at-t': 'radial-gradient(ellipse at top, var(--tw-gradient-stops))',
'radial-at-b': 'radial-gradient(ellipse at bottom, var(--tw-gradient-stops))',
'radial-at-l': 'radial-gradient(ellipse at left, var(--tw-gradient-stops))',
'radial-at-r': 'radial-gradient(ellipse at right, var(--tw-gradient-stops))',
'radial-at-tl': 'radial-gradient(ellipse at top left, var(--tw-gradient-stops))',
'radial-at-tr': 'radial-gradient(ellipse at top right, var(--tw-gradient-stops))',
'radial-at-bl': 'radial-gradient(ellipse at bottom left, var(--tw-gradient-stops))',
'radial-at-br':
'radial-gradient(ellipse at bottom right, var(--tw-gradient-stops))',
},
rotate: {
135: '135deg',
'-135': '-135deg',
},
scale: {
200: '2',
},
},
},
plugins: [
require('@tailwindcss/forms'),
require('tailwind-scrollbar-hide'),
require('tailwind-safelist-generator')({
path: path.join(__dirname, 'safelist.txt'),
patterns: ['bg-{colors}'],
}),
],
};