/
tailwind.config.js
46 lines (43 loc) · 1.18 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
module.exports = {
content: ["./app/**/*.{ts,tsx,jsx,js}"],
theme: {
container: {
center: true,
padding: '1rem',
},
extend: {
colors: ({ colors }) => ({
'color-primary': colors.purple['800'],
'color-primary-variant': colors.purple['400'],
'color-on-primary': colors.white,
'color-surface': colors.white,
'color-on-surface': colors.black,
'color-background': colors.gray['200'],
'color-error': colors.red['500'],
'color-on-error': colors.white,
}),
spacing: {
'dimen-xxs': '0.25rem',
'dimen-xs': '0.5rem',
'dimen-sm': '0.75rem',
'dimen-md': '1rem',
'dimen-lg': '1.25rem',
'dimen-xl': '1.5rem',
'dimen-xxl': '1.75rem',
'dimen-xxxl': '2rem',
},
keyframes: {
'horizontal-loading': {
'0%': { width: '0%' },
'49%': { width: '100%', left: '0%' },
'50%': { left: '100%', width: '0' },
'100%': { left: '0%', width: '100%' }
},
},
animation: {
'horizontal-loader': 'horizontal-loading 3s ease-in-out infinite',
}
},
},
plugins: [],
}