diff --git a/src/components/GameTable.tsx b/src/components/GameTable.tsx index a33d8bc..9ddcf3c 100644 --- a/src/components/GameTable.tsx +++ b/src/components/GameTable.tsx @@ -65,7 +65,9 @@ export function GameTable({ const exit = onExit ?? reset; const vw = useViewportWidth(); // Pull the played-card pile inward on narrow screens so it clears the side stacks. - const trickScale = vw < 360 ? 0.5 : vw < 460 ? 0.64 : 1; + const trickScale = vw < 360 ? 0.5 : vw < 460 ? 0.6 : 1; + // Smaller played cards on phones so the center pile stays clear of the side seats. + const trickCardSize: "sm" | "md" = vw < 480 ? "sm" : "md"; const { phase, players, hakem, trump, turn, currentTrick } = game; const legalMovesList = useMemo( @@ -196,7 +198,7 @@ export function GameTable({ {/* center trick area (offsets scale down on narrow screens) */} - + @@ -426,11 +428,13 @@ function TrickArea({ winner, phase, scale = 1, + cardSize = "md", }: { trick: { seat: Seat; card: Card }[]; winner: Seat | null; phase: string; scale?: number; + cardSize?: "sm" | "md" | "lg"; }) { const { front } = useCardSkins(); return ( @@ -455,7 +459,7 @@ function TrickArea({ : undefined, }} > - + ); })} diff --git a/src/components/screens/ProfileScreen.tsx b/src/components/screens/ProfileScreen.tsx index bfa6749..141fe55 100644 --- a/src/components/screens/ProfileScreen.tsx +++ b/src/components/screens/ProfileScreen.tsx @@ -65,7 +65,8 @@ export function ProfileScreen() { return ( - + {/* showXp=false: the identity card below already has a detailed XP bar. */} + {/* identity */}