-
Notifications
You must be signed in to change notification settings - Fork 0
/
tailwind.config.js
64 lines (63 loc) · 1.51 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
/*
** TailwindCSS Configuration File
**
** Docs: https://tailwindcss.com/docs/configuration
** Default: https://github.com/tailwindcss/tailwindcss/blob/master/stubs/defaultConfig.stub.js
*/
const defaultTheme = require('tailwindcss/defaultTheme')
const colors = require('tailwindcss/colors')
module.exports = {
mode: 'jit',
purge: [
'components/**/*.vue',
'layouts/**/*.vue',
'pages/**/*.vue',
'plugins/**/*.js',
'nuxt.config.js'
],
darkMode: 'class', // or 'media' or 'class'
theme: {
extend: {
fontFamily: {
sans: ['Noto Sans SC', ...defaultTheme.fontFamily.sans]
},
colors: {
gray: colors.gray,
teal: colors.teal,
fuchsia: colors.fuchsia,
orange: colors.orange,
rose: colors.rose
},
animation: {
ping: 'ping 3s cubic-bezier(0, 0, 0.2, 1) infinite',
hover: 'hover 20s linear infinite alternate',
bg: 'bg 40s linear infinite'
},
keyframes: {
hover: {
from: { transform: 'translateX(0) scale(1)' },
to: { transform: 'translateX(-10px) scale(1.2)' }
},
bg: {
from: { transform: 'translateY(0)' },
to: { transform: 'translateY(-600px)' }
}
},
width: {
screenh: '100vh'
},
lineHeight: {
heading: '1.2 !important'
}
}
},
variants: {
extend: {
opacity: ['disabled'],
textOpacity: ['disabled']
}
},
plugins: [
require('@tailwindcss/forms')
]
}