ourworld_web/www_projectmycelium_com
23
0
Fork 0
forked from emre/www_projectmycelium_com
Code Issues 4 Pull Requests Projects Releases Activity

feat: update network CTA with improved messaging and navigation

Browse Source 
- Changed heading from "Start" to "Connect" and refined description for clarity
- Replaced two-button layout with three-option navigation (Join Network, Deploy in Cloud, Host a Node)
- Updated button destinations and styling to better guide user journey
This commit is contained in:
sasha-astiadi
2025-11-14 16:16:08 +01:00
parent 1950342b7a
commit cf32cd081c
1 changed files with 18 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/network/CallToAction.tsx
View File

@@ -20,26 +20,31 @@ export function CallToAction() {
<Container className="relative"> <Container className="relative">
<div className="mx-auto max-w-3xl text-center"> <div className="mx-auto max-w-3xl text-center">
<h2 className="text-3xl lg:text-4xl font-medium tracking-tight text-white sm:text-4xl"> <h2 className="text-3xl lg:text-4xl font-medium tracking-tight text-white sm:text-4xl">
Choose How You Want to Start Choose How You Want to Connect
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg text-gray-300">
Use the network to connect workloads or host nodes to deepen mesh resilience and run your environments on your own hardware. Choose How You Want to Connect
Use the network to link environments, deploy workloads, or host nodes to strengthen the mesh and run on your own hardware.
</p> </p>
{/* ✅ Two cards, stacked center with spacing */} {/* ✅ Two cards, stacked center with spacing */}
<div className="mt-10 flex flex-wrap justify-center gap-x-10 gap-y-8"> <div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4">
<div className="flex flex-col items-center text-center max-w-xs"> <Button to="/network" variant="solid" color="cyan">
<Button to="/download" variant="solid" color="cyan" className="mt-4"> Join the Network
Get Mycelium Network </Button>
</Button>
</div>
<div className="flex flex-col items-center text-center max-w-xs"> <Button
<Button to="https://threefold.info/mycelium_network/docs/" as="a" target="_blank" variant="outline" color="white" className="mt-4"> to="/cloud"
Host a Node variant="outline"
</Button> color="white"
</div> >
Deploy in Cloud
</Button>
<a href="/node" className="text-cyan-400 hover:text-cyan-300 transition-colors">
Host a Node &rarr;
</a>
</div> </div>
</div> </div>
</Container> </Container>