forked from emre/www_projectmycelium_com
refactor: improve hero components and naming consistency
- Renamed AgentsHeroAlt component to AgentHeroAlt for consistent singular naming - Updated hero section padding and spacing for consistent layout across GPU and Storage pages - Changed Storage hero image object-fit from cover to contain to match GPU hero styling - Removed redundant padding classes (sm:py-32, xl:pr-32) from hero components - Fixed indentation in AgentsPage component
This commit is contained in:
BIN
public/images/agenthero1.webp
Normal file
BIN
public/images/agenthero1.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
BIN
public/images/agents.png
Normal file
BIN
public/images/agents.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 MiB |
33
src/pages/agents/AgentHeroAlt.tsx
Normal file
33
src/pages/agents/AgentHeroAlt.tsx
Normal file
@@ -0,0 +1,33 @@
|
|||||||
|
'use client'
|
||||||
|
|
||||||
|
import { Button } from '../../components/Button'
|
||||||
|
import { Eyebrow, SectionHeader, P, H3 } from '../../components/Texts'
|
||||||
|
|
||||||
|
export function AgentHeroAlt() {
|
||||||
|
return (
|
||||||
|
<div className="relative bg-white lg:mt-10 mt-0">
|
||||||
|
<div className="relative h-80 overflow-hidden bg-transparent md:absolute md:right-0 md:h-full md:w-1/3 lg:w-2/3">
|
||||||
|
<img
|
||||||
|
alt=""
|
||||||
|
src="/images/agents.png"
|
||||||
|
className="size-full object-cover"
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className="relative mx-auto max-w-7xl py-24 sm:py-32 lg:px-8">
|
||||||
|
<div className="pr-6 pl-6 md:mr-auto md:w-2/3 md:pr-16 lg:w-1/2 lg:pl-0 lg:pr-24 xl:pr-32">
|
||||||
|
<Eyebrow className="text-base/7 font-semibold text-cyan-500">AGENT</Eyebrow>
|
||||||
|
<H3 as="h1" className="mt-2 text-gray-900">Sovereign AI Agents, Coming Soon.</H3>
|
||||||
|
<P className="mt-6 text-gray-600">
|
||||||
|
Hero is the autonomous agent layer for the Mycelium platform—trusted, policy-aware AI that runs on infrastructure you control and remembers what matters.
|
||||||
|
</P>
|
||||||
|
<div className="mt-8">
|
||||||
|
<Button href="#" variant="solid" color="cyan">
|
||||||
|
Join the Waitlist
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -3,13 +3,13 @@ import { DeploySection } from './DeploySection'
|
|||||||
import { GallerySection } from './GallerySection'
|
import { GallerySection } from './GallerySection'
|
||||||
import { Companies } from './Companies'
|
import { Companies } from './Companies'
|
||||||
import { BentoSection } from './BentoSection'
|
import { BentoSection } from './BentoSection'
|
||||||
import { AgentsHeroAlt } from './AgentsHeroAlt'
|
import { AgentHeroAlt } from './AgentHeroAlt'
|
||||||
|
|
||||||
export default function AgentsPage() {
|
export default function AgentsPage() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<AnimatedSection>
|
<AnimatedSection>
|
||||||
<AgentsHeroAlt />
|
<AgentHeroAlt />
|
||||||
</AnimatedSection>
|
</AnimatedSection>
|
||||||
|
|
||||||
<AnimatedSection>
|
<AnimatedSection>
|
||||||
|
|||||||
@@ -13,8 +13,8 @@ export function GpuHero() {
|
|||||||
className="size-full object-contain"
|
className="size-full object-contain"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="relative mx-auto max-w-7xl py-24 sm:py-32 lg:px-8 lg:py-40">
|
<div className="relative mx-auto max-w-7xl py-24 lg:py-32 lg:px-8">
|
||||||
<div className="pr-6 pl-6 md:mr-auto md:w-2/3 md:pr-16 lg:w-1/2 lg:pl-0 lg:pr-24 xl:pr-32">
|
<div className="pr-6 pl-6 md:mr-auto md:w-2/3 md:pr-16 lg:w-1/2 lg:pl-0 lg:pr-24 ">
|
||||||
<Eyebrow className="tracking-[0.35em] uppercase text-cyan-500">
|
<Eyebrow className="tracking-[0.35em] uppercase text-cyan-500">
|
||||||
Mycelium GPU
|
Mycelium GPU
|
||||||
</Eyebrow>
|
</Eyebrow>
|
||||||
|
|||||||
@@ -10,10 +10,10 @@ export function StorageHero() {
|
|||||||
<img
|
<img
|
||||||
alt="Mycelium Storage visual"
|
alt="Mycelium Storage visual"
|
||||||
src="/images/computehero11.webp"
|
src="/images/computehero11.webp"
|
||||||
className="size-full object-cover"
|
className="size-full object-contain"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="relative mx-auto max-w-7xl py-24 sm:py-32 lg:px-8 lg:py-40">
|
<div className="relative mx-auto max-w-7xl py-24 lg:py-32 lg:px-8">
|
||||||
<div className="pr-6 pl-6 md:mr-auto md:w-2/3 md:pr-16 lg:w-1/2 lg:pl-0 lg:pr-24 xl:pr-32">
|
<div className="pr-6 pl-6 md:mr-auto md:w-2/3 md:pr-16 lg:w-1/2 lg:pl-0 lg:pr-24 xl:pr-32">
|
||||||
<Eyebrow className="tracking-[0.35em] uppercase text-cyan-500">
|
<Eyebrow className="tracking-[0.35em] uppercase text-cyan-500">
|
||||||
Mycelium Storage
|
Mycelium Storage
|
||||||
|
|||||||
Reference in New Issue
Block a user