Improve UI; add end game button

This commit is contained in:
Joel Therrien 2023-09-21 19:01:56 -07:00
parent 75d8db4098
commit a34ad8cd12
2 changed files with 31 additions and 18 deletions

View file

@ -305,6 +305,13 @@ export function Game(props: {
<div className="board-log">
<Grid cellTypes={cellTypes} playerLetters={playerLetters} boardLetters={boardLetters} dispatch={trayDispatch}/>
<div className="message-log">
<button className="end-game"
onClick={() => {
props.end_game_fn();
}}
>
End Game
</button>
<Scores playerScores={playerAndScores}/>
<div className="log" ref={logDivRef}>
{logInfo}

View file

@ -173,18 +173,22 @@
max-height: inherit;
display: grid;
grid-template-rows: 6em 1fr;
grid-template-rows: 1.5em 6em 1fr;
.log {
overflow-y: scroll;
}
padding: 0.5em;
}
button.end-game {
margin: 0.5em;
width: fit-content;
height: fit-content;
}
.scoring {
text-align: center;
display: flex;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: none;
@ -197,6 +201,8 @@
margin-right: 10px;
}
}
}
dialog {
border-radius: 10px;