From def097276264ad89f1ee75b1e5e2f0c5363656d3 Mon Sep 17 00:00:00 2001 From: sasha-astiadi Date: Mon, 17 Nov 2025 13:01:56 +0100 Subject: [PATCH] feat: streamline cloud and pods pages with improved CTAs and content - Replaced CloudCodeTabs with static reserve image in CloudIntro - Added dynamic action buttons (Deploy, Follow Development, View Docs) to CloudIntro tabs - Removed CloudFeaturesLight section from CloudPage - Enhanced Pods CallToAction with benefits checklist and expanded early adopter messaging - Added CTA buttons to Homepod component with waitlist and docs links - Removed PodsBenefits section from PodsPage - Updated Homepod description --- src/pages/cloud/CloudIntro.tsx | 44 +++++++++++++++++++++++++++++++-- src/pages/cloud/CloudPage.tsx | 5 ---- src/pages/pods/CallToAction.tsx | 41 +++++++++++++++++++++++++++--- src/pages/pods/Homepod.tsx | 20 ++++++++++++--- src/pages/pods/PodsPage.tsx | 2 -- 5 files changed, 97 insertions(+), 15 deletions(-) diff --git a/src/pages/cloud/CloudIntro.tsx b/src/pages/cloud/CloudIntro.tsx index a17a4ff..20579fd 100644 --- a/src/pages/cloud/CloudIntro.tsx +++ b/src/pages/cloud/CloudIntro.tsx @@ -1,8 +1,8 @@ "use client"; import { useState } from "react"; -import { CloudCodeTabs } from "./CloudCodeTabs"; import { Eyebrow, H3, P } from "@/components/Texts"; +import { Button } from "@/components/Button"; const tabs = [ { @@ -59,9 +59,25 @@ const tabs = [ }, ]; +const tabButtons = { + kubernetes: { + primary: "Deploy a Cluster", + secondary: "Learn More", + }, + vdc: { + primary: "Follow Development", + secondary: "Learn More", + }, + qsfs: { + primary: "View Docs", + secondary: "Explore Integration", + }, +} as const; + export function CloudIntro() { const [active, setActive] = useState("kubernetes"); const current = tabs.find((t) => t.id === active)!.content; + const currentButtons = tabButtons[active as keyof typeof tabButtons]; return (
@@ -94,7 +110,11 @@ export function CloudIntro() { {/* Left: Code UI */}
- + Mycelium Cloud reserve
{/* Right: Tabs */} @@ -141,6 +161,26 @@ export function CloudIntro() { + {currentButtons && ( +
+ + + +
+ )} + diff --git a/src/pages/cloud/CloudPage.tsx b/src/pages/cloud/CloudPage.tsx index 99dcba0..438a6dd 100644 --- a/src/pages/cloud/CloudPage.tsx +++ b/src/pages/cloud/CloudPage.tsx @@ -2,7 +2,6 @@ import { AnimatedSection } from '../../components/AnimatedSection' import { CloudHeroNew } from './CloudHeroNew' import { CallToAction } from './CalltoAction' import { CloudIntro } from './CloudIntro' -import { CloudFeaturesLight } from './CloudFeaturesLight' import { CloudPros } from './CloudPros' @@ -18,10 +17,6 @@ export default function CloudPage() { - - - - diff --git a/src/pages/pods/CallToAction.tsx b/src/pages/pods/CallToAction.tsx index eb452bf..c8d6802 100644 --- a/src/pages/pods/CallToAction.tsx +++ b/src/pages/pods/CallToAction.tsx @@ -2,6 +2,16 @@ import { Button } from "@/components/Button"; import { Container } from "@/components/Container"; +import { CheckCircleIcon } from "@heroicons/react/20/solid"; + +const benefits = [ + 'Private chat and calls', + 'Calendar and file sync', + 'Secure team spaces', + 'Early AI Agent integration', +] + + export function CallToAction() { return ( @@ -38,11 +48,36 @@ export function CallToAction() {

- Join the First Wave + Be Among The First +

- Pods are launching soon. Be among the first to claim your private space in the new internet. + The first Pods are launching soon. + 10,000 early Pods will be available for early adopters. +

+ +
+
    + {benefits.map((benefit) => ( +
  • +
    • + ))} +
+
+ +

+ Next, Pods will support peer-to-peer AI Agents that live inside your environment. + Your own AI, powered by your data without any data leaks. Be among the first to claim + your private space on the Mycelium Network.

{/* ✅ Two cards, stacked center with spacing */} @@ -55,7 +90,7 @@ export function CallToAction() {
diff --git a/src/pages/pods/Homepod.tsx b/src/pages/pods/Homepod.tsx index 3717769..44305a6 100644 --- a/src/pages/pods/Homepod.tsx +++ b/src/pages/pods/Homepod.tsx @@ -1,6 +1,10 @@ import { H3, Eyebrow, P } from "@/components/Texts" +import { Button } from "@/components/Button" export default function Homepod() { + const onGetStartedClick = () => { + console.log("Get started clicked"); + }; return (
{/* Boxed container */} @@ -18,10 +22,20 @@ export default function Homepod() { Your Private Space in the New Internet

- Imagine having your own corner of the internet — private, secure, and always online. - A Pod is your personal digital space on the Mycelium Network. - It’s where your conversations, files, and digital tools live — owned by you, connected to others directly. + Pods are personal digital spaces on the Mycelium Network. They are private, persistent, and fully under your control. Run conversations, files, and tools directly on the network instead of through central servers

+
+ + +
diff --git a/src/pages/pods/PodsPage.tsx b/src/pages/pods/PodsPage.tsx index 824c354..e48507b 100644 --- a/src/pages/pods/PodsPage.tsx +++ b/src/pages/pods/PodsPage.tsx @@ -2,7 +2,6 @@ import Homepod from './Homepod'; import { PodsHow } from './PodsHow'; import { PodsFeatures } from './PodsFeatures'; import { PodsDesign } from './PodsDesign'; -import { PodsBenefits } from './PodsBenefits'; import { CallToAction } from './CallToAction'; import { PodsWhat } from './PodsWhat'; @@ -14,7 +13,6 @@ const PodsPage = () => { - );