Header polish: - Glassmorphism: bg-background/80 backdrop-blur-lg + subtle border - Search bar focus-within ring on container - Avatar hover: ring-primary/50 + scale-105 - Notification badge animate-pulse Card hover effects: - Interactive Card variant: hover border-primary/20 tint - ProductCard: lift (-translate-y-1) + shadow-lg + cover scale-105 - PlaylistCard: lift + shadow-lg + cover scale-105 - CourseCard: lift + shadow-xl + cover scale-105 ContentTransition component (new): - Reusable skeleton-to-content crossfade with AnimatePresence - Applied to DashboardPage as proof-of-concept Notification badge pulse: - Sidebar collapsed badges: radar-ping effect (animate-ping behind solid dot) - Header notification bell: matching ping animation on unread count Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|---|---|---|
| .. | ||
| ContentTransition.tsx | ||
| index.ts | ||