From 3ec0863202471dfcda14df275c312d29120e0b76 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=AE=80=E5=BE=8B=E7=BA=AF?= <i@jyunko.cn>
Date: Thu, 12 Sep 2024 13:46:40 +0800
Subject: [PATCH] chore(index): supports themed images

---
 src/pages/index.tsx | 20 +++++++-------------
 1 file changed, 7 insertions(+), 13 deletions(-)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 41b20eb51..6c6bc2ca9 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,5 +1,6 @@
 import Link from "@docusaurus/Link";
-import { useColorMode } from "@docusaurus/theme-common";
+// import useBaseUrl from '@docusaurus/useBaseUrl';
+import ThemedImage from '@theme/ThemedImage';
 import Translate from "@docusaurus/Translate";
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
 import Layout from "@theme/Layout";
@@ -100,8 +101,6 @@ function HomepageHeader() {
 
 
 const HomeBaseContent = () => {
-  const { colorMode } = useColorMode();
-
   const mainContent = React.useMemo(() => {
     return (
       <main className="mb-20 my-10 max-w-7xl mx-auto w-full px-4 sm:px-6 lg:px-8max-w-6xl">
@@ -112,21 +111,16 @@ const HomeBaseContent = () => {
     );
   }, []);
 
-  if (colorMode === "dark") {
-    return (
-      <>
-        <StarrySky />
-        {mainContent}
-      </>
-    );
-  } else {
     return (
       <>
-        <AuroraBackground />
+        <ThemedImage sources={{
+            light: <StarrySky />,
+            dark: <AuroraBackground />,
+          }}
+        />
         {mainContent}
       </>
     );
-  }
 };