css file added to tic tac toe

This commit is contained in:
NigeParis 2026-01-03 16:22:42 +01:00 committed by Maix0
parent 97b14815b0
commit 914ef550be
4 changed files with 4344 additions and 14 deletions

View file

@ -1,21 +1,20 @@
<div class="displaybox">
<div id="mainbox" class="mainboxDisplay">
<button id="ttt-restart-btn" class="btn-style absolute top-6 right-6">New Game</button>
<button id="ttt-newgame-btn" class="btn-style absolute top-6 right-6">New Game</button>
<h1 class="text-3xl font-bold text-gray-800">
Tic-tac-toe Box<span id="t-username"></span>
</h1><br>
<div class="grid-box mt-4">
<div class="grid grid-cols-3 gap-4 max-w-2xl mx-auto">
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </div>
<div class="bg-blue-500 h-32 flex items-center justify-center text-white text-xl font-bold hover:bg-red-700 ttt-grid-cell"> </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>