Hunter Bown
9e45780ba0
First commit of the Next.js community site that powers deepseek-tui.com, deployed via Cloudflare Workers / OpenNext. This commit lands the scaffold and applies the visual + correctness pass requested by community feedback: - Palette: drop the cream/Anthropic-feel paper (#F4F1E8) for a DeepSeek-aligned cool white + soft gray (#FFFFFF / #F4F6FB), with indigo accents kept. Soften default hairlines so a pure-white background reads clean instead of harsh. - Mobile: add a hamburger menu (mobile-menu.tsx) so phones can reach Install / Docs / Activity / Roadmap / Contribute — previously the link list was hidden on phones with no replacement. Tighter hero, flexible button row, viewport-safe code blocks, columnar grids collapse cleanly under 768px, and the printed-almanac center rule is desktop-only now (it sliced through narrow viewports). - "How it works" diagram: replace the hand-rolled ASCII art (which misaligned under CJK monospace because Han characters take 2 columns vs Latin's 1, per dhh's note in WeChat) with a real mermaid diagram rendered client-side via dynamic import. Uses the mermaid.live standard syntax 庄表伟 recommended. - Issue #1104: the docs listed a `deepseek-cn` provider that the v0.8.16 binary doesn't accept (`ProviderArg` in crates/cli only has 9 variants; the 10th lives only in the legacy tui/config.rs). derive-facts.mjs now omits `deepseek-cn` until that variant is wired through the shared ProviderKind, and the install page's China-network recipe uses `base_url` / `DEEPSEEK_BASE_URL` (which actually works on v0.8.16) instead of the unsupported provider. Auto-deploys via .github/workflows/deploy-web.yml on push to main. Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
34 lines
1.0 KiB
TypeScript
34 lines
1.0 KiB
TypeScript
import type { RepoStats } from "@/lib/types";
|
|
|
|
function fmt(n: number): string {
|
|
if (n >= 1000) return (n / 1000).toFixed(1) + "k";
|
|
return n.toString();
|
|
}
|
|
|
|
export function StatGrid({ stats }: { stats: RepoStats }) {
|
|
const cells = [
|
|
{ label: "Stars", cn: "星标", value: fmt(stats.stars) },
|
|
{ label: "Forks", cn: "复刻", value: fmt(stats.forks) },
|
|
{ label: "Contributors", cn: "贡献者", value: fmt(stats.contributors) },
|
|
{
|
|
label: "Latest",
|
|
cn: "版本",
|
|
value: stats.latestRelease?.tag ?? "—",
|
|
mono: true,
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="hairline-t hairline-b grid grid-cols-2 sm:grid-cols-4 col-rule">
|
|
{cells.map((c) => (
|
|
<div key={c.label} className="px-5 py-5">
|
|
<div className="eyebrow mb-2">
|
|
{c.label} · <span className="font-cjk normal-case tracking-normal">{c.cn}</span>
|
|
</div>
|
|
<div className={c.mono ? "font-mono text-2xl tabular text-ink" : "bignum text-ink"}>{c.value}</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|