Style boost
This commit is contained in:
@@ -3,11 +3,12 @@
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"rank board opponent-side-board"
|
||||
"rank board opponent-info"
|
||||
"rank board player-info"
|
||||
"rank board player-side-board"
|
||||
". file .";
|
||||
grid-template-columns: auto 1fr auto;
|
||||
grid-template-rows: repeat(3, 1fr) auto;
|
||||
grid-template-rows: 3fr 1fr 1fr 3fr auto;
|
||||
background-color: #444;
|
||||
gap: 5px;
|
||||
place-self: center;
|
||||
@@ -103,18 +104,29 @@
|
||||
align-content: stretch;
|
||||
}
|
||||
|
||||
.login-to-play {
|
||||
background: linear-gradient(45deg, beige, white);
|
||||
display: grid;
|
||||
place-content: center;
|
||||
}
|
||||
|
||||
@media all and (max-width: 900px) {
|
||||
.game-board {
|
||||
grid-template-areas:
|
||||
". opponent-side-board ."
|
||||
"rank board player-info"
|
||||
". file ."
|
||||
". player-side-board .";
|
||||
grid-template-rows: auto 1fr auto auto;
|
||||
gap: 1rem;
|
||||
". opponent-side-board"
|
||||
". opponent-info"
|
||||
"rank board"
|
||||
". file"
|
||||
". player-info"
|
||||
". player-side-board";
|
||||
grid-template-rows: repeat(2, auto) 1fr repeat(3, auto);
|
||||
gap: 0.25rem;
|
||||
}
|
||||
|
||||
.side-board {
|
||||
min-height: 2rem;
|
||||
}
|
||||
.player-info {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user