88424675b5
- Scaffold Vite + React 19 + TypeScript strict project - Neumorphic dark design system (Tailwind v3, amber/orange LED accents) - Zustand stores for auth (persist) and UI state (notifications, sidebar) - TanStack Query v5 hooks for server CRUD operations - WebSocket hook with reconnection backoff and query invalidation - Components: StatusLed, Sidebar, ServerCard, LoginPage, DashboardPage - Protected routing with auth guard - Axios client with JWT interceptor and 401 redirect - 68 tests across 11 test files (89% statement coverage, 90% function coverage) - TDD workflow: RED validated, GREEN achieved, coverage verified
63 lines
1.8 KiB
JavaScript
63 lines
1.8 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ["./index.html", "./src/**/*.{ts,tsx}"],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
surface: {
|
|
base: "#1a1a2e",
|
|
raised: "#1e1e35",
|
|
recessed: "#16162a",
|
|
overlay: "#22223a",
|
|
},
|
|
accent: {
|
|
DEFAULT: "#f59e0b",
|
|
bright: "#fbbf24",
|
|
dim: "#d97706",
|
|
glow: "#f59e0b40",
|
|
},
|
|
status: {
|
|
running: "#22c55e",
|
|
stopped: "#6b7280",
|
|
crashed: "#ef4444",
|
|
starting: "#f59e0b",
|
|
restarting: "#3b82f6",
|
|
},
|
|
text: {
|
|
primary: "#e2e8f0",
|
|
secondary: "#94a3b8",
|
|
muted: "#475569",
|
|
inverse: "#1a1a2e",
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: ["Inter", "system-ui", "sans-serif"],
|
|
mono: ["JetBrains Mono", "Fira Code", "monospace"],
|
|
},
|
|
boxShadow: {
|
|
"neu-raised": "4px 4px 8px #0d0d1f, -4px -4px 8px #27273f",
|
|
"neu-raised-lg": "8px 8px 16px #0d0d1f, -8px -8px 16px #27273f",
|
|
"neu-recessed": "inset 4px 4px 8px #0d0d1f, inset -4px -4px 8px #27273f",
|
|
"glow-green": "0 0 8px #22c55e, 0 0 16px #22c55e40",
|
|
"glow-amber": "0 0 8px #f59e0b, 0 0 16px #f59e0b40",
|
|
"glow-red": "0 0 8px #ef4444, 0 0 16px #ef444440",
|
|
"glow-gray": "0 0 4px #6b7280",
|
|
"glow-blue": "0 0 8px #3b82f6, 0 0 16px #3b82f640",
|
|
},
|
|
borderRadius: {
|
|
neu: "12px",
|
|
},
|
|
animation: {
|
|
"pulse-slow": "pulse 3s ease-in-out infinite",
|
|
"glow-pulse": "glow-pulse 2s ease-in-out infinite",
|
|
},
|
|
keyframes: {
|
|
"glow-pulse": {
|
|
"0%, 100%": { opacity: "1" },
|
|
"50%": { opacity: "0.6" },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}; |