Add gradient backgrounds to all status messages, match final-turn badge size

- Default gradient on base .status-message (dark green)
- Add round-over/game-over (gold) and reveal (purple) gradient styles
- Tag action prompts (swap, flip, discard) as your-turn type
- Match final-turn badge font size and padding to status message on mobile
- Hide status message when empty

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken
2026-02-22 21:31:20 -05:00
parent cb311ec0da
commit cb49fd545b
2 changed files with 29 additions and 7 deletions

View File

@@ -923,16 +923,16 @@ class GolfGame {
this.displayHeldCard(data.card, true);
this.renderGame();
}
this.showToast('Swap with a card or discard', '', 3000);
this.showToast('Swap with a card or discard', 'your-turn', 3000);
break;
case 'can_flip':
this.waitingForFlip = true;
this.flipIsOptional = data.optional || false;
if (this.flipIsOptional) {
this.showToast('Flip a card or skip', '', 3000);
this.showToast('Flip a card or skip', 'your-turn', 3000);
} else {
this.showToast('Flip a face-down card', '', 3000);
this.showToast('Flip a face-down card', 'your-turn', 3000);
}
this.renderGame();
break;
@@ -2959,7 +2959,7 @@ class GolfGame {
this.hideToast();
} else {
const remaining = requiredFlips - uniquePositions.length;
this.showToast(`Select ${remaining} more card${remaining > 1 ? 's' : ''} to flip`, '', 5000);
this.showToast(`Select ${remaining} more card${remaining > 1 ? 's' : ''} to flip`, 'your-turn', 5000);
}
return;
}