refactor: replace custom links with Button component in CallToAction components

- Replaced custom <a> tag with Button component (as="a", variant="link", color="cyan") in agents CallToAction
- Replaced Link component with Button component (variant="link", color="cyan") in network CallToAction
- Removed unused Link import from network CallToAction
- Standardized link styling across CallToAction components for consistency
This commit is contained in:
2025-11-19 17:51:30 +01:00
parent de5d990fc9
commit a8105a0551
2 changed files with 29 additions and 34 deletions

View File

@@ -48,39 +48,35 @@ export function CallToAction() {
Use todays components models, storage, compute, and network to deploy workloads, connect nodes, and prepare for the next generation of distributed AI.
</p>
{/* ✅ Two cards, stacked center with spacing */}
<div className="mt-6 flex flex-wrap justify-center gap-x-10 gap-y-8">
<div className="flex flex-col items-center text-center max-w-xs">
{/* ✅ Button row same structure as homepage CTA */}
<div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4">
<Button
as="a"
to="https://myceliumcloud.tf"
variant="solid"
color="cyan"
className="mt-4"
target="_blank"
rel="noopener noreferrer"
>
Deploy a Model
</Button>
</div>
<div className="flex flex-col items-center text-center max-w-xs">
<Button to="/nodes" variant="outline" color="white" className="mt-4">
<Button to="/nodes" variant="outline" color="white">
Host a Node
</Button>
</div>
<div className="flex flex-col items-center text-center max-w-xs">
<a
href="https://threefold.info/mycelium_network/docs/"
<Button
as="a"
to="https://threefold.info/mycelium_network/docs/"
variant="link"
color="cyan"
className="inline-flex items-center gap-1.5"
target="_blank"
rel="noopener noreferrer"
className="lg:mt-5 mt-0 font-semibold text-white underline underline-offset-4 decoration-white/70 hover:text-cyan-200 hover:decoration-cyan-200 transition-colors inline-flex items-center gap-1.5"
>
Follow Development
<span aria-hidden="true"></span>
</a>
</div>
</Button>
</div>
</div>
</Container>

View File

@@ -1,6 +1,5 @@
"use client";
import { Link } from 'react-router-dom';
import { Container } from '@/components/Container'
import { Button } from "@/components/Button";
@@ -66,9 +65,9 @@ Use the network to link environments, deploy workloads, or host nodes to strengt
Deploy in Cloud
</Button>
<Link to="/nodes" className="text-cyan-400 hover:text-cyan-300 transition-colors">
<Button to="/nodes" variant="link" color="cyan">
Host a Node &rarr;
</Link>
</Button>
</div>
</div>
</Container>