8 Commits

Author SHA1 Message Date
1f11ca5319 feat: update cloud hosting capabilities section with audience-focused messaging
- Reorganized features to target specific user personas (DevOps, Security, Data, AI/ML teams)
- Updated feature descriptions to emphasize technical benefits and security posture
- Changed section eyebrow from "DEPLOY" to "CAPABILITIES" for clearer positioning
2025-11-04 14:05:27 +01:00
3e99e85e48 feat: enhance CloudHero messaging and formatting
- Added tagline "Works Alone. Works Together." with explanation of Mycelium Cloud's flexibility
- Simplified "Explore Docs" button text to "Documentation"
- Fixed indentation for improved code readability
2025-11-04 14:01:17 +01:00
b39694ea24 feat: update CTA button text from "Start Deployment" to "Get Started" 2025-11-04 13:35:53 +01:00
363b822d8b feat: refine benefits section messaging and ordering
- Reordered features to lead with "Unbreakable by Design" for stronger impact
- Simplified benefit descriptions for clarity and conciseness
- Updated section heading from "Why It Changes Everything" to "Why It Matters"
2025-11-04 13:35:22 +01:00
00802c7064 feat: reorder slider items and update ecosystem messaging
- Moved Compute/Storage/GPU to first position in slider
- Updated heading from "Mycelium Products" to "Mycelium Components"
- Changed description to emphasize Agents instead of "intelligent automation"
2025-11-04 13:33:53 +01:00
e45ca7c86f feat: reorder HomeSlider section before HomeBenefits 2025-11-04 13:33:47 +01:00
664897ee19 refactor: simplify StackSection description text 2025-11-04 13:31:29 +01:00
91d249f097 feat: update homepage content and section ordering
- Revised hosting section description to emphasize decentralized grid and user control
- Swapped order of StackSectionLight and HomeHostingDark sections
- Enhanced Kubernetes feature description with additional context
2025-11-04 13:29:37 +01:00
8 changed files with 52 additions and 45 deletions

View File

