68 lines
1.6 KiB
JavaScript
68 lines
1.6 KiB
JavaScript
const defaultTheme = require('tailwindcss/defaultTheme')
|
|
const plugin = require('tailwindcss/plugin')
|
|
|
|
const colors = {
|
|
primary: { light: '#33D17E', DEFAULT: '#00c65e' },
|
|
warning: '#ffd567',
|
|
error: '#ED5454',
|
|
palette: {
|
|
100: '#f5f7f7',
|
|
200: '#d4dddb',
|
|
300: '#9e9e9e',
|
|
400: '#555555',
|
|
500: '#242424',
|
|
600: '#0d0d0d',
|
|
},
|
|
}
|
|
|
|
module.exports = {
|
|
content: ['./src/**/*.{js,jsx,ts,tsx}'],
|
|
theme: {
|
|
screens: {
|
|
sm: '640px',
|
|
md: '768px',
|
|
lg: '1024px',
|
|
xl: '1440px',
|
|
},
|
|
backgroundColor: (theme) => ({ ...theme('colors'), ...colors }),
|
|
borderColor: (theme) => ({ ...theme('colors'), ...colors }),
|
|
textColor: (theme) => ({ ...theme('colors'), ...colors }),
|
|
placeholderColor: (theme) => ({ ...theme('colors'), ...colors }),
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['Sora', ...defaultTheme.fontFamily.sans],
|
|
content: ['Source\\ Sans\\ Pro', ...defaultTheme.fontFamily.sans],
|
|
},
|
|
fontSize: {
|
|
tab: ['18px', '28px'],
|
|
},
|
|
backgroundColor: ['disabled'],
|
|
textColor: ['disabled'],
|
|
keyframes: {
|
|
wiggle: {
|
|
'0%, 100%': { transform: 'rotate(-3deg)' },
|
|
'50%': { transform: 'rotate(3deg)' },
|
|
},
|
|
},
|
|
animation: {
|
|
wiggle: 'wiggle 3s ease-in-out infinite',
|
|
},
|
|
width: {
|
|
page: '100%',
|
|
'page-md': '640px',
|
|
'page-lg': '896px',
|
|
'page-xl': '1312px',
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
plugin(function ({ addBase, theme }) {
|
|
addBase({
|
|
body: {
|
|
color: theme('textColor.palette.600'),
|
|
},
|
|
})
|
|
}),
|
|
],
|
|
}
|