feature/gameplay-ui-improvements #2

cal · 2026-02-07T04:45:52Z

cal commented

2026-02-07 04:45:52 +00:00

No description provided.

cal added 9 commits 2026-02-07 04:45:53 +00:00

CLAUDE: Add RunnersOnBase component with expanding cards and runner/catcher matchup 5d20d84568

- Created RunnersOnBase.vue component with split layout (runners left, catcher right)
- Created RunnerCard.vue for individual runner cards with expand-in-place functionality
- Integrated component into GamePlay.vue (mobile and desktop layouts)
- Added team color computed properties for batting/fielding teams
- Component only shows when runners on base (hasRunners computed)
- Click runner card to expand in place and show full player card + catcher matchup
- Smooth CSS transitions and animations matching pitcher/batter card style
- Includes design documentation and HTML mockup for reference

CLAUDE: Fix invalid Tailwind duration class in RunnerCard 674749975f

- Changed duration-400 to duration-300 (valid Tailwind class)
- Fixes PostCSS build error

CLAUDE: Remove GameBoard (diamond) component from gameplay view 659ac7759d

- Removed GameBoard component from both mobile and desktop layouts
- Removed unused GameBoard import
- RunnersOnBase component now handles runner display
- Cleaner UI focused on pitcher/batter matchup and expandable runner cards

CLAUDE: Add TODO for visual polish on RunnersOnBase component f0979ccc9e

- Added TODO comment to improve styling, colors, animations
- Component is functional and working well, ready for future aesthetic improvements

CLAUDE: Add comprehensive tests for RunnersOnBase and RunnerCard components 078516f682

- Test empty/occupied/expanded states
- Test player name handling and initials
- Test runner selection and catcher card expansion
- Test team color integration
- All 40 tests passing

CLAUDE: Reverse pitcher/batter positions - batter now on left, pitcher on right 2e8c01f154

CLAUDE: Make runners container background more transparent (bg-white/50) c6cf8e49fb

CLAUDE: Increase transparency of runners container (bg-white/20) for more subtle appearance 45098955f1

CLAUDE: Add responsive layout - stack pitcher/batter on mobile with pitcher on top 05d34f5b4f

cal added 1 commit 2026-02-07 04:57:58 +00:00

CLAUDE: Flip mobile layout - batter on top, pitcher below ae728fd052

cal merged commit 9ba611bfee into main

2026-02-07 05:01:17 +00:00

cal deleted branch feature/gameplay-ui-improvements

2026-02-07 05:01:18 +00:00

cal referenced this issue from a commit

2026-02-07 05:01:19 +00:00