03-03: Workout Experience Polish - enhanced exercise cards, progress badges, rest timer, KLART button, warmup styling

This commit is contained in:
2026-02-28 23:47:36 +01:00
parent db32277fb1
commit f6b1379a73
4 changed files with 205 additions and 27 deletions
@@ -0,0 +1,64 @@
# Plan 03-02: Dashboard Polish
**Goal:** Transform dashboard from "functional but plain" to polished, enterprise-grade experience
## Current Issues
1. **Header** - Basic brand title, no logo mark like auth pages
2. **Stat cards** - Plain boxes, no depth or premium feel
3. **Calendar** - Functional but lacks visual polish
4. **Coach section** - Avatar icon looks basic, message bubble plain
5. **Today's workout card** - Needs better visual weight and polish
6. **Spacing rhythm** - Inconsistent paddings/margins throughout
## Implementation
### Files to Modify
- frontend/src/pages/Dashboard.jsx
- frontend/src/App.css (dashboard section)
### Changes
**1. Header Branding**
- Replace "Gravl" text with Logo component (reuse from LoginPage)
- Add gradient text or subtle brand treatment
- Better nav button styling with active states
**2. Stat Cards Enhancement**
- Gradient backgrounds or subtle depth
- Better number typography (larger, bolder)
- Icons with color accents
- Improved spacing and hover states
**3. Calendar Polish**
- Today highlight with brand color
- Better day cell sizing and spacing
- Subtle shadows on workout days
- Smoother transitions
**4. Coach Section**
- Better avatar styling (circle with gradient bg)
- Message bubble with subtle background
- Improved typography hierarchy
**5. Today's Workout Card**
- Full-width card with improved styling
- Better exercise count/time display
- Arrow button with hover animation
- Subtle gradient or depth
**6. CSS Polish**
- Consistent section spacing (use --space-* variables)
- Improve typography scale
- Add subtle animations/transitions
- Better mobile touch targets
## Success Criteria
- [ ] Header uses same Logo component as auth pages
- [ ] Stat cards feel premium (depth/color/accent)
- [ ] Calendar has improved today indicator
- [ ] Coach section looks polished and friendly
- [ ] Workout card has clear visual hierarchy
- [ ] Consistent spacing throughout dashboard