diff --git a/tank-frontend/src/Controls.css b/tank-frontend/src/Controls.css index 3344d3d..2c587fa 100644 --- a/tank-frontend/src/Controls.css +++ b/tank-frontend/src/Controls.css @@ -1,7 +1,6 @@ .Controls { - display: flex; text-align: center; - flex-grow: 1; + gap: calc(4 * var(--padding-normal)); } .Controls-Container { @@ -27,4 +26,5 @@ kbd { kbd.space { width: calc(3 * var(--kbd-key-size) + 2 * var(--padding-normal)); + margin-top: calc(var(--kbd-key-size) + var(--padding-normal)); } diff --git a/tank-frontend/src/Controls.tsx b/tank-frontend/src/Controls.tsx index 5e15fc2..15a3b46 100644 --- a/tank-frontend/src/Controls.tsx +++ b/tank-frontend/src/Controls.tsx @@ -1,7 +1,6 @@ import './Controls.css'; import useWebSocket, {ReadyState} from 'react-use-websocket'; import {useEffect} from 'react'; -import Column from "./components/Column.tsx"; export default function Controls({playerId, logout}: { playerId: string, @@ -62,7 +61,7 @@ export default function Controls({playerId, logout}: { }; }, [readyState]); - return + return

Move

@@ -77,5 +76,5 @@ export default function Controls({playerId, logout}: {

Fire

Space
- ; +
; } diff --git a/tank-frontend/src/PlayerInfo.tsx b/tank-frontend/src/PlayerInfo.tsx index 55698d4..fec65f0 100644 --- a/tank-frontend/src/PlayerInfo.tsx +++ b/tank-frontend/src/PlayerInfo.tsx @@ -23,7 +23,7 @@ export default function PlayerInfo({playerId, logout}: { return () => clearInterval(timer); }, [playerId]); - return + return

{player ? `Playing as ${player?.name}` : 'loading...'}

diff --git a/tank-frontend/src/Scoreboard.tsx b/tank-frontend/src/Scoreboard.tsx index 47dcb04..4b266af 100644 --- a/tank-frontend/src/Scoreboard.tsx +++ b/tank-frontend/src/Scoreboard.tsx @@ -23,7 +23,6 @@ export default function Scoreboard({}: {}) { return