|
|
@ -1,10 +1,12 @@ |
|
|
|
body { |
|
|
|
body { |
|
|
|
|
|
|
|
padding: 5vmin; |
|
|
|
display: grid; |
|
|
|
display: grid; |
|
|
|
grid-template-columns: 1fr 1fr; |
|
|
|
grid-template-columns: 1fr 1fr; |
|
|
|
grid-template-rows: min-content 1fr; |
|
|
|
grid-template-rows: min-content 1fr; |
|
|
|
grid-template-areas: |
|
|
|
grid-template-areas: |
|
|
|
"counters counters" |
|
|
|
"counters counters" |
|
|
|
"game1 game2"; |
|
|
|
"game1 game2"; |
|
|
|
|
|
|
|
grid-column-gap: 5vmin; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
section.counters { |
|
|
|
section.counters { |
|
|
@ -47,7 +49,7 @@ table.game-board-table { |
|
|
|
|
|
|
|
|
|
|
|
table.game-board-table tbody.game-board td { |
|
|
|
table.game-board-table tbody.game-board td { |
|
|
|
border: solid 6px black; |
|
|
|
border: solid 6px black; |
|
|
|
padding: 3px |
|
|
|
padding: 3px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
tbody.game-board button, |
|
|
|
tbody.game-board button, |
|
|
@ -57,7 +59,7 @@ tbody.game-board button:hover { |
|
|
|
height: 4em; |
|
|
|
height: 4em; |
|
|
|
border: none; |
|
|
|
border: none; |
|
|
|
background-color: transparent; |
|
|
|
background-color: transparent; |
|
|
|
color:transparent; |
|
|
|
color: transparent; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
tbody.game-board button.square-X { |
|
|
|
tbody.game-board button.square-X { |
|
|
@ -70,6 +72,6 @@ tbody.game-board button.square-O { |
|
|
|
background-size: 100% 100%; |
|
|
|
background-size: 100% 100%; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
tbody.game-board button.square-_ { |
|
|
|
tbody.game-board button.square-_:enabled { |
|
|
|
cursor: pointer; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
} |
|
|
|