From af2d6a1f16b66031d18f0b7cd5470447191d732e Mon Sep 17 00:00:00 2001 From: Vinzenz Schroeter Date: Sun, 14 Apr 2024 00:49:39 +0200 Subject: [PATCH] improved gadget layout --- tank-frontend/public/CCCBFont.ttf | Bin 0 -> 93084 bytes tank-frontend/src/Controls.css | 8 ++---- tank-frontend/src/Controls.tsx | 32 ++++++++++----------- tank-frontend/src/PlayerInfo.tsx | 23 ++++++++------- tank-frontend/src/components/Column.css | 1 - tank-frontend/src/components/DataTable.css | 2 +- tank-frontend/src/components/Row.css | 1 - tank-frontend/src/index.css | 27 +++++++++-------- tank-frontend/src/index.tsx | 2 +- 9 files changed, 46 insertions(+), 50 deletions(-) create mode 100644 tank-frontend/public/CCCBFont.ttf diff --git a/tank-frontend/public/CCCBFont.ttf b/tank-frontend/public/CCCBFont.ttf new file mode 100644 index 0000000000000000000000000000000000000000..f85643de68ba418567e1bb2d32ffc84991009c4c GIT binary patch literal 93084 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 literal 0 HcmV?d00001 diff --git a/tank-frontend/src/Controls.css b/tank-frontend/src/Controls.css index 88b5b6e..6946ffc 100644 --- a/tank-frontend/src/Controls.css +++ b/tank-frontend/src/Controls.css @@ -32,19 +32,17 @@ kbd:active { box-shadow: 0 1px rgba(0, 0, 0, .13) inset; } -.controls { +.Controls { display: flex; color: lightgray; + text-align: center; + align-items: center !important; } .control { margin: 0 1em; } -.control h3 { - text-align: center; -} - .row { display: flex; } diff --git a/tank-frontend/src/Controls.tsx b/tank-frontend/src/Controls.tsx index 8f43450..dfaed5d 100644 --- a/tank-frontend/src/Controls.tsx +++ b/tank-frontend/src/Controls.tsx @@ -59,23 +59,21 @@ export default function Controls({playerId, logout}: { }; }, [sendMessage]); - return <> - -
-
- ▲ -
-
- ◀ - ▼ - ▶ -
+ return +
+
+ ↑
-

Move

-
- Space +
+ ← + ↓ + →
-

Fire

- - ; +
+

Move

+ + Space + +

Fire

+ ; } diff --git a/tank-frontend/src/PlayerInfo.tsx b/tank-frontend/src/PlayerInfo.tsx index a2f1f5b..a3e6d3d 100644 --- a/tank-frontend/src/PlayerInfo.tsx +++ b/tank-frontend/src/PlayerInfo.tsx @@ -3,7 +3,6 @@ import './PlayerInfo.css' import {PlayerResponse, getPlayer} from './serverCalls'; import {Guid} from "./Guid.ts"; import Column from "./components/Column.tsx"; -import Row from "./components/Row.tsx"; export default function PlayerInfo({playerId, logout}: { playerId: Guid, @@ -27,15 +26,19 @@ export default function PlayerInfo({playerId, logout}: { return

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

- -

kills:

-

{player?.scores.kills}

-
- -

deaths:

-

{player?.scores.deaths}

-
+ + + + + + + + + + + +
kills:{player?.scores.kills}
deaths:{player?.scores.deaths}
; } diff --git a/tank-frontend/src/components/Column.css b/tank-frontend/src/components/Column.css index 791c0ae..a5e48ab 100644 --- a/tank-frontend/src/components/Column.css +++ b/tank-frontend/src/components/Column.css @@ -1,7 +1,6 @@ .Column { display: flex; flex-direction: column; - flex: auto; max-height: 100%; align-items: stretch; gap: 8px; diff --git a/tank-frontend/src/components/DataTable.css b/tank-frontend/src/components/DataTable.css index 2fc4e78..3ba8ebc 100644 --- a/tank-frontend/src/components/DataTable.css +++ b/tank-frontend/src/components/DataTable.css @@ -1,3 +1,3 @@ .DataTable { - flex-grow: 1; + table-layout: auto; } diff --git a/tank-frontend/src/components/Row.css b/tank-frontend/src/components/Row.css index b26cc11..d0a8c9f 100644 --- a/tank-frontend/src/components/Row.css +++ b/tank-frontend/src/components/Row.css @@ -1,7 +1,6 @@ .Row { display: flex; flex-direction: row; - flex: auto; max-width: 100%; align-items: stretch; gap: 8px; diff --git a/tank-frontend/src/index.css b/tank-frontend/src/index.css index 5830fc5..dcd795f 100644 --- a/tank-frontend/src/index.css +++ b/tank-frontend/src/index.css @@ -2,12 +2,18 @@ box-sizing: border-box; } -html, body { - height: 100%; +@font-face { + font-family: 'CCCBFont'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url('/CCCBFont.ttf') format('ttf'), url('/CCCBFont.woff') format('woff'); } -body { - font-family: sans-serif; +html, body { + height: 100%; + + font-family: CCCBFont, monospace; margin: 0; display: flex; align-items: center; @@ -29,14 +35,7 @@ body { flex-grow: 1; } -@font-face { - font-family: 'CCCBFont'; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url('/public/CCCBFont.woff') format('woff'); -} - -* { - font-family: CCCBFont, monospace; +.GadgetRows { + justify-content: space-evenly; + margin-top: 24px; } diff --git a/tank-frontend/src/index.tsx b/tank-frontend/src/index.tsx index 1b45f4a..67c3cc7 100644 --- a/tank-frontend/src/index.tsx +++ b/tank-frontend/src/index.tsx @@ -38,7 +38,7 @@ function App() { {nameId.name === '' && } - {isLoggedIn && + {isLoggedIn &&