43 lines
No EOL
1.9 KiB
HTML
43 lines
No EOL
1.9 KiB
HTML
<div class="displaybox">
|
|
<div id="mainbox" class="mainboxDisplay">
|
|
<button id="JoinQueueBtn" class="btn-style absolute top-4 right-6">Join Queue</button>
|
|
<h1 class="text-3xl font-bold text-gray-800">
|
|
Tic-tac-toe Box<span id="t-username"></span>
|
|
</h1><br>
|
|
<div class="grid grid-cols-[auto_1fr_auto_1fr_auto] items-center rounded-lg px-4 py-3">
|
|
<div class="text-7xl text-gray-800 mx-4 font-bold" id="playerX">
|
|
X
|
|
</div>
|
|
<div class="text-left">
|
|
<div class="font-semibold text-gray-800" id="playerX-name"></div>
|
|
<div class="text-lg text-gray-800" id="playerX-timer"></div>
|
|
</div>
|
|
|
|
<div class="text-center text-sm text-gray-800 px-4 whitespace-nowrap">
|
|
<div id="currentPlayer" class='text-7xl font-bold'></div>
|
|
<div id="currentPlayerTimer">Waiting for match...</div>
|
|
</div>
|
|
|
|
<div class="text-right">
|
|
<div class="font-semibold text-gray-800" id="playerO-name"></div>
|
|
<div class="text-lg text-gray-800" id="playerO-timer"></div>
|
|
</div>
|
|
<div class="text-7xl text-gray-800 mx-4 font-bold" id="playerO">
|
|
O
|
|
</div>
|
|
</div>
|
|
<div class="grid-box mt-2">
|
|
<div class="grid-layout">
|
|
<div id="cell1" class="ttt-cell"></div>
|
|
<div id="cell2" class="ttt-cell"></div>
|
|
<div id="cell3" class="ttt-cell"></div>
|
|
<div id="cell4" class="ttt-cell"></div>
|
|
<div id="cell5" class="ttt-cell"></div>
|
|
<div id="cell6" class="ttt-cell"></div>
|
|
<div id="cell7" class="ttt-cell"></div>
|
|
<div id="cell8" class="ttt-cell"></div>
|
|
<div id="cell9" class="ttt-cell"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |