franpcode/Tic-Tac-Toe-Game
1
0
Fork 0
mirror of https://github.com/FranP-code/Tic-Tac-Toe-Game.git synced 2025-10-12 23:52:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Message of active player added

Browse Source
This commit is contained in:
Francisco Pessano
2021-12-27 18:31:10 -03:00
parent d4392e8236
commit bb879e9eac
5 changed files with 67 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
styles/styles.css
View File

@@ -115,48 +115,52 @@ emoji-picker {
z-index: 100;
}
.game {
.game .tic-tac-toe {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
}
.game .box {
.game .tic-tac-toe .box {
width: 10vw;
height: 10vw;
font-size: 75pt;
font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
font-weight: bold;
border: 2px #fff solid;
box-sizing: border-box;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
user-select: none;
color: #e7e7e7;
}
.game .box#box-1 {
.game .tic-tac-toe .box#box-1 {
border-top: 0px;
border-left: 0px;
}
.game .box#box-2 {
.game .tic-tac-toe .box#box-2 {
border-top: 0px;
}
.game .box#box-3 {
.game .tic-tac-toe .box#box-3 {
border-top: 0px;
border-right: 0px;
}
.game .box#box-4 {
.game .tic-tac-toe .box#box-4 {
border-left: 0px;
}
.game .box#box-6 {
.game .tic-tac-toe .box#box-6 {
border-right: 0px;
}
.game .box#box-7 {
.game .tic-tac-toe .box#box-7 {
border-bottom: 0px;
border-left: 0px;
}
.game .box#box-8 {
.game .tic-tac-toe .box#box-8 {
border-bottom: 0px;
}
.game .box#box-9 {
.game .tic-tac-toe .box#box-9 {
border-bottom: 0px;
border-right: 0px;
}
@@ -167,6 +171,17 @@ emoji-picker {
top: -100%;
}
.game .players-turn {
position: absolute;
top: -30%;
left: -20%;
}
.game .players-turn span {
font-size: 30pt;
font-weight: bold;
color: #e7e7e7;
}
@media (max-width: 900px) {
.game {
width: 80vw;