101 lines
2.5 KiB
JavaScript
101 lines
2.5 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: [
|
|
"./resources/**/*.blade.php",
|
|
"./resources/**/*.js",
|
|
"./resources/**/*.vue",
|
|
],
|
|
darkMode: 'class',
|
|
theme: {
|
|
extend: {
|
|
screens: {
|
|
'xs': '475px',
|
|
'3xl': '1600px',
|
|
'4xl': '1920px',
|
|
},
|
|
colors: {
|
|
primary: {
|
|
50: '#fef2f2',
|
|
100: '#fee2e2',
|
|
200: '#fecaca',
|
|
300: '#fca5a5',
|
|
400: '#f87171',
|
|
500: '#ef4444',
|
|
600: '#dc2626',
|
|
700: '#b91c1c',
|
|
800: '#991b1b',
|
|
900: '#7f1d1d',
|
|
950: '#450a0a',
|
|
},
|
|
gray: {
|
|
50: '#fafafa',
|
|
100: '#f4f4f5',
|
|
200: '#e4e4e7',
|
|
300: '#d4d4d8',
|
|
400: '#a1a1aa',
|
|
500: '#71717a',
|
|
600: '#52525b',
|
|
700: '#3f3f46',
|
|
800: '#27272a',
|
|
900: '#18181b',
|
|
950: '#09090b',
|
|
}
|
|
},
|
|
fontFamily: {
|
|
sans: ['Plus Jakarta Sans', 'system-ui', 'sans-serif'],
|
|
},
|
|
spacing: {
|
|
'18': '4.5rem',
|
|
'88': '22rem',
|
|
'128': '32rem',
|
|
},
|
|
animation: {
|
|
'fade-in': 'fadeIn 0.5s ease-in-out',
|
|
'slide-up': 'slideUp 0.3s ease-out',
|
|
'slide-down': 'slideDown 0.3s ease-out',
|
|
'pulse-slow': 'pulse 3s ease-in-out infinite',
|
|
'bounce-slow': 'bounce 2s infinite',
|
|
},
|
|
keyframes: {
|
|
fadeIn: {
|
|
'0%': { opacity: '0' },
|
|
'100%': { opacity: '1' },
|
|
},
|
|
slideUp: {
|
|
'0%': { transform: 'translateY(10px)', opacity: '0' },
|
|
'100%': { transform: 'translateY(0)', opacity: '1' },
|
|
},
|
|
slideDown: {
|
|
'0%': { transform: 'translateY(-10px)', opacity: '0' },
|
|
'100%': { transform: 'translateY(0)', opacity: '1' },
|
|
}
|
|
},
|
|
backdropBlur: {
|
|
xs: '2px',
|
|
},
|
|
backgroundImage: {
|
|
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
|
|
'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
|
|
},
|
|
aspectRatio: {
|
|
'2/3': '2 / 3',
|
|
'3/4': '3 / 4',
|
|
'9/16': '9 / 16',
|
|
'16/9': '16 / 9',
|
|
},
|
|
lineClamp: {
|
|
7: '7',
|
|
8: '8',
|
|
9: '9',
|
|
10: '10',
|
|
}
|
|
},
|
|
},
|
|
plugins: [
|
|
require('@tailwindcss/forms')({ strategy: 'class' }),
|
|
require('@tailwindcss/typography'),
|
|
require('@tailwindcss/aspect-ratio'),
|
|
require('@tailwindcss/line-clamp'),
|
|
require('@tailwindcss/container-queries'),
|
|
],
|
|
} |