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

Move held card to gap above deck area on mobile portrait

Browse Source 
Position the held card a full card height above the deck (1.15x offset)
so it sits in the space between opponents and the draw/discard piles.
All three position calculations (app.js x2, card-animations.js) are
synced so draw animations land at the correct held position.

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

6
client/app.js
View File

@ -3544,9 +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)
// On mobile portrait, reduce overlap so held card doesn't cover 2-row opponents // On mobile portrait, place held card fully above the deck/discard area
const isMobilePortrait = document.body.classList.contains('mobile-portrait'); const isMobilePortrait = document.body.classList.contains('mobile-portrait');
const overlapOffset = cardHeight * (isMobilePortrait ? 0.15 : 0.35); const overlapOffset = cardHeight * (isMobilePortrait ? 1.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`;
@ -3609,7 +3609,7 @@ class GolfGame {
const cardWidth = deckRect.width; const cardWidth = deckRect.width;
const cardHeight = deckRect.height; const cardHeight = deckRect.height;
const isMobilePortrait = document.body.classList.contains('mobile-portrait'); const isMobilePortrait = document.body.classList.contains('mobile-portrait');
const overlapOffset = cardHeight * (isMobilePortrait ? 0.15 : 0.35); const overlapOffset = cardHeight * (isMobilePortrait ? 1.15 : 0.35);
const cardLeft = centerX - cardWidth / 2; const cardLeft = centerX - cardWidth / 2;
const cardTop = deckRect.top - overlapOffset; const cardTop = deckRect.top - overlapOffset;

2
client/card-animations.js
View File

@ -47,7 +47,7 @@ class CardAnimations {
const cardWidth = deckRect.width; const cardWidth = deckRect.width;
const cardHeight = deckRect.height; const cardHeight = deckRect.height;
const isMobilePortrait = document.body.classList.contains('mobile-portrait'); const isMobilePortrait = document.body.classList.contains('mobile-portrait');
const overlapOffset = cardHeight * (isMobilePortrait ? 0.15 : 0.35); const overlapOffset = cardHeight * (isMobilePortrait ? 1.15 : 0.35);
return { return {
left: centerX - cardWidth / 2, left: centerX - cardWidth / 2,