feat: i18n 双语系统 + 150 篇文档翻译 + Hero UX 迭代

app/api/docs/history/route.ts

@@ -47,6 +47,11 @@ function normalizeDocsPath(raw: string): string | null {
   if (normalized.startsWith("docs/")) {
     normalized = `app/${normalized}`;
   }
+  // fumadocs 的 page.file.path 返回"相对 app/docs/"路径（如 ai/xxx/index.mdx）
+  // 而不是仓库根。这里补上前缀，和 page.tsx 传参保持兼容。
+  if (!normalized.startsWith("app/")) {
+    normalized = `app/docs/${normalized}`;
+  }
   // 必须落在 app/docs/ 下才放行
   if (!normalized.startsWith("app/docs/")) {
     return null;

app/components/BrandMark.tsx

@@ -12,6 +12,7 @@
  * @param {boolean} priority - 是否优先加载
  */
 import Image from "next/image";
+import Link from "next/link";
 import { cn } from "@/lib/utils";
 
 export const BRAND_NAME = "Involution Hell";
@@ -38,7 +39,7 @@ export function BrandMark({
   const width = Math.round(imageSize * BRAND_LOGO_ASPECT_RATIO);
 
   return (
-    <div className={cn("flex items-center gap-2", className)}>
+    <Link href="/" className={cn("flex items-center gap-2", className)}>
       <div className="relative">
         <Image
           src={BRAND_LOGO_LIGHT_SRC}
@@ -65,6 +66,6 @@ export function BrandMark({
       >
         {BRAND_NAME}
       </span>
-    </div>
+    </Link>
   );
 }

app/components/DispatchNetwork.tsx

@@ -0,0 +1,85 @@
+import Link from "next/link";
+import { Github as GithubIcon } from "./icons/Github";
+import { MessageCircle, BookMarked, ArrowRight } from "lucide-react";
+
+/**
+ * DispatchNetwork — 主页 Top Rank 之后的极简网络入口横条
+ * 替代原先 Features（口号四格）+ Community（链接三卡）两个 section
+ * 设计意图：报纸末版的"发行网络"小栏，48px 高横条，不重复 Footer
+ */
+export function DispatchNetwork() {
+  return (
+    <section
+      id="community"
+      className="border-t-4 border-[var(--foreground)] bg-[var(--background)]"
+    >
+      <div className="container mx-auto px-6">
+        <div className="flex items-center justify-between gap-4 py-3 font-mono text-[11px] uppercase tracking-[0.25em] text-[var(--foreground)] md:text-xs">
+          {/* 左：栏目标签 */}
+          <span className="font-bold whitespace-nowrap">
+            Dispatch Network
+            <span className="mx-2 hidden text-neutral-400 md:inline">·</span>
+            <span className="hidden font-normal text-neutral-500 md:inline">
+              Sec. Net-01
+            </span>
+          </span>
+
+          {/* 中：三个外链 */}
+          <nav className="flex items-center gap-3 md:gap-6">
+            <Link
+              href="https://github.com/involutionhell"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline-flex items-center gap-1.5 hover:text-[#CC0000] transition-colors"
+              data-umami-event="social_click"
+              data-umami-event-platform="github"
+              data-umami-event-location="dispatch_network"
+            >
+              <GithubIcon className="h-3.5 w-3.5" />
+              <span>GitHub</span>
+            </Link>
+            <span className="text-neutral-400">·</span>
+            <Link
+              href="https://discord.com/invite/6CGP73ZWbD"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline-flex items-center gap-1.5 hover:text-[#CC0000] transition-colors"
+              data-umami-event="social_click"
+              data-umami-event-platform="discord"
+              data-umami-event-location="dispatch_network"
+            >
+              <MessageCircle className="h-3.5 w-3.5" />
+              <span>Discord</span>
+            </Link>
+            <span className="text-neutral-400">·</span>
+            <Link
+              href="https://www.zotero.org/groups/6053219/involution_hell"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline-flex items-center gap-1.5 hover:text-[#CC0000] transition-colors"
+              data-umami-event="social_click"
+              data-umami-event-platform="zotero"
+              data-umami-event-location="dispatch_network"
+            >
+              <BookMarked className="h-3.5 w-3.5" />
+              <span>Zotero</span>
+            </Link>
+          </nav>
+
+          {/* 右：加入 CTA */}
+          <Link
+            href="https://discord.com/invite/6CGP73ZWbD"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="inline-flex items-center gap-1 font-bold whitespace-nowrap hover:text-[#CC0000] transition-colors"
+            data-umami-event="cta_click"
+            data-umami-event-label="join_dispatch"
+          >
+            <span className="hidden sm:inline">Join</span>
+            <ArrowRight className="h-3.5 w-3.5" />
+          </Link>
+        </div>
+      </div>
+    </section>
+  );
+}

app/components/DocHistoryPanel.tsx

@@ -50,10 +50,10 @@ function relativeTime(dateStr: string): string {
 function SkeletonRow() {
   return (
     <div className="flex items-center gap-3 py-2.5 animate-pulse">
-      <div className="w-6 h-6 rounded-full bg-neutral-200 dark:bg-neutral-700 shrink-0" />
+      <div className="w-6 h-6 bg-neutral-200 dark:bg-neutral-700 shrink-0" />
       <div className="flex-1 flex flex-col gap-1">
-        <div className="h-3 w-2/3 rounded bg-neutral-200 dark:bg-neutral-700" />
-        <div className="h-2.5 w-1/3 rounded bg-neutral-100 dark:bg-neutral-800" />
+        <div className="h-3 w-2/3 bg-neutral-200 dark:bg-neutral-700" />
+        <div className="h-2.5 w-1/3 bg-neutral-100 dark:bg-neutral-800" />
       </div>
     </div>
   );
@@ -129,15 +129,15 @@ export function DocHistoryPanel({ path }: DocHistoryPanelProps) {
                 href={item.htmlUrl}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="flex items-start gap-3 py-2.5 group hover:bg-neutral-50 dark:hover:bg-neutral-900 rounded transition-colors px-1 -mx-1"
+                className="flex items-start gap-3 py-2.5 group hover:bg-neutral-50 dark:hover:bg-neutral-900 transition-colors px-1 -mx-1"
               >
                 {/* 头像 */}
                 <Image
                   src={item.avatarUrl || FALLBACK_AVATAR}
                   alt={item.authorLogin}
                   width={24}
                   height={24}
-                  className="rounded-full mt-0.5 shrink-0"
+                  className="mt-0.5 shrink-0"
                   unoptimized
                 />
 

app/components/DocShareButton.tsx

@@ -38,7 +38,7 @@ export function DocShareButton() {
     <button
       type="button"
       onClick={handleCopy}
-      className="inline-flex items-center gap-2 rounded-md px-4 h-11 text-base font-medium hover:bg-muted/80 hover:text-foreground"
+      className="inline-flex items-center gap-2 px-3 py-1.5 font-mono text-xs uppercase tracking-widest border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-colors"
       aria-label="复制页面链接"
     >
       <svg

app/components/EditOnGithub.tsx

@@ -4,13 +4,13 @@ export function EditOnGithub({ href }: { href: string }) {
   return (
     <Link
       href={href}
-      className="inline-flex items-center gap-2 rounded-md px-4 h-11 text-base font-medium hover:bg-muted/80 hover:text-foreground no-underline"
+      className="inline-flex items-center gap-2 px-3 py-1.5 font-mono text-xs uppercase tracking-widest border border-[var(--foreground)] hover:bg-[var(--foreground)] hover:text-[var(--background)] transition-colors no-underline"
       data-umami-event="docs_edit_click"
       data-umami-event-page={href}
     >
       <svg
         aria-hidden="true"
-        className="h-8 w-8"
+        className="h-4 w-4"
         viewBox="0 0 24 24"
         fill="none"
         stroke="currentColor"

app/components/Header.tsx

@@ -1,3 +1,4 @@
+import Link from "next/link";
 import { ThemeToggle } from "./ThemeToggle";
 import { Button } from "@/components/ui/button";
 import { MessageCircle } from "lucide-react";
@@ -30,33 +31,42 @@ export function Header() {
 
         <div className="flex items-center justify-between h-10">
           <nav className="hidden md:flex items-center gap-8 font-sans text-xs font-bold uppercase tracking-widest text-[var(--foreground)]">
-            <a
-              href="#features"
+            <Link
+              href="/"
+              className="hover:text-[#CC0000] transition-colors"
+              data-umami-event="navigation_click"
+              data-umami-event-region="header"
+              data-umami-event-label="home"
+            >
+              首页
+            </Link>
+            <Link
+              href="/#features"
               className="hover:text-[#CC0000] transition-colors"
               data-umami-event="navigation_click"
               data-umami-event-region="header"
               data-umami-event-label="features"
             >
               特点
-            </a>
-            <a
-              href="#community"
+            </Link>
+            <Link
+              href="/#community"
               className="hover:text-[#CC0000] transition-colors"
               data-umami-event="navigation_click"
               data-umami-event-region="header"
               data-umami-event-label="community"
             >
               社区
-            </a>
-            <a
-              href="#contact"
+            </Link>
+            <Link
+              href="/#contact"
               className="hover:text-[#CC0000] transition-colors"
               data-umami-event="navigation_click"
               data-umami-event-region="header"
               data-umami-event-label="contact"
             >
               联系我们
-            </a>
+            </Link>
           </nav>
 
           <div className="flex items-center gap-2">

app/components/Hero.tsx

@@ -5,6 +5,7 @@ import Image from "next/image";
 import { ActivityTicker } from "@/app/components/ActivityTicker";
 import { cn } from "@/lib/utils";
 import { AnimatedBar } from "@/app/components/rank/AnimatedBar";
+import { HotDocsPreview } from "@/app/components/HotDocsPreview";
 import leaderboardData from "@/generated/site-leaderboard.json";
 import { MAINTAINERS } from "@/lib/admins";
 
@@ -169,49 +170,52 @@ export function Hero() {
             </Link>
           </div>
 
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
-            {(() => {
-              const rawData = leaderboardData as {
-                id: string;
-                name: string;
-                points: number;
-                avatarUrl: string;
-              }[];
-              const filteredData = rawData.filter(
-                (user) => !MAINTAINERS.includes(user.name),
-              );
-              const top3 = filteredData.slice(0, 3);
-              const maxPoints = top3.length > 0 ? top3[0].points : 100;
+          <div className="grid grid-cols-1 lg:grid-cols-12 gap-6">
+            <div className="lg:col-span-8 grid grid-cols-1 md:grid-cols-3 gap-6">
+              {(() => {
+                const rawData = leaderboardData as {
+                  id: string;
+                  name: string;
+                  points: number;
+                  avatarUrl: string;
+                }[];
+                const filteredData = rawData.filter(
+                  (user) => !MAINTAINERS.includes(user.name),
+                );
+                const top3 = filteredData.slice(0, 3);
+                const maxPoints = top3.length > 0 ? top3[0].points : 100;
 
-              return top3.map((user, idx) => (
-                <div
-                  key={user.id}
-                  className="border border-[var(--foreground)] p-6 bg-[var(--background)] relative hard-shadow-hover transition-all group"
-                >
-                  <div className="absolute top-0 right-0 w-12 h-12 bg-[var(--foreground)] text-[var(--background)] flex items-center justify-center font-mono font-bold text-xl border-b border-l border-[var(--foreground)] z-10">
-                    #{idx + 1}
-                  </div>
-                  <div className="w-16 h-16 bg-neutral-100 dark:bg-neutral-800 border border-[var(--foreground)] mb-4 transition-transform group-hover:scale-110 overflow-hidden">
-                    <Image
-                      src={user.avatarUrl}
-                      alt={user.name}
-                      width={64}
-                      height={64}
-                      className="w-full h-full object-cover transition-all duration-300"
-                    />
-                  </div>
-                  <div className="font-serif text-2xl font-bold uppercase text-[var(--foreground)] mb-1 truncate">
-                    {user.name}
-                  </div>
-                  <div className="font-mono text-xs text-neutral-500 uppercase tracking-widest mb-4">
-                    {user.points.toLocaleString()} PTS
+                return top3.map((user, idx) => (
+                  <div
+                    key={user.id}
+                    className="border border-[var(--foreground)] p-6 bg-[var(--background)] relative hard-shadow-hover transition-all group"
+                  >
+                    <div className="absolute top-0 right-0 w-12 h-12 bg-[var(--foreground)] text-[var(--background)] flex items-center justify-center font-mono font-bold text-xl border-b border-l border-[var(--foreground)] z-10">
+                      #{idx + 1}
+                    </div>
+                    <div className="w-16 h-16 bg-neutral-100 dark:bg-neutral-800 border border-[var(--foreground)] mb-4 transition-transform group-hover:scale-110 overflow-hidden">
+                      <Image
+                        src={user.avatarUrl}
+                        alt={user.name}
+                        width={64}
+                        height={64}
+                        className="w-full h-full object-cover transition-all duration-300"
+                      />
+                    </div>
+                    <div className="font-serif text-2xl font-bold uppercase text-[var(--foreground)] mb-1 truncate">
+                      {user.name}
+                    </div>
+                    <div className="font-mono text-xs text-neutral-500 uppercase tracking-widest mb-4">
+                      {user.points.toLocaleString()} PTS
+                    </div>
+                    <AnimatedBar value={user.points} max={maxPoints} />
                   </div>
-
-                  {/* Visual bar chart representing points using motion */}
-                  <AnimatedBar value={user.points} max={maxPoints} />
-                </div>
-              ));
-            })()}
+                ));
+              })()}
+            </div>
+            <div className="lg:col-span-4">
+              <HotDocsPreview />
+            </div>
           </div>
         </div>
       </div>