mirror of
https://github.com/jhbruhn/respira.git
synced 2026-01-27 10:23:41 +00:00
ab9b22b9b8
- Define semantic color theme in App.css using @theme directive - Primary (blue), Success (green), Warning (amber), Danger (red) - Info (cyan), Accent (purple), Secondary (orange), Tertiary (teal) - Semantic colors reference Tailwind color variables via var() - Media query-based dark mode for canvas colors - Migrate all 16 components from direct Tailwind colors to semantic names - Create cssVariables.ts utility for Konva canvas color access - Update KonvaComponents to use CSS variables dynamically - Replace @apply with CSS variables in index.css for v4 compatibility - Remove unused designTokens.ts file - Improve light mode contrast with gray-300 app background - Adjust canvas and info box backgrounds to gray-200 Benefits: - Easy theme customization by updating App.css @theme block - Consistent semantic naming across all components - Proper dark mode support via media queries - No visual regressions, all colors maintained 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| bluetoothSupport.ts | ||
| cssVariables.ts | ||
| errorCodeHelpers.ts | ||
| konvaRenderers.ts | ||
| machineStateHelpers.ts | ||
| timeCalculation.ts | ||