fix : various css and layout fixes

components/game/player/Slot.vue

@@ -299,6 +299,7 @@ function discardCardClick(card: Card) {
 
 .player {
   display: grid;
+  height: 100%;
   grid-template-columns: 1fr;
   grid-template-rows: min-content 1fr;
   /* border-top: 5px solid black; */
@@ -308,6 +309,7 @@ function discardCardClick(card: Card) {
     "turn_buttons";
   justify-items: center;
   transition: all 1s;
+  overflow-x: hidden;
 }
 
 #current_player_board {

components/game/player/Stats.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { Transition } from "vue";
 import { playSound } from "~/helpers/audioHelpers";
 import type { Game, Player } from "~/netcode/interfaces";
 
@@ -27,24 +28,26 @@ const isTurn = computed(
       {{ team?.health }}
     </span>
   </div>
-  <div class="turn_icon" v-if="isTurn">
-    <img src="/img/gold.png" class="icon_img" draggable="false" />
-    <span class="turn_icon_number">
-      {{ game.currentTurn.gold }}
-    </span>
-  </div>
-  <div class="turn_icon" v-if="isTurn">
-    <img src="/img/damage.png" class="icon_img" draggable="false" />
-    <span class="turn_icon_number">
-      {{ game.currentTurn.damage }}
-    </span>
-  </div>
   <div class="turn_icon">
     <img src="/img/fuck.svg" class="icon_img" draggable="false" />
     <span class="turn_icon_number">{{
       (player.discardMarkers ?? 0) + (player.fuckUMarkers ?? 0)
     }}</span>
   </div>
+
+  <div class="turn_icon" v-show="isTurn">
+    <img src="/img/gold.png" class="icon_img" draggable="false" />
+    <span class="turn_icon_number">
+      {{ game.currentTurn.gold }}
+    </span>
+  </div>
+
+  <div class="turn_icon" v-show="isTurn">
+    <img src="/img/damage.png" class="icon_img" draggable="false" />
+    <span class="turn_icon_number">
+      {{ game.currentTurn.damage }}
+    </span>
+  </div>
 </template>
 
 <style scoped>