215c37350b
The team breakdown page rendered a 5-column table that overflowed on phones, forcing horizontal scroll. Add a responsive card layout for mobile that shows every field (pick #, sport, participant, position, points) with no horizontal scroll, while keeping the existing sortable table on desktop (md+). - Header now stacks on mobile (flex-col -> sm:flex-row). - Mobile renders one card per pick with a compact sort control (field select + asc/desc toggle) instead of clickable column headers. - Extract shared PositionCell / PointsValue / pickLabel helpers so the table and cards stay in sync. - Update tests to scope table assertions and cover the mobile view. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EGQoRPjRycNSjwLrUwuKhw |
||
|---|---|---|
| .. | ||
| __tests__ | ||
| PointProgressionChart.stories.tsx | ||
| PointProgressionChart.tsx | ||
| PointsDisplay.tsx | ||
| RecentScoresCard.stories.tsx | ||
| RecentScoresCard.tsx | ||
| StandingsTable.tsx | ||
| TeamScoreBreakdown.tsx | ||