jonas/ultimate_tictactoe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

local game is done

Browse Source
This commit is contained in:
Jonas Weinz 2019-03-08 10:40:16 +01:00
parent aaa6dfc020
commit c68ae8f812
2 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
game_manager.js
View File

@ -39,6 +39,8 @@ class GameManager
else else
{ {
this.toggle_local_player(); this.toggle_local_player();
this.grid.block_all()
this.grid.subgrids[y][x].unblock();
} }
} }
} }

32
style.css
View File

@ -4,7 +4,7 @@ html, body {
body { body {
margin: 0; margin: 0;
background: rgb(39, 34, 39); background: rgb(70, 76, 92);
outline: 0; outline: 0;
position: relative; position: relative;
} }
@ -16,8 +16,8 @@ body {
--opacity: 0.2; --opacity: 0.2;
--border-radius: 1vh; --border-radius: 1vh;
--sidebar-width: 25vh; --sidebar-width: 25vh;
--ground-color: rgb(58, 67, 73); --ground-color: rgb(214, 214, 214);
--board-size: calc(var(--tictactoe_n) * var(--tictactoe_n) * var(--tile-size) + var(--tictactoe_n) * var(--button-margin) * 4); --board-size: calc(var(--tictactoe_n) * var(--tictactoe_n) * var(--tile-size) + (var(--tictactoe_n) * var(--tictactoe_n) + var(--tictactoe_n)) * var(--button-margin) );
--sidebar-height: none; /* unused if not in portrait mode */ --sidebar-height: none; /* unused if not in portrait mode */
} }
@ -37,7 +37,7 @@ body {
.main-container { .main-container {
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
padding-top: calc(50vh - 0.5 * (var(--grid-height) * var(--tile-size)) - var(--border-radius)); padding-top: calc(50vh - 0.5 * (var(--board-size)));
} }
/* override settings on portrait mode: */ /* override settings on portrait mode: */
@ -45,7 +45,7 @@ body {
.main-container { .main-container {
white-space: normal; white-space: normal;
padding-top: calc(50vh - var(--board-size) / 2); padding-top: calc(50vh - 0.5 * var(--board-size));
} }
} }
@ -74,19 +74,17 @@ body {
.grid-container { .grid-container {
border-radius: var(--border-radius); border-radius: var(--border-radius);
padding: var(--border-radius);
margin: auto;
width: calc(var(--board-size)); width: calc(var(--board-size));
height: calc(var(--board-size)); height: calc(var(--board-size));
background: rgba(0, 0, 0, var(--opacity)); background: none;
display: inline-block; display: inline-block;
transition-duration: 0.5s; transition-duration: 0.5s;
} }
.subgrid-container { .subgrid-container {
border-radius: var(--border-radius); border-radius: var(--button-margin);
padding: var(--border-radius); padding: var(--button-margin);
margin: auto; margin: var(--button-margin);
width: calc(var(--tictactoe_n) * var(--tile-size)); width: calc(var(--tictactoe_n) * var(--tile-size));
height: calc(var(--tictactoe_n) * var(--tile-size)); height: calc(var(--tictactoe_n) * var(--tile-size));
background: rgba(0, 0, 0, var(--opacity)); background: rgba(0, 0, 0, var(--opacity));
@ -95,9 +93,9 @@ body {
} }
.subgrid-container-activated { .subgrid-container-activated {
border-radius: var(--border-radius); border-radius: var(--button-margin);
padding: var(--border-radius); padding: var(--button-margin);
margin: auto; margin: var(--button-margin);
width: calc(var(--tictactoe_n) * var(--tile-size)); width: calc(var(--tictactoe_n) * var(--tile-size));
height: calc(var(--tictactoe_n) * var(--tile-size)); height: calc(var(--tictactoe_n) * var(--tile-size));
background: rgba(0,25,64,var(--opacity)); background: rgba(0,25,64,var(--opacity));
@ -113,7 +111,7 @@ body {
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
flex-direction:column; flex-direction:column;
min-height: var(--board-size); height: calc(var(--board-size) - 2 * var(--border-radius));
position: relative; position: relative;
transition-duration: 0.5s; transition-duration: 0.5s;
} }
@ -125,8 +123,8 @@ body {
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
flex-direction:row; flex-direction:row;
min-height: var(--sidebar-height); height: var(--sidebar-height);
min-width: var(--board-size); width: calc(var(--board-size));
} }
} }