53 lines
1.6 KiB
HTML
53 lines
1.6 KiB
HTML
<app-navbar></app-navbar>
|
|
|
|
<div class="container mx-auto px-4 py-6 space-y-8">
|
|
<div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
|
<div class="lg:col-span-3 space-y-6 flex flex-col gap-4">
|
|
<app-dealer-hand [cards]="dealerCards()"></app-dealer-hand>
|
|
<app-player-hand [cards]="playerCards()"></app-player-hand>
|
|
|
|
@if (isActionInProgress()) {
|
|
<div class="flex justify-center">
|
|
<div
|
|
class="card p-4 flex items-center gap-3 animate-pulse bg-deep-blue-light border border-deep-blue-light/50"
|
|
>
|
|
<div
|
|
class="w-5 h-5 rounded-full border-2 border-white border-t-transparent animate-spin"
|
|
></div>
|
|
<span>{{ currentAction() }}</span>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
@if (gameInProgress()) {
|
|
<app-game-controls
|
|
[playerCards]="playerCards()"
|
|
[gameState]="gameState()"
|
|
[isActionInProgress]="isActionInProgress()"
|
|
(hit)="onHit()"
|
|
(stand)="onStand()"
|
|
(doubleDown)="onDoubleDown()"
|
|
(leave)="leaveGame()"
|
|
></app-game-controls>
|
|
}
|
|
</div>
|
|
|
|
<div class="lg:col-span-1 space-y-6">
|
|
<app-game-info
|
|
[balance]="balance()"
|
|
[currentBet]="currentBet()"
|
|
[gameInProgress]="gameInProgress()"
|
|
[isActionInProgress]="isActionInProgress()"
|
|
(newGame)="onNewGame($event)"
|
|
></app-game-info>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Game Result Modal -->
|
|
<app-game-result
|
|
[gameState]="gameState()"
|
|
[amount]="currentBet()"
|
|
[show]="showGameResult()"
|
|
(gameResultClosed)="onCloseGameResult()"
|
|
></app-game-result>
|