feat(website): hero i18n IP detection, layout stabilization, and copy redesign

src/components/LinuxDistroMatrix.astro

@@ -345,6 +345,18 @@ const families = [
   { id: "source", label: "Void & Gentoo" },
   { id: "universal", label: "Universal (AppImage / Flatpak / Snap)" },
 ];
+
+const filterI18nMap: Record<string, string> = {
+  all: "filterAll",
+  arch: "filterArch",
+  debian: "filterDebian",
+  fedora: "filterFedora",
+  suse: "filterSuse",
+  alpine: "filterAlpine",
+  nix: "filterNix",
+  source: "filterSource",
+  universal: "filterUniversal",
+};
 ---
 
 <section
@@ -355,20 +367,30 @@ const families = [
   <div class="section-header flex flex-col md:flex-row md:items-end justify-between gap-4">
     <div class="space-y-2">
       <div class="flex items-center gap-2 font-mono-tech">
-        <span class="px-2 py-0.5 rounded font-bold bg-[var(--accent)] text-[#0b0914] text-[10px]">
+        <span
+          class="px-2 py-0.5 rounded font-bold bg-[var(--accent)] text-[#0b0914] text-[10px]"
+          data-i18n="linuxEcosystemBadge"
+        >
           LINUX ECOSYSTEM
         </span>
-        <span class="text-xs text-[var(--accent-yellow)] font-bold">
-          ★ 全主流 Linux 发行版与包管理器支持
+        <span
+          class="text-xs text-[var(--accent-yellow)] font-bold"
+          data-i18n="linuxEcosystemSubtitle"
+        >
+          ★ Universal Linux Distribution &amp; Package Support
         </span>
       </div>
       <h2
         id="linux-distros-title"
         class="font-cyber-display font-bold text-2xl sm:text-3xl text-[var(--fg-primary)]"
+        data-i18n="linuxMatrixTitle"
       >
         Universal Linux Distribution Matrix
       </h2>
-      <p class="text-xs sm:text-sm text-[var(--fg-secondary)] max-w-2xl leading-relaxed">
+      <p
+        class="text-xs sm:text-sm text-[var(--fg-secondary)] max-w-2xl leading-relaxed"
+        data-i18n="linuxMatrixDesc"
+      >
         From bleeding-edge rolling releases (Arch, CachyOS) to stable enterprise
         deployments (Debian, Ubuntu, Fedora, openSUSE), lightweight musl systems
         (Alpine), and reproducible environments (NixOS)—Bitty runs natively
@@ -380,17 +402,29 @@ const families = [
     <div class="shrink-0 flex items-center gap-3 font-mono-tech text-xs bg-[var(--bg-elevated)] p-3 rounded-xl border-2 border-[var(--ink-border)] shadow-[3px_3px_0px_var(--toon-shadow)]">
       <div class="text-center px-2">
         <div class="font-bold text-[var(--accent)] text-lg">100%</div>
-        <div class="text-[10px] text-[var(--fg-muted)]">NATIVE RUST</div>
+        <div
+          class="text-[10px] text-[var(--fg-muted)]"
+          data-i18n="statNativeRust"
+        >
+          NATIVE RUST
+        </div>
       </div>
       <div class="h-6 w-px bg-[var(--card-border)]"></div>
       <div class="text-center px-2">
         <div class="font-bold text-[var(--accent-mint)] text-lg">12</div>
-        <div class="text-[10px] text-[var(--fg-muted)]">FORMATS &amp; PKGS</div>
+        <div
+          class="text-[10px] text-[var(--fg-muted)]"
+          data-i18n="statPackages"
+        >
+          FORMATS &amp; PKGS
+        </div>
       </div>
       <div class="h-6 w-px bg-[var(--card-border)]"></div>
       <div class="text-center px-2">
         <div class="font-bold text-[var(--accent-yellow)] text-lg">0B</div>
-        <div class="text-[10px] text-[var(--fg-muted)]">IDLE MEMORY</div>
+        <div class="text-[10px] text-[var(--fg-muted)]" data-i18n="statIdleMem">
+          IDLE MEMORY
+        </div>
       </div>
     </div>
   </div>
@@ -415,7 +449,7 @@ const families = [
             : "bg-[var(--bg-surface)] text-[var(--fg-secondary)] border-[var(--card-border)] hover:border-[var(--ink-border)] hover:text-[var(--fg-primary)]"
         }`}
       >
-        {f.label}
+        <span data-i18n={filterI18nMap[f.id]}>{f.label}</span>
       </button>
     ))}
   </div>

src/components/SiteHeader.astro

@@ -176,19 +176,37 @@ const GITHUB_REPO_URL = "https://github.com/bitty-terminal/bitty";
     const langBtn = document.getElementById("lang-toggle-btn");
     const langLabel = document.getElementById("lang-current-label");
     const pathname = window.location.pathname;
-    const isZh = pathname.includes("/zh-CN/") || pathname.endsWith("/zh-CN");
+    const isZhDoc = pathname.includes("/zh-CN/") || pathname.endsWith("/zh-CN");
+    const savedLang = (() => {
+      try {
+        return localStorage.getItem("bitty_lang");
+      } catch {
+        return null;
+      }
+    })();
+    const currentDocLang =
+      document.documentElement.getAttribute("data-lang") ||
+      savedLang ||
+      (isZhDoc ? "zh-CN" : "en");
     if (langLabel) {
-      langLabel.textContent = isZh ? "中" : "EN";
+      langLabel.textContent =
+        currentDocLang === "zh-CN" || isZhDoc ? "中" : "EN";
     }
 
     langBtn?.addEventListener("click", () => {
       const cur = window.location.pathname;
       if (cur.includes("/docs/")) {
         if (cur.includes("/zh-CN/")) {
           // Switch zh-CN -> en
+          try {
+            localStorage.setItem("bitty_lang", "en");
+          } catch {}
           window.location.href = cur.replace("/zh-CN/", "/");
         } else {
           // Switch en -> zh-CN
+          try {
+            localStorage.setItem("bitty_lang", "zh-CN");
+          } catch {}
           const match = cur.match(/^\/docs\/([^/]+)\/(.*)$/);
           if (match) {
             window.location.href = `/docs/${match[1]}/zh-CN/${match[2]}`;
@@ -198,14 +216,26 @@ const GITHUB_REPO_URL = "https://github.com/bitty-terminal/bitty";
           }
         }
       } else {
-        if (isZh) {
-          window.location.href = "/";
-        } else {
-          window.location.href =
-            "/docs/latest/zh-CN/getting-started/quickstart/";
-        }
+        // Toggle language on the homepage in-place
+        const curLang =
+          document.documentElement.getAttribute("data-lang") || "en";
+        const nextLang = curLang === "zh-CN" ? "en" : "zh-CN";
+        window.dispatchEvent(
+          new CustomEvent("bitty-lang-toggle", {
+            detail: { nextLang },
+          }),
+        );
       }
     });
+
+    // Listen for language update events
+    window.addEventListener("bitty-lang-updated", ((
+      e: CustomEvent<{ lang: string }>,
+    ) => {
+      if (langLabel && e.detail?.lang) {
+        langLabel.textContent = e.detail.lang === "zh-CN" ? "中" : "EN";
+      }
+    }) as EventListener);
   })();
 </script>
 

src/lib/translations.ts

@@ -0,0 +1,135 @@
+// src/lib/translations.ts
+// Home & Hero i18n dictionaries for English (en) and Simplified Chinese (zh-CN).
+
+export type SupportedLang = "en" | "zh-CN";
+
+export interface Translations {
+  heroBadge1: string;
+  heroBadge2: string;
+  heroTitle: string;
+  heroLede: string;
+  getBittyBtn: string;
+  exploreDocsBtn: string;
+  installDeckBadge: string;
+  installDeckChecksum: string;
+  installHintUnix: string;
+  installHintWin: string;
+  installHintPkg: string;
+  installHintCargo: string;
+  installHintDefault: string;
+  directBinariesTitle: string;
+  statusReady: string;
+  directMatrixLink: string;
+  linuxEcosystemBadge: string;
+  linuxEcosystemSubtitle: string;
+  linuxMatrixTitle: string;
+  linuxMatrixDesc: string;
+  statNativeRust: string;
+  statPackages: string;
+  statIdleMem: string;
+  filterAll: string;
+  filterArch: string;
+  filterDebian: string;
+  filterFedora: string;
+  filterSuse: string;
+  filterAlpine: string;
+  filterNix: string;
+  filterSource: string;
+  filterUniversal: string;
+  pillarsTitle: string;
+  pillarsSubtitle: string;
+  manualTitle: string;
+  manualSubtitle: string;
+}
+
+export const translations: Record<SupportedLang, Translations> = {
+  en: {
+    heroBadge1: "★ GPU-ACCELERATED · RUST MICROKERNEL",
+    heroBadge2: "PICCOLO LUA SANDBOX · 0B IDLE",
+    heroTitle: "TILE SHELLS & RICH LUA PANELS AT NATIVE SPEED.",
+    heroLede:
+      "Bitty pairs Hyprland dwindle tiling with a pure-Rust microkernel. Run high-throughput PTY shells alongside declarative Piccolo Lua UI panels with zero background daemons.",
+    getBittyBtn: "Get Bitty ⚡",
+    exploreDocsBtn: "Explore Docs →",
+    installDeckBadge: "QUICK INSTALL",
+    installDeckChecksum: "SHA-256 CHECKSUMS ↗",
+    installHintUnix:
+      "Linux & macOS: Automated bootstrap fetching verified .tar.zst / binary",
+    installHintWin:
+      "Windows: PowerShell one-liner installing portable binary (user-local)",
+    installHintPkg:
+      "Package managers: Arch (AUR), Debian/Ubuntu (.deb), Fedora (.rpm), openSUSE, Alpine, NixOS, Flatpak",
+    installHintCargo:
+      "Build from source: compile with pinned toolchain (+1.98.1) via Cargo",
+    installHintDefault: "Automated bootstrap & verified checksums",
+    directBinariesTitle: "★ Direct R2 Binaries & Packages:",
+    statusReady: "● READY",
+    directMatrixLink: "Matrix ↓",
+    linuxEcosystemBadge: "LINUX ECOSYSTEM",
+    linuxEcosystemSubtitle: "★ Universal Linux Distribution & Package Support",
+    linuxMatrixTitle: "Universal Linux Distribution Matrix",
+    linuxMatrixDesc:
+      "From bleeding-edge rolling releases (Arch, CachyOS) to stable enterprise deployments (Debian, Ubuntu, Fedora, openSUSE), lightweight musl systems (Alpine), and reproducible environments (NixOS)—Bitty runs natively everywhere.",
+    statNativeRust: "100% NATIVE RUST",
+    statPackages: "12 FORMATS & PKGS",
+    statIdleMem: "0B IDLE MEMORY",
+    filterAll: "All Formats (12)",
+    filterArch: "Arch / CachyOS",
+    filterDebian: "Debian / Ubuntu",
+    filterFedora: "Fedora / RHEL",
+    filterSuse: "openSUSE",
+    filterAlpine: "Alpine (musl)",
+    filterNix: "NixOS",
+    filterSource: "Void & Gentoo",
+    filterUniversal: "Universal (AppImage / Flatpak / Snap)",
+    pillarsTitle: "Engineered for Composability & Isolation",
+    pillarsSubtitle:
+      "Zero monolithic bloat. Bitty separates terminal mechanics from extension policy.",
+    manualTitle: "Bitty Manual & Guides",
+    manualSubtitle:
+      "Official user manual, configuration reference, and Lua API documentation served directly from Cloudflare R2.",
+  },
+  "zh-CN": {
+    heroBadge1: "GPU 加速微内核架构",
+    heroBadge2: "PICCOLO LUA 隔离沙箱 · 0B 空闲内存",
+    heroTitle: "平铺分屏与丰富 LUA 面板，原生极速终端",
+    heroLede:
+      "Bitty 将 Hyprland 风格的平铺分屏与纯 Rust 微内核深度结合。支持高吞吐 PTY 终端会话与声明式 Piccolo Lua UI 面板并存，零后台守护进程常驻。",
+    getBittyBtn: "安装 Bitty ⚡",
+    exploreDocsBtn: "浏览官方文档 →",
+    installDeckBadge: "快速安装",
+    installDeckChecksum: "SHA-256 校验和 ↗",
+    installHintUnix: "Linux & macOS: 自动拉取已验证的 .tar.zst 二进制包",
+    installHintWin: "Windows: PowerShell 单行命令安装便携二进制（用户本地）",
+    installHintPkg:
+      "发行版包管理器: Arch (AUR), Debian/Ubuntu (.deb), Fedora (.rpm), openSUSE, Alpine, NixOS, Flatpak",
+    installHintCargo: "从源码编译: 通过 Cargo 与锁定工具链 (+1.98.1) 本地构建",
+    installHintDefault: "自动化安装脚本 · 官方校验和已验证",
+    directBinariesTitle: "★ R2 官方构建包与发行版安装包:",
+    statusReady: "● 就绪",
+    directMatrixLink: "发行版矩阵 ↓",
+    linuxEcosystemBadge: "LINUX 发行版生态",
+    linuxEcosystemSubtitle: "★ 全主流 Linux 发行版与包管理器原生支持",
+    linuxMatrixTitle: "全主流 Linux 发行版支持矩阵",
+    linuxMatrixDesc:
+      "无论是前沿滚动的 Arch、CachyOS，还是企业级稳定的 Debian、Ubuntu、Fedora、openSUSE，亦或是轻量 musl 系统（Alpine）与纯净重现式构建（NixOS）——Bitty 原生兼容一切。",
+    statNativeRust: "100% 纯 RUST 原生",
+    statPackages: "12 种打包格式",
+    statIdleMem: "0B 空闲内存占用",
+    filterAll: "全格式 (12)",
+    filterArch: "Arch / CachyOS",
+    filterDebian: "Debian / Ubuntu",
+    filterFedora: "Fedora / RHEL",
+    filterSuse: "openSUSE",
+    filterAlpine: "Alpine (musl)",
+    filterNix: "NixOS",
+    filterSource: "Void & Gentoo",
+    filterUniversal: "通用格式 (AppImage / Flatpak / Snap)",
+    pillarsTitle: "专为高度组合与沙箱隔离设计",
+    pillarsSubtitle:
+      "拒绝单体臃肿设计。Bitty 将终端渲染核心与扩展业务逻辑彻底分离。",
+    manualTitle: "Bitty 官方手册与指南",
+    manualSubtitle:
+      "官方用户手册、配置规范与 Lua API 文档，通过 Cloudflare R2 极速直连分发。",
+  },
+};