Files
heicode-win/website/components/features.tsx
T
gongzhiyong 9bf3a73a75 feat: align heicode web-manager branding and deployment docs
Unify website and manager experience with updated logo and manager entry links, and document the current production topology and URLs in CLAUDE.md for consistent future operations.

Made-with: Cursor
2026-04-30 20:23:46 +08:00

71 lines
2.6 KiB
TypeScript

import { Shield, Users, Eye, Workflow } from "lucide-react";
const features = [
{
icon: Shield,
title: "身份与策略一元化",
description:
"从个人到团队,谁能访问何种资源、何种环境、何种仓库——应有清晰归属与审计预期,而不是散落在若干控制台口径不一致。",
},
{
icon: Workflow,
title: "编排与角色范式",
description:
"既支持个人工作流也支持团队协作:个人可单人执行全流程,团队可按阶段或迭代组织分工。",
},
{
icon: Eye,
title: "全生命周期可信交付",
description:
"从构想到运营,关键产物应能对齐到分支、标签或发布单元:规格、实现、验证、发布、运维与复盘之间有可追溯链路。",
},
{
icon: Users,
title: "平台化协作",
description:
"无论个人还是团队,客户端与 Manager 共同服务协作叙事——跨角色、跨会话、跨环境的一体化体验。",
},
];
export function Features() {
return (
<section id="features" className="border-y border-border bg-card/30 py-20 sm:py-32">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<div className="mx-auto max-w-2xl text-center">
<p className="text-sm font-medium tracking-widest text-accent uppercase">
战略支柱
</p>
<h2 className="mt-4 text-3xl font-bold tracking-tight sm:text-4xl">
四大核心能力
</h2>
<p className="mt-4 text-muted-foreground">
个人开发者到多人团队,都能获得清晰的责任边界与可追溯的交付过程
</p>
</div>
<div className="mt-16 grid gap-6 sm:grid-cols-2 lg:gap-8">
{features.map((feature, index) => (
<div
key={feature.title}
className="relative flex gap-6 rounded-xl border border-border bg-background p-6 sm:p-8"
>
<div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-accent/10 text-accent">
<feature.icon className="h-5 w-5" />
</div>
<div>
<h3 className="text-lg font-semibold">{feature.title}</h3>
<p className="mt-2 text-sm leading-relaxed text-muted-foreground">
{feature.description}
</p>
</div>
<span className="absolute top-4 right-4 text-6xl font-bold text-secondary/50">
{String(index + 1).padStart(2, "0")}
</span>
</div>
))}
</div>
</div>
</section>
);
}