Files
www_projectmycelium_com/src/pages/home/HomeAgent.tsx
sasha-astiadi ab5ac43793 feat: update website design and assets
- Replaced multiple hero and background images with new optimized versions
- Removed unused image assets from public/images directory
- Updated typography styles:
  - Removed italic styling from various text components
  - Made eyebrow text uppercase
  - Adjusted H1 font size from 6xl to 5xl on mobile
- Redesigned HomeAurora component with new layout and background
- Added Mulish as primary font family in Tailwind config
- Updated text formatting and spacing
2025-10-31 01:36:08 +01:00

66 lines
2.4 KiB
TypeScript

import { H2, P } from '@/components/Texts'
import { Button } from '@/components/Button'
import { LayoutTextFlip } from '@/components/ui/layout-text-flip' // make sure this import path is correct
export function HomeAgent() {
return (
<div className="relative isolate overflow-hidden bg-white">
<div className="px-6 py-24 sm:py-32 lg:px-8">
<div className="mx-auto max-w-4xl text-center">
<H2>
Deploy your own{" "}
<span className="text-left text-black font-medium text-7xl bg-clip-text bg-gradient-to-r from-blue-400 via-cyan-400 to-violet-400">
<LayoutTextFlip
text=""
words={[
"GPT-5",
"Claude 3.5",
"Gemini 1.5",
"Mistral 7B",
"Llama 3.1",
"AI Agents",
]}
/>
</span>
</H2>
<P className="mx-auto mt-6 max-w-xl text-lg/8 text-pretty text-gray-600">
Mycelium delivers enterprise-grade AI experiences that run on sovereign compute and the Mycelium Network, so production agents can reason over private data, collaborate across sites, and stay fully under your governance.
</P>
<div className="mt-10 flex items-center justify-center gap-x-6">
<Button variant="solid" color="cyan" href="/signup">
Get started
</Button>
<a href="/agents" className="text-sm/6 font-semibold text-gray-900 hover:text-gray-600">
Learn more <span aria-hidden="true"></span>
</a>
</div>
</div>
</div>
<svg
viewBox="0 0 1024 1024"
aria-hidden="true"
className="absolute top-1/2 left-1/2 -z-10 size-256 -translate-x-1/2 mask-[radial-gradient(closest-side,white,transparent)]"
>
<circle
r={512}
cx={512}
cy={512}
fill="url(#8d958450-c69f-4251-94bc-4e091a323369)"
fillOpacity="0.7"
/>
<defs>
<radialGradient id="8d958450-c69f-4251-94bc-4e091a323369" cx="50%" cy="50%" r="50%">
<stop offset="0%" stopColor="#60A5FA" /> {/* blue-400 */}
<stop offset="50%" stopColor="#06B6D4" /> {/* cyan-500 */}
<stop offset="100%" stopColor="#A78BFA" /> {/* violet-400 */}
</radialGradient>
</defs>
</svg>
</div>
)
}