From 1be6007f81488d0f186b44994fe8ee23385059a1 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Thu, 1 Aug 2024 02:02:04 +0900
Subject: feat(frontend): add minimal styling to game pages

---
 .../GolfWatchApps/GolfWatchAppConnecting.tsx           | 10 +++++++++-
 .../components/GolfWatchApps/GolfWatchAppFinished.tsx  |  8 +++++++-
 .../components/GolfWatchApps/GolfWatchAppGaming.tsx    | 16 +++++++++-------
 .../components/GolfWatchApps/GolfWatchAppStarting.tsx  | 18 +++++++++++++-----
 4 files changed, 38 insertions(+), 14 deletions(-)

(limited to 'frontend/app/components/GolfWatchApps')

diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppConnecting.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppConnecting.tsx
index 07e359f..b91339a 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppConnecting.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppConnecting.tsx
@@ -1,3 +1,11 @@
 export default function GolfWatchAppConnecting() {
-  return <div>Connecting...</div>;
+  return (
+    <div className="min-h-screen bg-gray-100 flex items-center justify-center">
+      <div className="text-center">
+        <h1 className="text-4xl font-bold text-black-600 mb-4">
+          Connecting...
+        </h1>
+      </div>
+    </div>
+  );
 }
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppFinished.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppFinished.tsx
index 330d1a6..866e18a 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppFinished.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppFinished.tsx
@@ -1,3 +1,9 @@
 export default function GolfWatchAppFinished() {
-  return <div>Finished</div>;
+  return (
+    <div className="min-h-screen bg-gray-100 flex items-center justify-center">
+      <div className="text-center">
+        <h1 className="text-4xl font-bold text-black-600 mb-4">Finished</h1>
+      </div>
+    </div>
+  );
 }
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
index d58a04f..10d68fe 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppGaming.tsx
@@ -1,16 +1,18 @@
+type Props = {
+  problem: string;
+  codeA: string;
+  scoreA: number | null;
+  codeB: string;
+  scoreB: number | null;
+};
+
 export default function GolfWatchAppGaming({
   problem,
   codeA,
   scoreA,
   codeB,
   scoreB,
-}: {
-  problem: string;
-  codeA: string;
-  scoreA: number | null;
-  codeB: string;
-  scoreB: number | null;
-}) {
+}: Props) {
   return (
     <div style={{ display: "flex", flexDirection: "column" }}>
       <div style={{ display: "flex", flex: 1, justifyContent: "center" }}>
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
index 643af93..3c9919c 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppStarting.tsx
@@ -1,7 +1,15 @@
-export default function GolfWatchAppStarting({
-  timeLeft,
-}: {
+type Props = {
   timeLeft: number;
-}) {
-  return <div>Starting... ({timeLeft} s)</div>;
+};
+
+export default function GolfWatchAppStarting({ timeLeft }: Props) {
+  return (
+    <div className="min-h-screen bg-gray-100 flex items-center justify-center">
+      <div className="text-center">
+        <h1 className="text-4xl font-bold text-black-600 mb-4">
+          Starting... ({timeLeft} s)
+        </h1>
+      </div>
+    </div>
+  );
 }
-- 
cgit v1.2.3-70-g09d2