darroyo
9cef7173cb
- Full component library (Button, Input, Label, Select, Modal, Table, Badge, Card, etc.) - Tailwind design tokens: IBM Plex Sans + JetBrains Mono, teal accent, semantic status colors - NavBar with logo, responsive hamburger menu, real logout - All pages redesigned: Login, Dashboard (KPI cards), Machines, SyncPairs, JobHistory, JobDetail, SSHKeys, Settings - Fixed: hover:bg-gray-750 dead class, window.location.href navigation bug - Replaced alert()/confirm() with sonner toasts and accessible modals - Added ErrorBoundary, skip link, accessible modal dialogs (Radix) - Icons: lucide-react throughout, copy/download buttons - 1.0.5 → 1.0.6
79 lines
2.1 KiB
JavaScript
79 lines
2.1 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
|
|
darkMode: 'class',
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
canvas: {
|
|
DEFAULT: '#080808',
|
|
raised: '#121212',
|
|
},
|
|
surface: {
|
|
DEFAULT: '#0f0f0f',
|
|
hover: '#1a1a1a',
|
|
raised: '#1a1a1a',
|
|
border: '#262626',
|
|
},
|
|
accent: {
|
|
DEFAULT: '#2dd4bf',
|
|
hover: '#5eead4',
|
|
muted: '#0d9488',
|
|
foreground: '#0f0f0f',
|
|
},
|
|
fg: {
|
|
DEFAULT: '#f5f5f5',
|
|
muted: '#a3a3a3',
|
|
subtle: '#737373',
|
|
},
|
|
border: {
|
|
DEFAULT: '#262626',
|
|
subtle: '#1f1f1f',
|
|
},
|
|
status: {
|
|
running: '#10b981',
|
|
pending: '#fbbf24',
|
|
waking: '#fbbf24',
|
|
success: '#10b981',
|
|
error: '#f43f5e',
|
|
info: '#38bdf8',
|
|
neutral: '#71717a',
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: ['"IBM Plex Sans"', 'ui-sans-serif', 'system-ui', 'sans-serif'],
|
|
mono: ['"JetBrains Mono"', 'ui-monospace', 'SFMono-Regular', 'monospace'],
|
|
},
|
|
boxShadow: {
|
|
card: '0 0 0 1px rgba(38, 38, 38, 1), 0 2px 8px rgba(0, 0, 0, 0.4)',
|
|
'card-hover': '0 0 0 1px rgba(45, 212, 191, 0.3), 0 4px 16px rgba(0, 0, 0, 0.5)',
|
|
glow: '0 0 20px rgba(45, 212, 191, 0.15)',
|
|
'glow-error': '0 0 20px rgba(244, 63, 94, 0.15)',
|
|
},
|
|
borderRadius: {
|
|
card: '0.5rem',
|
|
},
|
|
animation: {
|
|
'fade-in': 'fadeIn 200ms ease-out',
|
|
'scale-in': 'scaleIn 200ms ease-out',
|
|
'slide-up': 'slideUp 200ms ease-out',
|
|
},
|
|
keyframes: {
|
|
fadeIn: {
|
|
'0%': { opacity: '0' },
|
|
'100%': { opacity: '1' },
|
|
},
|
|
scaleIn: {
|
|
'0%': { opacity: '0', transform: 'scale(0.95)' },
|
|
'100%': { opacity: '1', transform: 'scale(1)' },
|
|
},
|
|
slideUp: {
|
|
'0%': { opacity: '0', transform: 'translateY(8px)' },
|
|
'100%': { opacity: '1', transform: 'translateY(0)' },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|