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
41 lines
1.6 KiB
TypeScript
41 lines
1.6 KiB
TypeScript
"use client";
|
|
|
|
import { ArrowRightIcon } from "@heroicons/react/24/solid";
|
|
|
|
export function HomeCTA() {
|
|
return (
|
|
<section className="mx-4 lg:mx-auto max-w-5xl border border-t-0 border-gray-200 py-16">
|
|
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 items-center px-6">
|
|
|
|
{/* LEFT: Big CTA Button */}
|
|
<button className="w-full lg:col-span-2 flex items-center justify-between bg-white border items-left border-gray-300 rounded-full px-8 py-5 shadow-sm hover:border-cyan-500 transition">
|
|
<span className="text-2xl lg:text-3xl font-semibold text-gray-900">
|
|
Start Your Mycelium Journey
|
|
</span>
|
|
|
|
<span className="flex h-12 w-12 items-center justify-center rounded-full bg-cyan-500">
|
|
<ArrowRightIcon className="h-6 w-6 text-white" />
|
|
</span>
|
|
</button>
|
|
|
|
{/* RIGHT: Two small CTAs */}
|
|
<div className="flex flex-col gap-4">
|
|
|
|
{/* Button 1 */}
|
|
<button className="inline-flex items-center justify-between bg-cyan-500 text-white rounded-full px-6 py-3 text-sm font-semibold shadow-sm hover:bg-cyan-600 transition">
|
|
Get Started
|
|
<ArrowRightIcon className="h-4 w-4 ml-2" />
|
|
</button>
|
|
|
|
{/* Button 2 */}
|
|
<button className="inline-flex items-center justify-between bg-white border border-gray-300 rounded-full px-6 py-3 text-sm font-semibold shadow-sm hover:border-cyan-500 transition">
|
|
Explore Docs
|
|
<ArrowRightIcon className="h-4 w-4 ml-2 text-gray-700" />
|
|
</button>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|