diff options
| -rw-r--r-- | webapp/src/components/table.rs | 14 | ||||
| -rw-r--r-- | webapp/src/default.css | 18 |
2 files changed, 25 insertions, 7 deletions
diff --git a/webapp/src/components/table.rs b/webapp/src/components/table.rs index 403ee8d..bd49b10 100644 --- a/webapp/src/components/table.rs +++ b/webapp/src/components/table.rs @@ -87,12 +87,18 @@ impl OnlineTableInner { html! { <> <div class="game-layout"> + <div class="navbar"> + <ul> + <li>{format!("This is table {}", ctx.props().table.id)}</li> + <li> + <button onclick={leave_table}> + { "Leave table" } + </button> + </li> + </ul> + </div> {center} </div> - <p>{format!("This is table {}", ctx.props().table.id)}</p> - <button onclick={leave_table}> - { "Leave table" } - </button> </> } } diff --git a/webapp/src/default.css b/webapp/src/default.css index 6240fa8..acb8356 100644 --- a/webapp/src/default.css +++ b/webapp/src/default.css @@ -22,15 +22,27 @@ body { .game-layout { display: grid; - grid-template-areas: "north north north sidebar" + grid-template-areas: + "navbar navbar navbar navbar" + "north north north sidebar" "west center east sidebar" "south south south sidebar"; - grid-template-rows: 10vw minmax(200px, 1fr) 10vw; + grid-template-rows: 5vw 10vw minmax(200px, 1fr) 10vw; grid-template-columns: 10vw 1fr 10vw 20vw; - width: 100vw; + width: 100%; height: 100vh; } +.navbar { + grid-area: navbar; + background: #eef; +} + +.navbar li { + display: inline; + padding-right: 0.5em; +} + .playing-center-layout { display: grid; grid-template-areas: "current-trick"; |