feat: i18n, page title

(cherry picked from commit 0d9fc72bee009c591400055725680a6a0f5a9c83)

src/components/widget/DisplaySetting.astro

@@ -1,5 +1,7 @@
 ---
 import {getConfig} from "../../utils/config-utils";
+import {i18n} from "../../i18n/translation";
+import I18nKey from "../../i18n/i18nKey";
 const hueSet: number[] = [0, 30, 60, 180, 250, 270, 300, 330, 345];
 
 const enableBanner = getConfig().banner.enable;
@@ -13,7 +15,7 @@ const enableBanner = getConfig().banner.enable;
             before:w-1 before:h-4 before:rounded-md before:bg-[var(--primary)]
             before:absolute before:left-[-12px] before:top-[5.5px]"
         >
-            Primary Color
+            {i18n(I18nKey.primaryColor)}
         </div>
         <div id="hueValue" class="transition bg-[var(--btn-regular-bg)] w-10 h-7 rounded-md flex justify-center font-bold transition text-sm items-center text-[var(--btn-content)]">
             {0}

src/components/widget/RecentPost.astro

@@ -2,6 +2,8 @@
 import WidgetLayout from "./WidgetLayout.astro";
 import ButtonLink from "../control/ButtonLink.astro";
 import {getPostUrlBySlug, getSortedPosts} from "../../utils/content-utils";
+import {i18n} from "../../i18n/translation";
+import I18nKey from "../../i18n/i18nKey";
 
 let posts = await getSortedPosts()
 
@@ -11,7 +13,7 @@ posts = posts.slice(0, LIMIT)
 
 // console.log(posts)
 ---
-<WidgetLayout name="Recent Posts">
+<WidgetLayout name={i18n(I18nKey.recentPosts)}>
     {posts.map(post =>
         <ButtonLink url={getPostUrlBySlug(post.slug)}>{post.data.title}</ButtonLink>
     )}

src/components/widget/Tag.astro

@@ -3,11 +3,13 @@
 import WidgetLayout from "./WidgetLayout.astro";
 import ButtonTag from "../control/ButtonTag.astro";
 import {getTagList} from "../../utils/content-utils";
+import {i18n} from "../../i18n/translation";
+import I18nKey from "../../i18n/i18nKey";
 
 const tags = await getTagList();
 
 ---
-<WidgetLayout name="Tags">
+<WidgetLayout name={i18n(I18nKey.tags)}>
     <div class="flex gap-2 flex-wrap">
         {tags.map(t => (
             <ButtonTag href={`/archive/tag/${t.name}`}>