feat: site refresh — listening tops, nav/footer, bilingual README

[kaiiiichen]

Summary

这是一次较大的站点整理与功能更新，涵盖文档、首页文案、导航结构、Listening 卡片新功能，以及多处 UI 组件抽取与 CSS 瘦身。共 2 个 commit，29 个文件，+1541 / −1474 行。

---

1. 文档（README 双语重写 + 配套同步）

• README.md：完整重写为 English + 中文 双语结构，统一描述站点理念、路由、API、环境变量、CI 与 fork 清单。
• 移除所有 Substack RSS、Notes/Blog 导航 相关描述（与代码变更一致）。
• 新增 GET /api/spotify/last-month-top、SiteFooter、精简后的导航（About · Projects · Misc）文档。
• AGENTS.md / CLAUDE.md / CONTRIBUTING.md：同步删除 Substack/MDX 等过时引用，更新架构快照。

---

2. 导航与页脚

变更	说明
Nav 精简	移除 Notes（Notion）与 Blog（Substack）外链；仅保留 About · Projects · Misc
Active 状态	基于 usePathname() 的高亮：accent 色文字 + 2px 下划线
Logo 文案	「Kai Thomas Chen」→「Kai T. Chen」，hover 改为 accent 色
Wave underline 移除	删除 portal 波浪动画及相关 CSS（nav-wave-flow）
SiteFooter	新增 site-footer.tsx，挂载于 layout.tsx，全站页脚 © 2026

---

3. Listening 卡片 — 上月 Top 5

新 API： GET /api/spotify/last-month-top

• 从 Supabase listening_history 按 上自然月 UTC 范围查询
• 分页读取（1000 行/页，绕过 PostgREST 上限）
• 按播放次数排名，返回 Top 5 曲目（不含计数）
• revalidate = 600，Cache-Control: s-maxage=600

新模块：

• lib/listening-monthly-top.ts — 纯函数：getLastMonthUtcRange、pickTopFiveTracks
• lib/listening-monthly-top.test.ts — Vitest 覆盖
• lib/listening-supabase.ts — 新增 getLastMonthTopFiveTracks()

新 UI：

• listening-track-row.tsx — 可复用曲目行（live / compact 变体）
• listening-last-month-top.tsx — 「last month's tops」按钮 + HoverTip 弹出 Top 5 列表
• listening-card.tsx — 重构为使用上述组件，状态栏右侧显示上月 Top 入口

---

4. 首页重构

移除：

• Substack RSS 抓取（app/lib/substack.ts）及首页 Blog 卡片
• 首页内联 footer（移至全局 SiteFooter）
• :D giggle 动画（.emote-giggle）

新增/抽取组件：

• home-social-links.tsx — 社交图标 + HoverTip 标签 + 「?」联系指引
• gwwc-badge.tsx — Giving What We Can 🔸 徽章 + 说明 tooltip
• pinned-project-link.tsx — 首页 list / Projects 页 card 两种变体，消除重复 markup
• hover-tip.tsx — 通用 tooltip（支持 portal、interactive、align）

文案更新：

• 开场改为「Aloha :D」+ 更轻松的自我介绍
• 内链 hover 统一为 accent 色
• metadata / OG：Visiting UC Berkeley → Visiting at UC Berkeley

布局：

• Projects 卡片改为全宽单列（Blog 列移除）

---

5. Misc / About / Projects / Weather

• Misc：「News」→ Watching；布局从两列改为 Watching → Remembrance → Things I Love 三卡片全宽堆叠
• About：personality 段落改为更淡的 zinc 色；metadata 文案微调
• Projects：使用 PinnedProjectLink variant="card"；移除标题下分隔线
• Weather：「Berkeley」→「Based in Berkeley」；副行新增 rain % 显示
• ProjectStars：移除 always-on 的 public 徽章，保留 archived

---

6. 主题与 CSS 瘦身

• ThemeProvider：移除 system 主题选项，仅 light/dark；默认 light
• globals.css：删除 ~500 行未使用的 listening FX 动画（eq bars、shards、orbit 等）、nav wave、:D giggle、highlight.js 主题、多余 font token
• 保留：listening live dot pulse、art breathe、mag-card 等核心样式
• mag-card：圆角 2px → 6px（--mag-card-radius）

---

7. 删除的文件

• app/lib/substack.ts
• lib/substack-rss.test.ts

---

Test plan

• npm run lint && npm run typecheck && npm run test && npm run build — 全部通过
• 首页：Listening 卡片显示 now/last playing；hover「last month's tops」弹出 Top 5（需 Supabase 数据）
• 首页：社交图标 tooltip、GWWC 徽章 tooltip、Projects 列表正常
• Nav：三链接 active 高亮；移动端菜单正常
• 全页页脚显示 © 2026
• /misc：Watching / Remembrance / Things I Love 三卡片全宽
• /projects：卡片布局与 hover 正常
• 暗色模式切换（仅 light/dark，无 system）
• Weather 卡片显示 rain %

Made with Cursor

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
kaichen.dev	Ready	Preview, Comment	Jun 15, 2026 3:51am