beabigegg
|
57cf91271c
|
feat: modernize frontend UI with Tailwind v4 and professional design system
BREAKING CHANGE: Migrated to Tailwind CSS v4 configuration system
Key Changes:
- Migrated from Tailwind v3 to v4 configuration system
- Removed tailwind.config.js (incompatible with v4)
- Updated index.css with @theme directive and oklch color space
- Defined all custom animations directly in CSS using @keyframes
- Redesigned LoginPage with modern, enterprise-grade UI:
- Full-screen gradient background (blue → purple → pink)
- Floating animated orbs with blur effects
- Glass morphism white card with backdrop-blur
- Gradient buttons with shadow effects
- 7 custom animations: fade-in, slide-in-right, slide-in-left, scale-in, shimmer, pulse, float
- Added shadcn/ui components:
- alert.tsx, dialog.tsx, input.tsx, label.tsx, select.tsx, tabs.tsx
- Updated dependencies:
- Added class-variance-authority ^0.7.0
- Added react-markdown ^9.0.1
- Updated frontend documentation:
- Comprehensive README.md with feature list, tech stack, project structure
- Quick start guide and deployment instructions
Technical Details:
- Tailwind v4 uses @import "tailwindcss" instead of @tailwind directives
- All theme customization now in @theme block with CSS variables
- Color system migrated to oklch for better perceptual uniformity
- Animation definitions moved from config to CSS @layer utilities
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-11-13 08:55:01 +08:00 |
|