[+] i18n for home page

AquaNet/src/libs/i18n/en_ref.ts

@@ -68,6 +68,21 @@ export const EN_REF_GENERAL = {
   'action.confirm': 'Confirm',
 }
 
-export const EN_REF = { ...EN_REF_USER, ...EN_REF_Welcome, ...EN_REF_GENERAL, ...EN_REF_LEADERBOARD }
+export const EN_REF_HOME = {
+  'home.nav.portal': 'Portal',
+  'home.nav.link-card': 'Link Card',
+  'home.nav.game-setup': 'Game Setup',
+  'home.manage-cards': 'Manage Cards',
+  'home.manage-cards-description': 'Link, unlink, and manage your cards.',
+  'home.link-card': 'Link Card',
+  'home.link-cards-description': 'Link your Amusement IC / Aime card to play games.',
+  'home.join-discord': 'Join Discord',
+  'home.join-discord-description': 'Join our Discord server to chat with other players and get help.',
+  'home.setup': 'Setup Connection',
+  'home.setup-description': 'If you own a cab or arcade setup, begin setting up the connection.',
+}
+
+export const EN_REF = { ...EN_REF_USER, ...EN_REF_Welcome, ...EN_REF_GENERAL,
+  ...EN_REF_LEADERBOARD, ...EN_REF_HOME }
 
 export type LocalizedMessages = typeof EN_REF

AquaNet/src/libs/i18n/zh.ts

@@ -1,4 +1,4 @@
-import { EN_REF_GENERAL, EN_REF_LEADERBOARD, EN_REF_USER, type EN_REF_Welcome } from "./en_ref";
+import { EN_REF_GENERAL, EN_REF_HOME, EN_REF_LEADERBOARD, EN_REF_USER, type EN_REF_Welcome } from "./en_ref";
 
 const zhUser: typeof EN_REF_USER = {
   'UserHome.ServerRank': '服务器排名',
@@ -70,4 +70,19 @@ const zhGeneral: typeof EN_REF_GENERAL = {
   "action.confirm": "确认",
 }
 
-export const ZH = { ...zhUser, ...zhWelcome, ...zhGeneral, ...zhLeaderboard }
+const zhHome: typeof EN_REF_HOME = {
+  'home.nav.portal': "主页",
+  'home.nav.link-card': "绑卡",
+  'home.nav.game-setup': "连接设置",
+  'home.manage-cards': '管理游戏卡',
+  'home.manage-cards-description': '绑定、解绑、管理游戏数据卡',
+  'home.link-card': '绑定游戏卡',
+  'home.link-cards-description':'绑定游戏数据卡 (Amusement IC 或 Aime 卡) 后才可以访问游戏存档哦',
+  'home.join-discord': '加入 Discord',
+  'home.join-discord-description': '加入我们的 Discord 群，与其他玩家聊天、获取帮助',
+  'home.setup': '连接私服',
+  'home.setup-description': '如果您有街机框体或者手台，点击这里设置服务器的连接',
+}
+
+export const ZH = { ...zhUser, ...zhWelcome, ...zhGeneral,
+  ...zhLeaderboard, ...zhHome }

AquaNet/src/pages/Home.svelte

@@ -7,6 +7,7 @@
   import type { AquaNetUser } from "../libs/generalTypes";
   import StatusOverlays from "../components/StatusOverlays.svelte";
   import ActionCard from "../components/ActionCard.svelte";
+  import { t } from "../libs/i18n";
 
   USER.ensureLoggedIn();
 
@@ -14,7 +15,7 @@
   let error = ""
 
   let tab = 0;
-  let tabs = ["Portal", "Link Card", "Game Setup"];
+  let tabs = [t('home.nav.portal'), t('home.nav.link-card'), t('home.nav.game-setup')]
 
   USER.me().then((m) => me = m).catch(e => error = e.message)
 </script>
@@ -36,22 +37,22 @@
     <div out:fade={FADE_OUT} in:fade={FADE_IN} class="action-cards">
       <ActionCard color="255, 192, 203" icon="solar:card-bold-duotone" on:click={() => tab = 1}>
         {#if me && me.cards.length > 1}
-          <h3>Manage Cards</h3>
-          <span>Link, unlink, and manage your cards</span>
+          <h3>{t('home.manage-cards')}</h3>
+          <span>{t('home.manage-cards-description')}</span>
         {:else if me}
-          <h3>Link card</h3>
-          <span>Link your Amusement IC / Aime card to play games.</span>
+          <h3>{t('home.link-card')}</h3>
+          <span>{t('home.link-cards-description')}</span>
         {/if}
       </ActionCard>
 
       <ActionCard color="82, 93, 233" icon="ic:baseline-discord" on:click={() => window.location.href = DISCORD_INVITE}>
-        <h3>Join Discord</h3>
-        <span>Join our Discord server to chat with other players and get help.</span>
+        <h3>{t('home.join-discord')}</h3>
+        <span>{t('home.join-discord-description')}</span>
       </ActionCard>
 
       <ActionCard on:click={() => tab = 2} icon="uil:link-alt">
-        <h3>Setup Connection</h3>
-        <span>If you own a cab or arcade setup, begin setting up the connection.</span>
+        <h3>{t('home.setup')}</h3>
+        <span>{t('home.setup-description')}</span>
       </ActionCard>
     </div>
   {:else if tab === 1}