refactor: reduce spacing and adjust typography in CallToAction and NetworkDownload

- Changed paragraph spacing from mt-6 to mt-2 in CallToAction for tighter layout
- Reduced top margin on cards container from mt-10 to mt-8
- Replaced "Follow Development" Button with styled anchor link featuring underline and arrow
- Added hover effects with cyan color transition to new anchor link
- Reduced heading size in NetworkDownload from text-5xl/6xl to text-4xl/5xl
This commit is contained in:
2025-11-17 16:05:54 +01:00
parent 8b04b668b6
commit 828fe93f46
2 changed files with 11 additions and 5 deletions

View File

@@ -44,12 +44,12 @@ export function CallToAction() {
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg text-gray-300">
The Agent Framework launches in H1 2026, but the foundation is ready now. The Agent Framework launches in H1 2026, but the foundation is ready now.
</p> </p>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-2 text-lg text-gray-300">
Use todays components models, storage, compute, and network to deploy workloads, connect nodes, and prepare for the next generation of distributed AI. Use todays components models, storage, compute, and network to deploy workloads, connect nodes, and prepare for the next generation of distributed AI.
</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-8 flex flex-wrap justify-center gap-x-10 gap-y-8">
<div className="flex flex-col items-center text-center max-w-xs"> <div className="flex flex-col items-center text-center max-w-xs">
<Button to="/deploy" variant="solid" color="cyan" className="mt-4"> <Button to="/deploy" variant="solid" color="cyan" className="mt-4">
Deploy a Model Deploy a Model
@@ -63,9 +63,15 @@ export function CallToAction() {
</div> </div>
<div className="flex flex-col items-center text-center max-w-xs"> <div className="flex flex-col items-center text-center max-w-xs">
<Button to="https://threefold.info/mycelium_network/docs/" as="a" target="_blank" variant="outline" color="white" className="mt-4"> <a
href="https://threefold.info/mycelium_network/docs/"
target="_blank"
rel="noopener noreferrer"
className="mt-5 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 Follow Development
</Button> <span aria-hidden="true"></span>
</a>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -54,7 +54,7 @@ export function NetworkDownload() {
initial={{ opacity: 0, y: 20 }} initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5 }} transition={{ duration: 0.5 }}
className="text-5xl font-medium tracking-tight text-gray-900 lg:text-6xl" className="text-4xl font-medium tracking-tight text-gray-900 lg:text-5xl"
> >
Download Mycelium Network Download Mycelium Network
</motion.h3> </motion.h3>