feat(website): 官网企业版视觉升级
- 引入 Geist 字体,去除紫色渐变,克制阴影与交互态 - 导航/卡片/按钮统一企业风格,各区块视觉收敛
This commit is contained in:
1 parent
b2f6e7a166
commit
75e48bc4c6
15 files changed
+145
-55
No files matched your search
@@ -10,20 +10,24 @@ export default function CTA() {
|
||||
className="py-24"
|
||||
>
|
||||
<div className="container-page">
|
||||
<div className="relative overflow-hidden rounded-xl border border-primary/25 bg-gradient-to-r from-primary/10 via-primary/5 to-violet-500/10 p-12 text-center md:p-16">
|
||||
{/* 科技风光晕 */}
|
||||
<div className="card relative overflow-hidden p-12 text-center md:p-16">
|
||||
{/* 克制同色系光晕 + 顶部强调线(去紫,保持页面调性) */}
|
||||
<div
|
||||
aria-hidden="true"
|
||||
className="pointer-events-none absolute -top-24 left-1/2 h-64 w-[480px] -translate-x-1/2 rounded-full bg-primary/15 blur-3xl"
|
||||
className="pointer-events-none absolute -top-24 left-1/2 h-64 w-[480px] -translate-x-1/2 rounded-full bg-primary/10 blur-3xl"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
className="pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-primary/40 to-transparent"
|
||||
/>
|
||||
<div className="relative">
|
||||
<h2
|
||||
id="cta-title"
|
||||
className="text-3xl font-bold tracking-tight md:text-5xl"
|
||||
className="text-3xl font-bold tracking-[-0.03em] md:text-5xl"
|
||||
>
|
||||
{t.cta.title}
|
||||
</h2>
|
||||
<p className="mt-4 text-base text-muted-foreground md:text-lg">
|
||||
<p className="mx-auto mt-4 max-w-2xl text-base text-muted-foreground md:text-lg">
|
||||
{t.cta.subtitle}
|
||||
</p>
|
||||
<div className="mt-8 flex flex-wrap justify-center gap-3">
|
||||
|
||||
@@ -18,12 +18,38 @@ function cacheKey(embedded: ChangelogEntry[]) {
|
||||
return `kimi-switch-changelog-${embedded[0]?.version ?? "v1"}`;
|
||||
}
|
||||
|
||||
/** Parse a GitHub release body into bullet items. */
|
||||
/** Compare semantic versions like "v0.7.1" for descending order. */
|
||||
function compareVersionsDesc(a: string, b: string): number {
|
||||
const parse = (v: string) =>
|
||||
v.replace(/^v/, "").split(".").map((n) => Number(n) || 0);
|
||||
const pa = parse(a);
|
||||
const pb = parse(b);
|
||||
for (let i = 0; i < 3; i++) {
|
||||
const da = pa[i] ?? 0;
|
||||
const db = pb[i] ?? 0;
|
||||
if (da !== db) return db - da;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
/** Parse a GitHub release body into bullet items, stripping markdown syntax
|
||||
* and the release-template "Downloads by platform" section (changelog entries
|
||||
* are about changes, not installers). */
|
||||
function parseBody(body: string): string[] {
|
||||
return body
|
||||
.split("\n")
|
||||
.map((l) => l.replace(/^\s*[-*]\s+/, "").trim())
|
||||
.filter((l) => l.length > 0 && l !== "---");
|
||||
const items: string[] = [];
|
||||
for (const raw of body.split("\n")) {
|
||||
const line = raw.replace(/^\s*[-*]\s+/, "").trim();
|
||||
if (line.length === 0 || line === "---") continue;
|
||||
// Drop the release template's download section and everything after it.
|
||||
if (/downloads?\s+by\s+platform/i.test(line)) break;
|
||||
const cleaned = line
|
||||
.replace(/^#{1,6}\s+/, "") // markdown heading markers
|
||||
.replace(/\*\*(.+?)\*\*/g, "$1") // bold
|
||||
.replace(/`([^`]+)`/g, "$1") // inline code
|
||||
.trim();
|
||||
if (cleaned.length > 0) items.push(cleaned);
|
||||
}
|
||||
return items;
|
||||
}
|
||||
|
||||
async function fetchReleases(): Promise<ChangelogEntry[]> {
|
||||
@@ -94,12 +120,13 @@ export default function Changelog() {
|
||||
}, []);
|
||||
|
||||
// 远端拉到的版本优先显示(含未翻译的新版本),内置列表补齐缺失版本。
|
||||
// 合并后按版本倒序排序,避免未翻译版本被无脑塞到最前导致时间轴顺序错乱。
|
||||
const entries: ChangelogEntry[] = [
|
||||
...(remote ?? []).filter(
|
||||
(r) => !embedded.some((e) => e.version === r.version),
|
||||
),
|
||||
...embedded,
|
||||
];
|
||||
].sort((a, b) => compareVersionsDesc(a.version, b.version));
|
||||
|
||||
return (
|
||||
<SectionShell
|
||||
@@ -107,16 +134,16 @@ export default function Changelog() {
|
||||
title={t.changelog.title}
|
||||
subtitle={t.changelog.subtitle}
|
||||
>
|
||||
<ol className="relative space-y-8 border-l border-border pl-8">
|
||||
<ol className="relative space-y-10 border-l border-border pl-7">
|
||||
{entries.map((e) => (
|
||||
<li key={e.version} className="relative">
|
||||
<span className="absolute -left-[37px] top-1.5 h-2.5 w-2.5 rounded-full bg-primary" />
|
||||
<span className="absolute -left-[34px] top-[5px] h-3 w-3 rounded-full border-2 border-background bg-primary ring-4 ring-primary/10" />
|
||||
<div className="flex flex-wrap items-baseline gap-3">
|
||||
<h3 className="font-mono text-lg font-semibold">{e.version}</h3>
|
||||
<h3 className="font-mono text-lg font-semibold tracking-tight">{e.version}</h3>
|
||||
<time className="text-xs text-muted-foreground">{e.date}</time>
|
||||
</div>
|
||||
{e.items.length > 0 && (
|
||||
<ul className="mt-2 list-disc space-y-1 pl-5 text-sm text-muted-foreground">
|
||||
<ul className="mt-2 list-disc space-y-1 pl-5 text-sm leading-relaxed text-muted-foreground">
|
||||
{e.items.map((item) => (
|
||||
<li key={item}>{item}</li>
|
||||
))}
|
||||
|
||||
@@ -45,14 +45,14 @@ export default function Download() {
|
||||
return (
|
||||
<div key={p.id} className="card flex flex-col">
|
||||
<div className="mb-3 flex items-center justify-between">
|
||||
<div className="flex h-10 w-10 items-center justify-center rounded-xl border border-primary/25 bg-primary/10 text-primary">
|
||||
<div className="icon-chip">
|
||||
<Icon className="h-5 w-5" weight="duotone" />
|
||||
</div>
|
||||
<span className="rounded-full border border-primary/25 bg-primary/10 px-2.5 py-0.5 text-xs font-medium text-primary">
|
||||
<span className="rounded-md border border-primary/20 bg-primary/10 px-2 py-0.5 text-[11px] font-medium tracking-wide text-primary">
|
||||
{t.download.ready}
|
||||
</span>
|
||||
</div>
|
||||
<h3 className="mb-2 text-lg font-semibold">{p.name}</h3>
|
||||
<h3 className="mb-2 text-lg font-semibold tracking-tight">{p.name}</h3>
|
||||
<p className="text-sm text-muted-foreground">{p.note}</p>
|
||||
<div className="mt-4 flex flex-wrap gap-2">
|
||||
{links.map((l) => (
|
||||
|
||||
@@ -59,10 +59,10 @@ export default function Features() {
|
||||
/>
|
||||
</div>
|
||||
<div className="p-6">
|
||||
<div className="mb-3 flex h-10 w-10 items-center justify-center rounded-xl border border-primary/25 bg-primary/10 text-primary">
|
||||
<div className="icon-chip mb-3">
|
||||
<Icon className="h-5 w-5" weight="duotone" />
|
||||
</div>
|
||||
<h3 className="mb-2 text-lg font-semibold">{f.title}</h3>
|
||||
<h3 className="mb-2 text-lg font-semibold tracking-tight">{f.title}</h3>
|
||||
<p className="text-sm leading-relaxed text-muted-foreground">
|
||||
{f.desc}
|
||||
</p>
|
||||
|
||||
@@ -23,29 +23,29 @@ export default function Hero() {
|
||||
aria-labelledby="hero-title"
|
||||
className="relative overflow-hidden pt-16 pb-20 md:pt-24"
|
||||
>
|
||||
{/* 科技风光晕 */}
|
||||
{/* 克制的同色系光晕(去紫,统一蓝色 + 中性) */}
|
||||
<div
|
||||
aria-hidden="true"
|
||||
className="pointer-events-none absolute -top-32 right-[-10%] h-[420px] w-[420px] rounded-full bg-primary/15 blur-3xl"
|
||||
className="pointer-events-none absolute -top-32 right-[-10%] h-[420px] w-[420px] rounded-full bg-primary/10 blur-3xl"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
className="pointer-events-none absolute -left-40 top-1/2 h-[320px] w-[320px] rounded-full bg-violet-500/10 blur-3xl"
|
||||
className="pointer-events-none absolute -left-40 top-1/2 h-[320px] w-[320px] rounded-full bg-primary/5 blur-3xl"
|
||||
/>
|
||||
<div className="container-page relative grid grid-cols-1 gap-10 md:grid-cols-2 md:items-center">
|
||||
<div>
|
||||
<div {...reveal(0)}>
|
||||
<span className="inline-block rounded-full border border-primary/25 bg-primary/10 px-3 py-1 text-xs font-medium text-primary">
|
||||
<span className="inline-block rounded-full border border-primary/25 bg-primary/10 px-3 py-1 text-xs font-medium tracking-wide text-primary">
|
||||
{t.hero.badge}
|
||||
</span>
|
||||
</div>
|
||||
<h1
|
||||
id="hero-title"
|
||||
{...reveal(100, "mt-4 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl")}
|
||||
{...reveal(100, "mt-5 text-4xl font-bold leading-[1.05] tracking-[-0.03em] md:text-5xl lg:text-6xl")}
|
||||
>
|
||||
{t.hero.titleBefore}
|
||||
<br />
|
||||
<span className="whitespace-nowrap bg-gradient-to-r from-blue-500 to-violet-500 bg-clip-text text-transparent">
|
||||
<span className="whitespace-nowrap text-primary">
|
||||
{t.hero.titleAccent}
|
||||
</span>
|
||||
{t.hero.titleAfter}
|
||||
|
||||
@@ -65,7 +65,7 @@ function Counter({
|
||||
const v = useCountUp(target, inView);
|
||||
return (
|
||||
<div ref={ref} className="card text-center">
|
||||
<div className="font-mono text-4xl font-bold tracking-tight tabular-nums">
|
||||
<div className="font-mono text-4xl font-bold tracking-[-0.03em] tabular-nums">
|
||||
{v.toFixed(decimals)}
|
||||
{suffix}
|
||||
</div>
|
||||
|
||||
@@ -21,10 +21,10 @@ export default function Privacy() {
|
||||
const Icon = icons[it.id] ?? Database;
|
||||
return (
|
||||
<div key={it.id} className="card">
|
||||
<div className="mb-3 flex h-10 w-10 items-center justify-center rounded-xl border border-primary/25 bg-primary/10 text-primary">
|
||||
<div className="icon-chip mb-3">
|
||||
<Icon className="h-5 w-5" weight="duotone" />
|
||||
</div>
|
||||
<h3 className="mb-2 text-lg font-semibold">{it.title}</h3>
|
||||
<h3 className="mb-2 text-lg font-semibold tracking-tight">{it.title}</h3>
|
||||
<p className="text-sm leading-relaxed text-muted-foreground">
|
||||
{it.desc}
|
||||
</p>
|
||||
|
||||
Reference in new issue
Block a user