alee/golfgame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Shrink mobile player/deck cards and widen opponent hand spacing

Browse Source 
Reduces card sizes from 72×101 to 64×90 on mobile portrait to prevent
overlap with bottom bar when opponents wrap to 2 rows. Increases
horizontal gap between opponent hands from 4px to 10px for better
readability of player chips.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-22 12:58:40 -05:00
parent 82e5226acc
commit 0dbb2d13ed
1 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
client/style.css
View File

@ -5031,7 +5031,7 @@ body.mobile-portrait .opponents-row {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
align-items: flex-start; align-items: flex-start;
gap: 4px; gap: 4px 10px;
min-height: 0 !important; min-height: 0 !important;
padding: 2px 4px 6px; padding: 2px 4px 6px;
overflow: hidden; overflow: hidden;
@ -5115,15 +5115,15 @@ body.mobile-portrait .deck-area {
body.mobile-portrait .deck-area > .card, body.mobile-portrait .deck-area > .card,
body.mobile-portrait #deck, body.mobile-portrait #deck,
body.mobile-portrait #discard { body.mobile-portrait #discard {
width: 72px !important; width: 64px !important;
height: 101px !important; height: 90px !important;
font-size: 1.5rem !important; font-size: 1.4rem !important;
} }
/* Held card floating should NOT be constrained to deck/discard size */ /* Held card floating should NOT be constrained to deck/discard size */
body.mobile-portrait .held-card-floating { body.mobile-portrait .held-card-floating {
width: 72px !important; width: 64px !important;
height: 101px !important; height: 90px !important;
} }
body.mobile-portrait .discard-stack { body.mobile-portrait .discard-stack {
@ -5165,15 +5165,15 @@ body.mobile-portrait .player-showing {
/* Player hand: fixed-size cards */ /* Player hand: fixed-size cards */
body.mobile-portrait .player-section .card-grid { body.mobile-portrait .player-section .card-grid {
grid-template-columns: repeat(3, 72px) !important; grid-template-columns: repeat(3, 64px) !important;
gap: 5px !important; gap: 5px !important;
justify-content: center; justify-content: center;
} }
body.mobile-portrait .player-section .card { body.mobile-portrait .player-section .card {
width: 72px !important; width: 64px !important;
height: 101px !important; height: 90px !important;
font-size: 1.5rem !important; font-size: 1.4rem !important;
} }
/* Real cards: font-size is now set inline by card-manager.js (proportional to card width). /* Real cards: font-size is now set inline by card-manager.js (proportional to card width).