80 lines
2.2 KiB
TypeScript
80 lines
2.2 KiB
TypeScript
|
/** @type {import('tailwindcss').Config} */
|
||
|
|
module.exports = {
|
||
|
|
content: [
|
||
|
|
'./src/frontend/app/**/*.{ts,tsx}',
|
||
|
|
'./src/frontend/components/**/*.{ts,tsx}',
|
||
|
|
'./src/frontend/lib/**/*.{ts,tsx}',
|
||
|
|
],
|
||
|
|
darkMode: 'class',
|
||
|
|
theme: {
|
||
|
|
extend: {
|
||
|
|
colors: {
|
||
|
|
// OKLch-based color palette (dark finance professional)
|
||
|
|
background: {
|
||
|
|
primary: 'oklch(0.08 0 0)', // near-black
|
||
|
|
secondary: 'oklch(0.12 0 0)', // dark gray
|
||
|
|
tertiary: 'oklch(0.18 0 0)', // lighter gray
|
||
|
|
},
|
||
|
|
surface: {
|
||
|
|
card: 'oklch(0.15 0 0)',
|
||
|
|
hover: 'oklch(0.20 0 0)',
|
||
|
|
active: 'oklch(0.25 0 0)',
|
||
|
|
elevated: 'oklch(0.20 0 0)',
|
||
|
|
},
|
||
|
|
text: {
|
||
|
|
primary: 'oklch(0.95 0 0)',
|
||
|
|
secondary: 'oklch(0.70 0 0)',
|
||
|
|
tertiary: 'oklch(0.50 0 0)',
|
||
|
|
disabled: 'oklch(0.35 0 0)',
|
||
|
|
},
|
||
|
|
semantic: {
|
||
|
|
positive: 'oklch(0.65 0.18 140)', // green
|
||
|
|
negative: 'oklch(0.55 0.20 20)', // red
|
||
|
|
accent: 'oklch(0.65 0.18 250)', // blue
|
||
|
|
warning: 'oklch(0.70 0.18 80)', // amber
|
||
|
|
critical: 'oklch(0.50 0.22 20)', // deep red
|
||
|
|
},
|
||
|
|
},
|
||
|
|
fontFamily: {
|
||
|
|
display: ['Inter', 'system-ui', 'sans-serif'],
|
||
|
|
body: ['Inter', 'system-ui', 'sans-serif'],
|
||
|
|
mono: ['JetBrains Mono', 'ui-monospace', 'monospace'],
|
||
|
|
},
|
||
|
|
spacing: {
|
||
|
|
'1': '0.25rem',
|
||
|
|
'2': '0.5rem',
|
||
|
|
'3': '0.75rem',
|
||
|
|
'4': '1rem',
|
||
|
|
'6': '1.5rem',
|
||
|
|
'8': '2rem',
|
||
|
|
'12': '3rem',
|
||
|
|
'16': '4rem',
|
||
|
|
'20': '5rem',
|
||
|
|
},
|
||
|
|
borderRadius: {
|
||
|
|
sm: '0.375rem',
|
||
|
|
md: '0.5rem',
|
||
|
|
lg: '0.75rem',
|
||
|
|
xl: '1rem',
|
||
|
|
full: '9999px',
|
||
|
|
},
|
||
|
|
animation: {
|
||
|
|
'fade-in': 'fadeIn 0.2s ease-out',
|
||
|
|
'slide-up': 'slideUp 0.3s ease-out',
|
||
|
|
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
||
|
|
},
|
||
|
|
keyframes: {
|
||
|
|
fadeIn: {
|
||
|
|
'0%': { opacity: '0' },
|
||
|
|
'100%': { opacity: '1' },
|
||
|
|
},
|
||
|
|
slideUp: {
|
||
|
|
'0%': { transform: 'translateY(8px)', opacity: '0' },
|
||
|
|
'100%': { transform: 'translateY(0)', opacity: '1' },
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
plugins: [],
|
||
|
|
}
|