- React 19 + Vite 7 + TypeScript - Tailwind CSS 4 com glassmorphism - Framer Motion animações - Bento Grid layout - Sparkline charts SVG - Progress ring animado DeskCRM Task: #1604 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
56 lines
1.6 KiB
JavaScript
56 lines
1.6 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: [
|
|
"./index.html",
|
|
"./src/**/*.{js,ts,jsx,tsx}",
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
brand: {
|
|
50: '#eef2ff',
|
|
100: '#e0e7ff',
|
|
200: '#c7d2fe',
|
|
300: '#a5b4fc',
|
|
400: '#818cf8',
|
|
500: '#6366f1',
|
|
600: '#4f46e5',
|
|
700: '#4338ca',
|
|
800: '#3730a3',
|
|
900: '#312e81',
|
|
950: '#1e1b4b',
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: ['Inter', 'system-ui', 'sans-serif'],
|
|
mono: ['JetBrains Mono', 'monospace'],
|
|
},
|
|
animation: {
|
|
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
|
'glow': 'glow 2s ease-in-out infinite alternate',
|
|
'float': 'float 6s ease-in-out infinite',
|
|
'shimmer': 'shimmer 2s linear infinite',
|
|
},
|
|
keyframes: {
|
|
glow: {
|
|
'0%': { boxShadow: '0 0 20px rgba(99, 102, 241, 0.3)' },
|
|
'100%': { boxShadow: '0 0 40px rgba(99, 102, 241, 0.6)' },
|
|
},
|
|
float: {
|
|
'0%, 100%': { transform: 'translateY(0px)' },
|
|
'50%': { transform: 'translateY(-10px)' },
|
|
},
|
|
shimmer: {
|
|
'0%': { backgroundPosition: '-200% 0' },
|
|
'100%': { backgroundPosition: '200% 0' },
|
|
},
|
|
},
|
|
backgroundImage: {
|
|
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
|
|
'grid-pattern': 'linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px)',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|