@@ -22,8 +22,13 @@ export function CloudHeroNew() {
</H5> </H5>
<H5 className="mt-4 text-lg text-gray-600"> <H5 className="mt-4 text-lg text-gray-600">
Deploy K3s clusters on a global, self-healing mesh network. Deploy K3s clusters on a global, self-healing mesh network.
Your workloads run on sovereign, encrypted infrastructure, without centralized cloud control. Your workloads run on sovereign, encrypted infrastructure, without centralized cloud control.
</H5> </H5>
<H5 className="mt-4 text-sm text-gray-600">
Works Alone. Works Together.
Mycelium Cloud can run on any network fabric, or pair with Mycelium Network
for sovereign connectivity.
</H5>
<div className="mt-10 flex items-center gap-x-6"> <div className="mt-10 flex items-center gap-x-6">
<Button <Button
to="#" to="#"
@@ -34,7 +39,7 @@ Your workloads run on sovereign, encrypted infrastructure, without centralized c
Get started Get started
</Button> </Button>
<Button to="#" variant="outline"> <Button to="#" variant="outline">
Explore Docs <span aria-hidden="true"> </span> Documentation <span aria-hidden="true"> </span>
</Button> </Button>
</div> </div>
</div> </div>

View File

@@ -8,24 +8,28 @@ import { CP, CT, Eyebrow, H3, P } from '../../components/Texts'
const features = [ const features = [
{ {
Eyebrow: 'DevOps / Cloud teams',
name: 'Kubernetes Clusters', name: 'Kubernetes Clusters',
description: 'Deploy and scale containerized apps across your own hardware.', description: 'Deterministic K3s workloads across sovereign hardware.',
icon: ServerIcon, icon: ServerIcon,
}, },
{ {
name: 'AI Agents & LLM Runtimes', Eyebrow: 'Security & infrastructure',
description: 'Run open-source models locally, securely, and offline.', name: 'Encrypted Mesh Networking',
icon: ArrowPathIcon, description: 'No public ingress, no exposed attack surface, zero-trust routing.',
icon: ShieldCheckIcon,
}, },
{ {
Eyebrow: 'Data-driven teams',
name: 'S3-Compatible Storage', name: 'S3-Compatible Storage',
description: 'Your own personal over-the-network drive, encrypted end-to-end.', description: 'Distributed storage with erasure coding and residency control.',
icon: CloudArrowUpIcon, icon: CloudArrowUpIcon,
}, },
{ {
name: 'Mesh VPN & Zero-Trust Networking', Eyebrow: 'AI / ML workloads',
description: 'Securely connect all your devices and remote locations.', name: 'GPU-Ready',
icon: ShieldCheckIcon, description: 'Scale inference & training on demand.',
icon: ArrowPathIcon,
}, },
] ]
@@ -33,7 +37,7 @@ export function CloudHosting() {
return ( return (
<div className="relative bg-white py-24 lg:py-32"> <div className="relative bg-white py-24 lg:py-32">
<div className="mx-auto max-w-md px-6 text-center sm:max-w-3xl lg:max-w-7xl lg:px-8"> <div className="mx-auto max-w-md px-6 text-center sm:max-w-3xl lg:max-w-7xl lg:px-8">
<Eyebrow>DEPLOY</Eyebrow> <Eyebrow>CAPABILITIES</Eyebrow>
<H3 className="mt-2">What You Can Run on Mycelium Cloud</H3> <H3 className="mt-2">What You Can Run on Mycelium Cloud</H3>
<P className="mx-auto mt-5 max-w-prose"> <P className="mx-auto mt-5 max-w-prose">
Turn your own machines into real, production-grade infrastructure. Mycelium handles the networking, Turn your own machines into real, production-grade infrastructure. Mycelium handles the networking,
@@ -48,6 +52,7 @@ export function CloudHosting() {
<span className="absolute -top-6 left-1/2 -translate-x-1/2 transform rounded-xl bg-cyan-500 hover:bg-cyan-400 p-3 shadow-lg"> <span className="absolute -top-6 left-1/2 -translate-x-1/2 transform rounded-xl bg-cyan-500 hover:bg-cyan-400 p-3 shadow-lg">
<feature.icon aria-hidden="true" className="size-8 text-white" /> <feature.icon aria-hidden="true" className="size-8 text-white" />
</span> </span>
<Eyebrow>{feature.Eyebrow}</Eyebrow>
<CT as="h3" className="mt-4"> <CT as="h3" className="mt-4">
{feature.name} {feature.name}
</CT> </CT>

View File

@@ -24,7 +24,7 @@ export function CallToAction() {
</p> </p>
<div className="mt-10 flex flex-wrap justify-center gap-x-6 gap-y-4"> <div className="mt-10 flex flex-wrap justify-center gap-x-6 gap-y-4">
<Button to="/cloud" variant="solid" color="cyan"> <Button to="/cloud" variant="solid" color="cyan">
Start Deployment Get Started
</Button> </Button>
<Button <Button
to="https://threefold.info/mycelium_network/docs/" to="https://threefold.info/mycelium_network/docs/"

View File

@@ -7,28 +7,29 @@ import { H2, P, CP, Eyebrow } from '@/components/Texts'
export function HomeBenefits() { export function HomeBenefits() {
const features = [ const features = [
{
title: "Unbreakable by Design",
description:
"No central cloud to censor or fail. The network heals itself.",
image: "/images/benefits/energy.webp",
},
{ {
title: "Sovereign by Default", title: "Sovereign by Default",
description: description:
"Own your infrastructure and your data. Mycelium Cloud eliminates dependency on centralized providers, giving you full digital sovereignty.", "Identity, compute, and data belong to you cryptographically.",
image: "/images/benefits/sovereign.webp", image: "/images/benefits/sovereign.webp",
}, },
{ {
title: "Hackable & Open", title: "Hackable & Open",
description: description:
"Open source and hackable by design. Learn, build, and experiment without permission.", "Learn, build, and experiment without permission.",
image: "/images/benefits/autonomous.webp", image: "/images/benefits/autonomous.webp",
}, },
{
title: "Unbreakable by Design",
description:
"Distributed nodes make it resilient to attacks and failures. The network heals itself.",
image: "/images/benefits/energy.webp",
},
{ {
title: "Cost & Energy Efficient", title: "Cost & Energy Efficient",
description: description:
"Distributed hardware eliminates hyperscale overhead. Pure compute power at a fraction of traditional cloud costs.", "Distributed hardware eliminates hyperscale overhead.",
image: "/images/benefits/cost.webp", image: "/images/benefits/cost.webp",
}, },
]; ];
@@ -39,7 +40,7 @@ export function HomeBenefits() {
Benefits Benefits
</Eyebrow> </Eyebrow>
<H2 className="text-3xl lg:text-5xl lg:leading-tight max-w-5xl mx-auto text-center tracking-tight font-medium text-black dark:text-white"> <H2 className="text-3xl lg:text-5xl lg:leading-tight max-w-5xl mx-auto text-center tracking-tight font-medium text-black dark:text-white">
Why It Changes Everything Why It Matters
</H2> </H2>
<P className=" max-w-3xl my-4 mx-auto text-center text-gray-600"> <P className=" max-w-3xl my-4 mx-auto text-center text-gray-600">

View File

@@ -10,7 +10,7 @@ import { DarkCard } from '../../components/ui/cards'
const features = [ const features = [
{ {
name: 'Kubernetes Clusters', name: 'Kubernetes Clusters',
description: 'Deploy and scale containerized apps across your own hardware.', description: 'Deploy and scale containerized apps across your own hardware. enabling a world of possibilities..',
icon: CubeIcon, icon: CubeIcon,
}, },
{ {
@@ -37,9 +37,7 @@ export function HomeHostingDark() {
<Eyebrow>DEPLOY</Eyebrow> <Eyebrow>DEPLOY</Eyebrow>
<H3 className="mt-2 text-gray-200">Run Real Infrastructure on Your Own Hardware</H3> <H3 className="mt-2 text-gray-200">Run Real Infrastructure on Your Own Hardware</H3>
<P className="mx-auto mt-5 max-w-prose text-gray-400"> <P className="mx-auto mt-5 max-w-prose text-gray-400">
Turn your own machines into real, production-grade infrastructure. Mycelium handles the networking, Build and run production-grade workloads on hardware you control, whether its your own node or capacity from the decentralized grid. Mycelium handles the networking, orchestration, and security layers, so you can deploy services the same way you would on a public cloud, without giving your data or control to anyone.
orchestration, and security layers, so you can deploy services the same way you would on public cloud without
giving your data or control to anyone.
</P> </P>
<div className="mt-16"> <div className="mt-16">
<div className="grid grid-cols-1 gap-12 lg:grid-cols-4"> <div className="grid grid-cols-1 gap-12 lg:grid-cols-4">

View File

@@ -26,22 +26,22 @@ export default function HomePage() {
<WorldMap /> <WorldMap />
</AnimatedSection> </AnimatedSection>
<AnimatedSection>
<StackSectionLight />
</AnimatedSection>
<AnimatedSection> <AnimatedSection>
<HomeHostingDark /> <HomeHostingDark />
</AnimatedSection> </AnimatedSection>
<AnimatedSection> <AnimatedSection>
<HomeBenefits /> <StackSectionLight />
</AnimatedSection> </AnimatedSection>
<AnimatedSection ref={sliderRef}> <AnimatedSection ref={sliderRef}>
<HomeSlider /> <HomeSlider />
</AnimatedSection> </AnimatedSection>
<AnimatedSection>
<HomeBenefits />
</AnimatedSection>
<AnimatedSection> <AnimatedSection>
<HomeComparisonTable /> <HomeComparisonTable />
</AnimatedSection> </AnimatedSection>

View File

@@ -15,11 +15,11 @@ export function HomeSlider() {
Ecosystem Ecosystem
</Eyebrow> </Eyebrow>
<H3 className="text-left text-white"> <H3 className="text-left text-white">
Discover the Mycelium Products Discover Mycelium Components
</H3> </H3>
<div className="mt-4 max-w-3xl"> <div className="mt-4 max-w-3xl">
<P className="text-left text-neutral-400"> <P className="text-left text-neutral-400">
From compute and networking to intelligent automation, these components can be used on its own or combined into a fully sovereign cloud. From compute and networking to Agents, these components can be used on its own or combined into a fully sovereign cloud.
</P> </P>
</div> </div>
</div> </div>
@@ -35,6 +35,14 @@ import cloudImage from "/images/pages/cloud.webp";
import computeImage from "/images/pages/compute.webp"; import computeImage from "/images/pages/compute.webp";
const data = [ const data = [
{
category: "Resources",
title: "Compute / Storage / GPU",
description: "The resource layers powering the stack.",
src: "/images/pages/compute.png",
bg: computeImage,
link: "/compute",
},
{ {
category: "Cloud", category: "Cloud",
title: "Mycelium Cloud", title: "Mycelium Cloud",
@@ -59,12 +67,4 @@ const data = [
bg: agentImage, bg: agentImage,
link: "/agent", link: "/agent",
}, },
{
category: "Resources",
title: "Compute / Storage / GPU",
description: "The resource layers powering the stack.",
src: "/images/pages/compute.png",
bg: computeImage,
link: "/compute",
},
]; ];

View File

@@ -63,9 +63,7 @@ export function StackSectionLight() {
<FadeIn> <FadeIn>
<P color="dark" className="mt-6 text-gray-600"> <P color="dark" className="mt-6 text-gray-600">
Project Mycelium unifies compute, storage, networking, and AI into a resilient Mycelium unifies compute, storage, networking, and AI into a self-governing comprehensive decentralized infrastructure fabric.
ecosystem that preserves data sovereignty, powers seamless collaboration,
and keeps every layer of your infrastructure secure end to end on decentralized infrastructure.
</P> </P>
</FadeIn> </FadeIn>
</div> </div>