Files
www_projectmycelium_com/src/pages/home/HomeAurora.tsx
sasha-astiadi 0d9f357881 feat: add dark theme support and update homepage content
- Integrated next-themes for dark mode theming with default dark theme
- Added new UI components (GridBlink, Spotlight) and enhanced world map with cyan glow effects
- Updated homepage messaging to emphasize Mycelium as a living network with new audience imagery
2025-11-12 15:18:34 +01:00

55 lines
2.0 KiB
TypeScript

import { H1, H4, H5 } from "@/components/Texts"
import { Button } from "@/components/Button"
export function HomeAurora({ onGetStartedClick }: { onGetStartedClick: () => void }) {
return (
<div className="px-4">
{/* Boxed container */}
<div
className="relative mx-auto max-w-7xl border border-t-0 border-gray-100 bg-white overflow-hidden bg-contain bg-right bg-no-repeat"
style={{ backgroundImage: "url('/images/hero11.webp')" }}
>
{/* Inner padding */}
<div className="px-6 py-16 lg:py-32 ">
<div className="max-w-2xl lg:pl-6">
<div className="hidden sm:flex">
<div className="relative rounded-full px-3 py-1 text-sm/6 text-gray-500 ring-1 ring-gray-900/10 hover:ring-gray-900/20">
Deploying at scale?{' '}
<a href="#" className="font-semibold whitespace-nowrap text-cyan-600">
<span aria-hidden="true" className="absolute inset-0" />
Book a call <span>&rarr;</span>
</a>
</div>
</div>
<H1 className="mt-8">
MYCELIUM
</H1>
<H4 className="mt-8">
The Living Network of the Next Internet
</H4>
<H5 className="mt-8 text-lg text-gray-600">
A new internet is emerging private, distributed, and self-sovereign. Mycelium is the living network that makes it possible. A peer-to-peer foundation where people, data, and intelligence connect directly without intermediaries, without compromise.
</H5>
<div className="mt-10 flex items-center gap-x-6">
<Button
variant="solid"
color="cyan"
onClick={onGetStartedClick}
>
Start Hosting
</Button>
<Button to="#" variant="outline">
Deploy in Cloud
</Button>
</div>
</div>
</div>
</div>
</div>
)
}