forked from emre/www_projectmycelium_com
sasha-astiadi
29e2d942de
- Replaced em dashes with commas for better readability in descriptions - Standardized punctuation in aria-labels (changed "—" to ",") - Removed unnecessary em dashes in favor of commas or removed punctuation - Fixed inconsistent spacing around punctuation marks - Improved sentence flow in multiple component descriptions
95 lines
3.6 KiB
TypeScript
95 lines
3.6 KiB
TypeScript
import {
|
||
ChatBubbleLeftRightIcon,
|
||
CalendarDaysIcon,
|
||
UsersIcon,
|
||
CpuChipIcon,
|
||
} from '@heroicons/react/24/solid'
|
||
import { Eyebrow, H4, P } from '@/components/Texts'
|
||
|
||
export function PodsComing() {
|
||
return (
|
||
<section className="w-full max-w-8xl mx-auto bg-white">
|
||
|
||
{/* Top horizontal line */}
|
||
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200" />
|
||
<div className="w-full border-t border-l border-r border-gray-200" />
|
||
|
||
{/* Main content */}
|
||
<div className="mx-auto max-w-7xl px-6 bg-white lg:px-8 grid grid-cols-1 lg:grid-cols-2 gap-20 py-12 border border-t-0 border-b-0 border-gray-200">
|
||
|
||
{/* LEFT SIDE – Title + Intro */}
|
||
<div className="max-w-xl">
|
||
<Eyebrow className="text-cyan-600">COMING SOON</Eyebrow>
|
||
|
||
<H4 className="mt-6 text-gray-900">
|
||
Be Among The First
|
||
</H4>
|
||
|
||
<P className="mt-6 text-gray-700">
|
||
The first Pods are launching soon.
|
||
10,000 early Pods will be available for early adopters. Next, Pods will support peer-to-peer AI Agents that live inside your environment.
|
||
Your own AI, powered by your data without any data leaks.
|
||
</P>
|
||
</div>
|
||
|
||
{/* RIGHT SIDE — 4 upcoming features */}
|
||
<div className="space-y-10">
|
||
|
||
{/* 1 — Private Chat & Calls */}
|
||
<div>
|
||
<h3 className="text-lg font-semibold text-gray-900 flex items-center">
|
||
<ChatBubbleLeftRightIcon className="h-6 w-6 text-cyan-600 mr-3" />
|
||
Private Chat & Calls
|
||
</h3>
|
||
<p className="mt-2 text-gray-700 max-w-2xl">
|
||
Peer-to-peer conversations and calling routed directly between Pods.
|
||
</p>
|
||
<div className="mt-8 h-px w-full bg-cyan-200" />
|
||
</div>
|
||
|
||
{/* 2 — Calendar & File Sync */}
|
||
<div>
|
||
<h3 className="text-lg font-semibold text-gray-900 flex items-center">
|
||
<CalendarDaysIcon className="h-6 w-6 text-cyan-600 mr-3" />
|
||
Calendar & File Sync
|
||
</h3>
|
||
<p className="mt-2 text-gray-700 max-w-2xl">
|
||
Your schedules, documents, and files synced across your Pods with no central cloud.
|
||
</p>
|
||
<div className="mt-8 h-px w-full bg-cyan-200" />
|
||
</div>
|
||
|
||
{/* 3 — Secure Team Spaces */}
|
||
<div>
|
||
<h3 className="text-lg font-semibold text-gray-900 flex items-center">
|
||
<UsersIcon className="h-6 w-6 text-cyan-600 mr-3" />
|
||
Secure Team Spaces
|
||
</h3>
|
||
<p className="mt-2 text-gray-700 max-w-2xl">
|
||
Create shared Pods for teams, communities, or groups. Fully encrypted, fully sovereign.
|
||
</p>
|
||
<div className="mt-8 h-px w-full bg-cyan-200" />
|
||
</div>
|
||
|
||
{/* 4 — Early AI Agent Integration */}
|
||
<div>
|
||
<h3 className="text-lg font-semibold text-gray-900 flex items-center">
|
||
<CpuChipIcon className="h-6 w-6 text-cyan-600 mr-3" />
|
||
Early AI Agent Integration
|
||
<span className="ml-2 text-xs text-gray-400">🕒</span>
|
||
</h3>
|
||
<p className="mt-2 text-gray-700 max-w-2xl">
|
||
Host your personal AI agent inside your Pod. Private, local-first, and fully under your control.
|
||
</p>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
{/* Bottom horizontal line */}
|
||
<div className="w-full border-b border-gray-200" />
|
||
<div className="max-w-7xl bg-transparent mx-auto py-6 border border-t-0 border-b-0 border-gray-200" />
|
||
</section>
|
||
)
|
||
}
|