FRONTEND — Add Animations & Polish #279
Description
Description:
Add motion and micro-interactions.
Location:
All components created in previous issues (StreakSummaryCard.tsx, StreakDayIndicator.tsx, WeeklyCalendar.tsx, ShareStreakCard.tsx, ShareOptionsSheet.tsx, app/streak/page.tsx)
Existing Components to Use:
All previously created components
Navigation:
This polish will be applied when clicking the streak fire icon on the navbar, which navigates to /streak page.
Enhancements
- Flame subtle pulse when active
- Bottom sheet slide animation
- Modal fade/scale
- Hover states (web)
- Reduced motion support
Acceptance Criteria
- Smooth 60fps animations
- No layout shift
- Respect prefers-reduced-motion
- Performance optimized