From 27744272ecbf999f1ab1be19a09aeb06f9eb4d5c Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Sat, 19 Apr 2025 14:19:16 -0700
Subject: the moekyun special update

---
 site/src/pages/Homepage.tsx | 40 ++++++++++++++++++++++++++++++----------
 1 file changed, 30 insertions(+), 10 deletions(-)

(limited to 'site/src/pages/Homepage.tsx')

diff --git a/site/src/pages/Homepage.tsx b/site/src/pages/Homepage.tsx
index 7183ebc..6cee80a 100644
--- a/site/src/pages/Homepage.tsx
+++ b/site/src/pages/Homepage.tsx
@@ -1,8 +1,10 @@
 import { useEffect, useState } from "react";
 import { NewsData, NewsFeed } from "../components/NewsFeed";
-import { useParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 import { getGameTitle } from "../utils.ts";
 import TitleBar from "../components/TitleBar";
+import { GameNotes } from "../components/GameNotes";
+
 
 interface ArcadeNewsAPIData {
     fetch_time: number;
@@ -11,6 +13,9 @@ interface ArcadeNewsAPIData {
 
 export default function Home() {
     const { gameId } = useParams<{ gameId?: string }>();
+    const [searchParams] = useSearchParams();
+    const isMoe = searchParams.has("moe");
+
     const [newsFeedData, setNewsFeedData] = useState<ArcadeNewsAPIData | null>(null);
     const [loading, setLoading] = useState<boolean>(true);
 
@@ -48,19 +53,34 @@ export default function Home() {
     return (
         <>
             <TitleBar />
-            <div className="bg-gray-950 min-h-screen py-6">
+            <div className={`${isMoe ? "bg-pink-100 text-pink-900 font-[Zen_Maru_Gothic]" : "bg-gray-950"} min-h-screen py-6`}>
                 <div className="max-w-[600px] mx-auto px-4">
-                    {gameId && (
-                        <h1 className="text-2xl font-bold text-center text-white mb-6">
-                            {getGameTitle(gameId)} News
-                        </h1>
+                    {gameId ? (
+                        <div className={`${isMoe ? "bg-pink-200 text-pink-900" : "bg-gray-800 text-white"} rounded-lg p-6 text-center shadow-lg`}>
+                            <h1 className="text-2xl font-bold mb-2">
+                                {getGameTitle(gameId)} News
+                            </h1>
+                            {GameNotes(isMoe)[gameId] && <div className="text-left">{GameNotes(isMoe)[gameId]}</div>}
+                        </div>
+                    ) : (
+                        <div className={`${isMoe ? "bg-pink-200 text-pink-900" : "bg-gray-800 text-white"} rounded-lg p-6 text-center shadow-lg`}>
+                            <h1 className="text-2xl font-bold">Welcome to 573-UPDATES</h1>
+                            <img src="/xiatian.webp" className="w-48 mx-auto mb-2 object-contain rounded-2xl" />
+                            <p>News and Information for various arcade games is aggregated here!</p>
+                            <p className="mt-2">
+                                Please see the{" "}
+                                <a href="https://github.com/pinapelz/573-updates" className="text-blue-500 hover:underline">
+                                    GitHub
+                                </a>{" "}
+                                for API information
+                            </p>
+                        </div>
                     )}
                     <NewsFeed newsItems={newsFeedData.news_posts} />
                 </div>
-                <footer className="mt-8 text-center text-gray-500 text-sm">
-                    <p>
-                        Last updated: {new Date(newsFeedData.fetch_time * 1000).toLocaleString()}
-                    </p>
+                <footer className={`mt-8 text-center text-sm ${isMoe ? "text-pink-800" : "text-gray-400"}`}>
+                    <p>Last updated: {new Date(newsFeedData.fetch_time * 1000).toLocaleString()}</p>
+                    <p><a href="https://moekyun.me/" className={`${isMoe ? "text-pink-600 hover:text-pink-400" : "hover:underline"}`}>a moekyun service</a></p>
                 </footer>
             </div>
         </>
-- 
cgit v1.2.3

