specification optimization code structure new

src/components/HomepageFeatures/index.tsx → src/components/HomepageFeatures.tsx

@@ -1,6 +1,6 @@
 import clsx from "clsx";
 import Heading from "@theme/Heading";
-import styles from "./styles.module.css";
+import styles from "../css/styles.module.css";
 import Translate, { translate } from "@docusaurus/Translate";
 import React from "react";
 

src/components/HomepageFoot.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+
+export default function HomepageFoot() {
+  return (
+    <div
+      style={{
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        width: "100%",
+        height: "100px",
+      }}
+    >
+      <img src="..//cat.svg" style={{ width: "100px", height: "100px" }} />
+    </div>
+  );
+}

src/components/HomePageLanguageCard/index.tsx → src/components/HomepageLanguageCard.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { Card } from "antd";
 
-export const HomePageLanguageCard = () => (
+export const HomepageLanguageCard = () => (
   <div>
     <div style={{ textAlign: "center" }}>
       <h2>Quick Start!</h2>

src/pages/index.tsx

@@ -9,8 +9,9 @@ import styles from "./index.module.css";
 import Translate, { translate } from "@docusaurus/Translate";
 import AOS from "aos";
 import "aos/dist/aos.css";
-import { HomePageLanguageCard } from "../components/HomePageLanguageCard";
+import { HomepageLanguageCard } from "../components/HomepageLanguageCard";
 import { HomepageCodeDisplay } from "../components/HomepageCode";
+import HomepageFoot from "../components/HomepageFoot";
 
 function HomepageHeader() {
   const { siteConfig } = useDocusaurusContext();
@@ -103,15 +104,20 @@ export default function Home(): JSX.Element {
         </main>
         <main>
           <div data-aos="fade-up" data-aos-delay="10">
-            <HomePageLanguageCard />
+            <HomepageLanguageCard />
           </div>
         </main>
         <main>
           <div data-aos="fade-up" data-aos-delay="10">
             <HomepageCodeDisplay />
           </div>
         </main>
+        <main>
+          <div data-aos="fade-up" data-aos-delay="10">
+            <HomepageFoot />
+          </div>
+        </main>
       </Layout>
     </>
-  );  
+  );
 }