diff --git a/client/src/components/archive/ArchivedGame.tsx b/client/src/components/archive/ArchivedGame.tsx
index 692ff36..ab18ee4 100644
--- a/client/src/components/archive/ArchivedGame.tsx
+++ b/client/src/components/archive/ArchivedGame.tsx
@@ -183,13 +183,33 @@ export default function ArchivedGame({ game }: { game: Game }) {
function getPlayerHtml(side: "top" | "bottom") {
const blackHtml = (
);
const whiteHtml = (
);
diff --git a/client/src/components/game/GamePage.tsx b/client/src/components/game/GamePage.tsx
index fb3cb40..fca6f91 100644
--- a/client/src/components/game/GamePage.tsx
+++ b/client/src/components/game/GamePage.tsx
@@ -360,9 +360,17 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
function getPlayerHtml(side: "top" | "bottom") {
const blackHtml = (
-
+
{lobby.black?.name || "(no one)"}
-
+
black
{lobby.black?.connected === false && (
@@ -373,9 +381,17 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
);
const whiteHtml = (
-
+
{lobby.white?.name || "(no one)"}
-
+
white
{lobby.white?.connected === false && (
@@ -691,7 +707,22 @@ export default function GamePage({ initialLobby }: { initialLobby: Game }) {
{m.author.id && (
- {m.author.name}:{" "}
+
+ {m.author.name}
+
+ :{" "}
)}
{m.message}
diff --git a/client/src/components/home/PublicGames/PublicGames.tsx b/client/src/components/home/PublicGames/PublicGames.tsx
index 2984294..c85ea70 100644
--- a/client/src/components/home/PublicGames/PublicGames.tsx
+++ b/client/src/components/home/PublicGames/PublicGames.tsx
@@ -24,8 +24,18 @@ export default async function PublicGames() {
{games && games.length > 0 ? (
games.map((game) => (
- | {game.host?.name} |
-
+ |
+ {game.host?.name}
+ |
+
{(game.host?.id === game.white?.id ? game.black?.name : game.white?.name) || ""}
|
|