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

Lower held card position and add opponent row padding on mobile

Browse Source 
Reduce held card overlap offset from 0.35 to 0.15 on mobile portrait
so it doesn't cover the second row of opponents. Increase bottom
padding on opponents row from 6px to 12px for more breathing room.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-22 18:10:11 -05:00
parent 932e9ca4ef
commit ecad259db2
2 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/app.js
View File

@ -3544,7 +3544,9 @@ class GolfGame {
const cardHeight = deckRect.height; const cardHeight = deckRect.height;
// Position card centered, overlapping both piles (lower than before) // Position card centered, overlapping both piles (lower than before)
const overlapOffset = cardHeight * 0.35; // More overlap = lower position // On mobile portrait, reduce overlap so held card doesn't cover 2-row opponents
const isMobilePortrait = document.body.classList.contains('mobile-portrait');
const overlapOffset = cardHeight * (isMobilePortrait ? 0.15 : 0.35);
const cardLeft = centerX - cardWidth / 2; const cardLeft = centerX - cardWidth / 2;
const cardTop = deckRect.top - overlapOffset; const cardTop = deckRect.top - overlapOffset;
this.heldCardFloating.style.left = `${cardLeft}px`; this.heldCardFloating.style.left = `${cardLeft}px`;

2
client/style.css
View File

@ -5071,7 +5071,7 @@ body.mobile-portrait .opponents-row {
align-items: flex-start; align-items: flex-start;
gap: 9px 10px; gap: 9px 10px;
min-height: 0 !important; min-height: 0 !important;
padding: 2px 4px 6px; padding: 2px 4px 12px;
overflow: visible; overflow: visible;
flex-shrink: 0; flex-shrink: 0;
} }