home button

src/components/Header.astro

@@ -15,6 +15,12 @@ const t = useTranslations(lang);
   <div class="w-1/8">
     {/* Typical desktop menu */}
     <div class="relative flex-row hidden md:flex">
+      <HeaderButton text={t("header.home")} route={`/${lang}/`}>
+        <Icon
+          name="ph:house-bold"
+          class="h-6 w-6 text-text-color transition duration-500 group-hover:text-text-hover-color md:h-6 md:w-6"
+        />
+      </HeaderButton>
       <HeaderButton text={t("header.games")} route={`/${lang}/games/`}>
         <Icon
           name="ph:cube"

src/components/MobileNavigation.astro

@@ -9,7 +9,13 @@ const t = useTranslations(lang);
 <div
   class="h-full mt-16 flex w-full flex-col justify-evenly md:flex-row bg-navbar-color m-auto"
   id="mobileNavMenu"
->
+> 
+  <HeaderButton text={t("header.home")} route={`/${lang}/`}>
+    <Icon
+      name="ph:house-bold"
+      class="h-6 w-6 text-text-color transition duration-500 group-hover:text-text-hover-color md:h-6 md:w-6"
+    />
+  </HeaderButton>
   <HeaderButton text={t("header.games")} route={`/${lang}/games/`}>
     <Icon
       name="ph:cube"

src/i18n/en_US.json

@@ -1,4 +1,5 @@
 { 
+  "header.home": "Home",
   "header.games": "Games",
   "header.settings": "Settings",
   "header.morelinks": "Want more links?"

src/i18n/jp.json

@@ -1,4 +1,5 @@
 { 
+  "header.home": "homee",
   "header.games": "ゲーム",
   "header.settings": "設定",
   "header.morelinks": "リンク一覧"

src/pages/[lang]/index.astro

@@ -1,8 +1,6 @@
 ---
 import { STATIC_PATHS } from "../../i18n/utils";
 import Layout from "../../layouts/Layout.astro";
-import Card from "../../components/Card.astro";
-import MobileNavigation from "../../components/MobileNavigation.astro";
 
 export function getStaticPaths() {
   return STATIC_PATHS;