From 19fad1b969ac9b6c50b024a2c710e8f4fe792eb0 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Mon, 19 Aug 2024 05:21:58 +0900
Subject: feat(frontend): improve play/watch pages styling

---
 frontend/app/components/PlayerProfile.tsx | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 frontend/app/components/PlayerProfile.tsx

(limited to 'frontend/app/components/PlayerProfile.tsx')

diff --git a/frontend/app/components/PlayerProfile.tsx b/frontend/app/components/PlayerProfile.tsx
new file mode 100644
index 0000000..675d77b
--- /dev/null
+++ b/frontend/app/components/PlayerProfile.tsx
@@ -0,0 +1,27 @@
+import { PlayerInfo as FullPlayerInfo } from "../models/PlayerInfo";
+import UserIcon from "./UserIcon";
+
+type PlayerInfo = Pick<FullPlayerInfo, "displayName" | "iconPath">;
+
+type Props = {
+	playerInfo: PlayerInfo;
+	label: string;
+};
+
+export default function PlayerProfile({ playerInfo, label }: Props) {
+	return (
+		<div className="flex flex-col gap-6 my-auto">
+			<div className="flex flex-col gap-2">
+				<div className="text-4xl">{label}</div>
+				<div className="text-6xl">{playerInfo.displayName}</div>
+			</div>
+			{playerInfo.iconPath && (
+				<UserIcon
+					iconPath={playerInfo.iconPath}
+					displayName={playerInfo.displayName!}
+					className="w-48 h-48"
+				/>
+			)}
+		</div>
+	);
+}
-- 
cgit v1.2.3-70-g09d2