From 05d34f5b4f81eed7e4769bf3ece35b0fbe35e43b Mon Sep 17 00:00:00 2001
From: Cal Corum <calcorum@users.noreply.github.com>
Date: Fri, 6 Feb 2026 19:53:56 -0600
Subject: [PATCH] CLAUDE: Add responsive layout - stack pitcher/batter on
 mobile with pitcher on top

---
 frontend-sba/components/Game/CurrentSituation.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/frontend-sba/components/Game/CurrentSituation.vue b/frontend-sba/components/Game/CurrentSituation.vue
index b644346..633ad6f 100644
--- a/frontend-sba/components/Game/CurrentSituation.vue
+++ b/frontend-sba/components/Game/CurrentSituation.vue
@@ -1,12 +1,12 @@
 <template>
   <div class="current-situation">
-    <!-- Side-by-Side Card Layout -->
-    <div class="grid grid-cols-2 gap-4">
-      <!-- Current Batter Card (LEFT) -->
+    <!-- Side-by-Side Card Layout (stacked on mobile) -->
+    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+      <!-- Current Batter Card (LEFT on desktop, BOTTOM on mobile) -->
       <button
         v-if="currentBatter"
         :class="[
-          'player-card batter-card card-transition',
+          'player-card batter-card card-transition order-2 md:order-1',
           batterCardClasses
         ]"
         @click="openPlayerCard('batter')"
@@ -34,11 +34,11 @@
         </div>
       </button>
 
-      <!-- Current Pitcher Card (RIGHT) -->
+      <!-- Current Pitcher Card (RIGHT on desktop, TOP on mobile) -->
       <button
         v-if="currentPitcher"
         :class="[
-          'player-card pitcher-card card-transition',
+          'player-card pitcher-card card-transition order-1 md:order-2',
           pitcherCardClasses
         ]"
         @click="openPlayerCard('pitcher')"