refactor: improve CallToAction typography and AgentBento mobile layout across pages

- Added leading-normal to all CallToAction description paragraphs for better readability
- Changed AgentBento empty animation placeholder to hidden on mobile using hidden md:flex
- Reduced top margin from mt-8 to mt-6 for agents CallToAction CTA cards
- Changed "Follow Development" link margin from mt-5 to lg:mt-5 mt-0 for responsive spacing
- Applied leading-normal changes to agents, compute, gpu, home, network, nodes
This commit is contained in:
2025-11-18 12:50:36 +01:00
parent 8509b80f47
commit f9ee299362
8 changed files with 12 additions and 12 deletions

View File

@@ -123,7 +123,7 @@ export function AgentBento() {
<div className="w-full h-full object-cover"><card.animation /></div> <div className="w-full h-full object-cover"><card.animation /></div>
</div> </div>
) : ( ) : (
<div className="h-48 w-full flex items-center justify-center bg-transparent" /> <div className="hidden md:flex md:h-48 w-full items-center justify-center bg-transparent" />
)} )}
<div className="px-8 pt-4 pb-6"> <div className="px-8 pt-4 pb-6">

View File

@@ -41,15 +41,15 @@ export function CallToAction() {
Start with Mycelium Today Start with Mycelium Today
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal 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-2 text-lg text-gray-300"> <p className="mt-2 text-lg leading-normal 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-8 flex flex-wrap justify-center gap-x-10 gap-y-8"> <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"> <div className="flex flex-col items-center text-center max-w-xs">
<Button <Button
as="a" as="a"
@@ -75,7 +75,7 @@ export function CallToAction() {
href="https://threefold.info/mycelium_network/docs/" href="https://threefold.info/mycelium_network/docs/"
target="_blank" target="_blank"
rel="noopener noreferrer" 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" 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 Follow Development
<span aria-hidden="true"></span> <span aria-hidden="true"></span>

View File

@@ -43,7 +43,7 @@ export function CallToAction() {
Choose How You Want to Start Choose How You Want to Start
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal text-gray-300">
Host your own node to contribute capacity or deploy workloads using the Mycelium Cloud. Host your own node to contribute capacity or deploy workloads using the Mycelium Cloud.
You dont need to host before deploying, and you dont need to deploy before hosting. You dont need to host before deploying, and you dont need to deploy before hosting.

View File

@@ -43,7 +43,7 @@ export function CallToAction() {
Choose How You Want to Start Choose How You Want to Start
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal text-gray-300">
Use GPUs through Mycelium Cloud, or contribute GPU nodes to the mesh and run your own workloads. Use GPUs through Mycelium Cloud, or contribute GPU nodes to the mesh and run your own workloads.
</p> </p>

View File

@@ -43,11 +43,11 @@ export function CallToAction() {
Use the Mycelium Stack Your Way Use the Mycelium Stack Your Way
</H3> </H3>
<P className="mt-6 text-gray-300"> <P className="mt-6 leading-normal text-gray-300">
Deploy infrastructure, run workloads, connect environments, and build distributed AI systems, all on one network designed for autonomy and control. Deploy infrastructure, run workloads, connect environments, and build distributed AI systems, all on one network designed for autonomy and control.
</P> </P>
<P className="mt-4 text-gray-300"> <P className="mt-4 leading-normal text-gray-300">
Start wherever you are. Scale on your own terms. Start wherever you are. Scale on your own terms.
</P> </P>

View File

@@ -44,7 +44,7 @@ export function CallToAction() {
Choose How You Want to Connect Choose How You Want to Connect
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal text-gray-300">
Choose How You Want to Connect 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. Use the network to link environments, deploy workloads, or host nodes to strengthen the mesh and run on your own hardware.
</p> </p>

View File

@@ -39,7 +39,7 @@ export function CallToAction() {
Join Mycelium Grid Join Mycelium Grid
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal text-gray-300">
Be part of a global network that powers private, distributed Be part of a global network that powers private, distributed
infrastructure. Host a node, contribute resources, and earn rewards infrastructure. Host a node, contribute resources, and earn rewards
while expanding the sovereign digital grid. while expanding the sovereign digital grid.

View File

@@ -41,7 +41,7 @@ export function CallToAction() {
Choose How You Want to Start Choose How You Want to Start
</h2> </h2>
<p className="mt-6 text-lg text-gray-300"> <p className="mt-6 text-lg leading-normal text-gray-300">
Store data in your Mycelium Cloud environment Store data in your Mycelium Cloud environment
or host your own node for full sovereignty. or host your own node for full sovereignty.
</p> </p>