feat: highlight translation tips

src/components/site/TranslationInfo.tsx

@@ -21,14 +21,12 @@ export default async function TranslationInfo({
     locale !== page.metadata?.content?.translatedFrom
   ) {
     return (
-      <div
-        className={cn(
-          "text-zinc-400 mt-5 space-x-5 flex justify-center",
-          className,
-        )}
-      >
-        <span className="xlog-post-views inline-flex items-center">
-          <i className="i-mingcute-translate-2-line mr-[2px]" />
+      <div className={cn("mt-5 border rounded-xl p-4 space-y-2", className)}>
+        <div className="font-bold text-zinc-700 flex items-center">
+          <i className="i-mingcute-sparkles-line mr-2 text-lg" />
+          {t("AI Translation")}
+        </div>
+        <div className="text-zinc-500 leading-loose text-sm">
           <span>
             {t.rich("Translated by", {
               from: () => (
@@ -38,7 +36,7 @@ export default async function TranslationInfo({
             })}
           </span>
           <ViewOriginal page={page} />
-        </span>
+        </div>
       </div>
     )
   }

src/components/site/ViewOriginal.tsx

@@ -9,7 +9,7 @@ export default function ViewOriginal({ page }: { page: ExpandedNote }) {
 
   return (
     <span
-      className="ml-1 underline cursor-pointer"
+      className="ml-2 cursor-pointer text-accent font-bold"
       onClick={() => {
         // remove the locale search param
         const url = new URL(window.location.href)

src/messages/en.json

@@ -109,8 +109,9 @@
   "shots add": "Visitors can view the shots you have posted at <link1>/shorts</link1>, you can <link2>add it to navigation menu</link2> so your visitors can find it.",
   "pages add": "Visitors can only access your page through its link, you can <link>add it to navigation menu</link> so your visitors can find it.",
   "portfolios add": "Visitors can view the portfolios you have posted at homepage and <link1>/portfolios</link1>, you can <link2>add it to navigation menu</link2> so your visitors can find it.",
-  "Translated by": "This article has been translated from <from></from> into <to></to> through AI.",
+  "Translated by": "This post is translated from <from></from> into <to></to> through AI.",
   "View Original": "View Original",
+  "AI Translation": "AI Translation",
   "en": "English",
   "ja": "Japanese",
   "zh": "Chinese",

src/messages/ja.json

@@ -214,6 +214,7 @@
   "Open in App": "アプリで開く",
   "powered by": "<span>このサイトは　</span><name></name><span> によって作動します</span>",
   "Translated by": "この記事はAIを通じて<from></from>から<to></to>に翻訳されました。",
+  "AI Translation": "AI 翻訳",
   "View Original": "原文を表示",
   "en": "英語",
   "ja": "日本語",

src/messages/zh-TW.json

@@ -398,6 +398,7 @@
   "Open in App": "在 App 中開啟",
   "Search Posts": "搜尋文章",
   "Translated by": "這篇文章透過AI由<from></from>翻譯成<to></to>。",
+  "AI Translation": "AI 翻譯",
   "View Original": "查看原文",
   "en": "英文",
   "ja": "日文",

src/messages/zh.json

@@ -427,6 +427,7 @@
   "URL (Optional)": "网址（可选）",
   "More shorts": "更多图文",
   "Translated by": "这篇文章通过AI由<from></from>翻译成<to></to>。",
+  "AI Translation": "AI 翻译",
   "View Original": "查看原文",
   "en": "英语",
   "ja": "日语",