forked from emre/www_projectmycelium_com
sasha-astiadi
b3836062a3
- Removed duplicate hero component variations (AgentsHero/AgentsHeroAlt, CloudHero/CloudHeroAlt) - Deleted unused CloudCTA, CloudGettingStarted, and CloudDesign components - Cleaned up empty files and legacy page structure
34 lines
1004 B
TypeScript
34 lines
1004 B
TypeScript
"use client";
|
|
|
|
import {
|
|
ShieldCheckIcon,
|
|
KeyIcon,
|
|
CodeBracketIcon,
|
|
BoltIcon,
|
|
} from "@heroicons/react/24/outline";
|
|
|
|
export function HomeWhy() {
|
|
const items = [
|
|
{ label: "Unbreakable by Design", icon: ShieldCheckIcon },
|
|
{ label: "Sovereign by Default", icon: KeyIcon },
|
|
{ label: "Hackable & Open", icon: CodeBracketIcon },
|
|
{ label: "Cost & Energy Efficient", icon: BoltIcon },
|
|
];
|
|
|
|
return (
|
|
<section className="mx-4 lg:mx-auto max-w-5xl border border-t-0 border-gray-200 py-12 px-6 text-center">
|
|
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4 place-items-center">
|
|
{items.map(({ label, icon: Icon }) => (
|
|
<span
|
|
key={label}
|
|
className="inline-flex items-center gap-2 bg-white border border-gray-300 rounded-full px-6 py-2 text-sm font-medium text-gray-900 shadow-sm"
|
|
>
|
|
<Icon className="h-5 w-5 text-gray-900" />
|
|
{label}
|
|
</span>
|
|
))}
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|