ourworld_web/www_projectmycelium_com
22
0
Fork 0
forked from emre/www_projectmycelium_com
Code Issues 5 Pull Requests 1 Projects Releases Activity

Compare commits

base: ourworld_web:09ac38f5988ae6c72c1661ef180417195b362607
Branches Tags
ourworld_web:main ourworld_web:development ourworld_web:development_ehab ourworld_web:development_logos ourworld_web:development_sasha ourworld_web:development_backup ourworld_web:development_v3 ourworld_web:main_backup ourworld_web:main_sasha_dark emre:development_sasha emre:development emre:development_backup emre:main emre:main_backup emre:main_sasha_dark
..
compare: ourworld_web:main
Branches Tags
ourworld_web:main ourworld_web:development ourworld_web:development_ehab ourworld_web:development_logos ourworld_web:development_sasha ourworld_web:development_backup ourworld_web:development_v3 ourworld_web:main_backup ourworld_web:main_sasha_dark emre:development_sasha emre:development emre:development_backup emre:main emre:main_backup emre:main_sasha_dark

12 Commits
09ac38f598 ... main

Author SHA1 Message Date
sasha-astiadi
67fb2fd4ac refactor: remove arrow icons and clean up "Explore Docs" button text across multiple hero sections 
- Removed arrow icon (→) from "Explore Docs" buttons in CloudHeroNew, GpuHero, and StorageHero components
- Removed ArrowRightIcon from HomeCTA "Explore Docs" button
- Fixed whitespace formatting in CloudArchitecture "Explore Docs" button
- Added comment block in Homepod for commented out "Explore Docs" button
 2025-11-24 15:07:56 +01:00
sasha-astiadi
3071e87a9d Merge branch 'development' 2025-11-24 14:56:34 +01:00
sasha-astiadi
a0fb98409f refactor: update CallToAction "Join the Network" button to scroll to download section instead of node-how-it-works 
- Changed smoothScrollToElement target from 'node-how-it-works' to 'download' section
- Maintained 1200ms scroll duration
 2025-11-24 14:50:19 +01:00
sasha-astiadi
c9335d2c5a refactor: update CallToAction "Join the Network" button to use smooth scroll instead of navigation link 
- Changed Button from navigation link with to="/network" to onClick handler with smooth scroll behavior
- Added smoothScrollToElement import from @/utils/scroll
- Implemented smooth scroll to #node-how-it-works section with 1200ms duration
- Removed to prop from Button component
 2025-11-24 14:40:44 +01:00
sasha-astiadi
05974f5b0e Merge branch 'development' 2025-11-24 14:17:42 +01:00
sasha-astiadi
6b4c7b3329 refactor: implement smart navigation for "Get Mycelium Connector" button with smooth scroll utility 
- Added smoothScrollToElement utility function in src/utils/scroll.ts with easeInOutQuad animation and configurable duration
- Changed Header and HeaderDark "Get Mycelium Connector" button from static /download link to onClick handler with conditional navigation
- Added handleGetConnectorClick function that scrolls to #download section when on /network page, otherwise navigates to /network
- Change
 2025-11-24 14:13:40 +01:00
sasha-astiadi
a22a8ddcc9 refactor: update navigation links in CallToAction and NodeHero components 
- Changed CallToAction "Join the Network" button from /network#download to /network
- Changed NodeHero "Explore Docs" button from #node-architecture anchor to external ThreeFold hosting FAQ link with target="_blank"
 2025-11-24 13:29:07 +01:00
sasha-astiadi
a00c090162 Merge branch 'development' 2025-11-24 13:10:41 +01:00
sasha-astiadi
8e621c28b3 refactor: update NodeHero "How it works" button to use smooth scroll with onClick handler instead of anchor link 
- Changed Button from anchor link with to="#node-getting-started" to onClick handler with smooth scroll behavior
- Added id="node-how-it-works" to NodeSteps section for scroll target
- Removed as="a" prop from Button component
- Implemented scrollIntoView with smooth behavior and start block positioning
 2025-11-24 13:09:22 +01:00
ehab-hassan
3a217c2d66 updated search keyword 2025-11-24 10:17:16 +02:00
ehab-hassan
ea8c3546c9 addedd png logo for google search 2025-11-23 13:20:37 +02:00
ehab-hassan
c784783242 added sitemap 2025-11-23 12:35:59 +02:00
19 changed files with 179 additions and 21 deletions
Expand all files Collapse all files

3
index.html
View File

@@ -2,12 +2,13 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/png" href="/favicon-32.png" sizes="32x32" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" /> <link rel="icon" type="image/x-icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="google-site-verification" content="rRrZkMEhdC4yFe_BrENEzYmy2bRfD-VE6RTRiDJNLkg" /> <meta name="google-site-verification" content="rRrZkMEhdC4yFe_BrENEzYmy2bRfD-VE6RTRiDJNLkg" />
<title>Project Mycelium - Built for Digital Sovereignty</title> <title>Project Mycelium - Built for Digital Sovereignty</title>
<meta name="description" content="Discover Project Mycelium. A sovereign peer-to-peer network for private communication, storage, and compute. Build and run your digital environment on infrastructure you control." /> <meta name="description" content="Discover Project Mycelium. A sovereign peer-to-peer network for private communication, storage, and compute. Build and run your digital environment on infrastructure you control." />
<meta name="keywords" content="Project Mycelium, Mycelium, digital sovereignty, decentralized network, peer-to-peer infrastructure, private storage, secure compute, sovereign cloud, edge cloud" /> <meta name="keywords" content="Project Mycelium, ProjectMycelium, projectmycelium, Mycelium, decentralized network, peer-to-peer infrastructure, private storage, secure compute, sovereign cloud, edge cloud" />
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;700&display=swap" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;700&display=swap" rel="stylesheet" />

BIN
public/favicon-32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

6
public/robots.txt Normal file
View File

@@ -0,0 +1,6 @@
User-agent: *
Allow: /
Sitemap: https://www.projectmycelium.com/sitemap.xml

59
public/sitemap.xml Normal file
View File

@@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://www.projectmycelium.com/</loc>
<changefreq>weekly</changefreq>
<priority>1.0</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/cloud</loc>
<changefreq>weekly</changefreq>
<priority>0.9</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/network</loc>
<changefreq>weekly</changefreq>
<priority>0.9</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/agents</loc>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/download</loc>
<changefreq>monthly</changefreq>
<priority>0.7</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/compute</loc>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/storage</loc>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/gpu</loc>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/pods</loc>
<changefreq>weekly</changefreq>
<priority>0.7</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/nodes</loc>
<changefreq>weekly</changefreq>
<priority>0.7</priority>
</url>
<url>
<loc>https://www.projectmycelium.com/mediakit</loc>
<changefreq>monthly</changefreq>
<priority>0.7</priority>
</url>
</urlset>

26
src/components/Header.tsx
View File

@@ -1,5 +1,6 @@
import { useState } from 'react' import { useState } from 'react'
import { Link } from 'react-router-dom' import { Link, useLocation, useNavigate } from 'react-router-dom'
import { smoothScrollToElement } from '@/utils/scroll'
import { Container } from './Container' import { Container } from './Container'
import { Button } from './Button' import { Button } from './Button'
import pmyceliumLogo from '../images/logos/mainlogo.svg' import pmyceliumLogo from '../images/logos/mainlogo.svg'
@@ -9,6 +10,17 @@ import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
export function Header() { export function Header() {
const [mobileMenuOpen, setMobileMenuOpen] = useState(false) const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
const navigate = useNavigate()
const location = useLocation()
const handleGetConnectorClick = () => {
if (location.pathname === '/network') {
smoothScrollToElement('download', 1200)
} else {
navigate('/network')
}
}
return ( return (
<header className="bg-white"> <header className="bg-white">
<nav className="border-b border-gray-100"> <nav className="border-b border-gray-100">
@@ -61,7 +73,7 @@ export function Header() {
> >
Deploy Now Deploy Now
</Button> </Button>
<Button to="/download" variant="solid" color="cyan"> <Button variant="solid" color="cyan" onClick={handleGetConnectorClick}>
Get Mycelium Connector Get Mycelium Connector
</Button> </Button>
</div> </div>
@@ -150,7 +162,15 @@ export function Header() {
> >
Start Deployment Start Deployment
</Button> </Button>
<Button to="/download" variant="solid" color="cyan" className="mt-4 w-full" onClick={() => setMobileMenuOpen(false)}> <Button
variant="solid"
color="cyan"
className="mt-4 w-full"
onClick={() => {
setMobileMenuOpen(false)
handleGetConnectorClick()
}}
>
Get Mycelium Connector Get Mycelium Connector
</Button> </Button>
</div> </div>

26
src/components/HeaderDark.tsx
View File

@@ -1,5 +1,6 @@
import { useState } from 'react' import { useState } from 'react'
import { Link } from 'react-router-dom' import { Link, useLocation, useNavigate } from 'react-router-dom'
import { smoothScrollToElement } from '@/utils/scroll'
import { Container } from './Container' import { Container } from './Container'
import { Button } from './Button' import { Button } from './Button'
import pmyceliumLogo from '../images/logos/mainlogo.svg' import pmyceliumLogo from '../images/logos/mainlogo.svg'
@@ -9,6 +10,17 @@ import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
export function HeaderDark() { export function HeaderDark() {
const [mobileMenuOpen, setMobileMenuOpen] = useState(false) const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
const navigate = useNavigate()
const location = useLocation()
const handleGetConnectorClick = () => {
if (location.pathname === '/network') {
smoothScrollToElement('download', 1200)
} else {
navigate('/network')
}
}
return ( return (
<header className="bg-[#111111]"> <header className="bg-[#111111]">
<nav className="border-b border-gray-800"> <nav className="border-b border-gray-800">
@@ -61,7 +73,7 @@ export function HeaderDark() {
> >
Deploy Now Deploy Now
</Button> </Button>
<Button to="/download" variant="solid" color="cyan"> <Button variant="solid" color="cyan" onClick={handleGetConnectorClick}>
Get Mycelium Connector Get Mycelium Connector
</Button> </Button>
</div> </div>
@@ -150,7 +162,15 @@ export function HeaderDark() {
> >
Start Deployment Start Deployment
</Button> </Button>
<Button to="/download" variant="solid" color="cyan" className="mt-4 w-full" onClick={() => setMobileMenuOpen(false)}> <Button
variant="solid"
color="cyan"
className="mt-4 w-full"
onClick={() => {
setMobileMenuOpen(false)
handleGetConnectorClick()
}}
>
Get Mycelium Connector Get Mycelium Connector
</Button> </Button>
</div> </div>

16
src/components/ui/floating-navbar.tsx
View File

@@ -6,9 +6,10 @@ import {
useScroll, useScroll,
useMotionValueEvent, useMotionValueEvent,
} from "motion/react"; } from "motion/react";
import { Link } from "react-router-dom"; import { Link, useLocation, useNavigate } from "react-router-dom";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { Button } from "../Button"; import { Button } from "../Button";
import { smoothScrollToElement } from "@/utils/scroll";
export const FloatingNav = ({ export const FloatingNav = ({
@@ -23,8 +24,17 @@ export const FloatingNav = ({
className?: string; className?: string;
}) => { }) => {
const { scrollYProgress } = useScroll(); const { scrollYProgress } = useScroll();
const [visible, setVisible] = useState(true); const [visible, setVisible] = useState(true);
const navigate = useNavigate();
const location = useLocation();
const handleGetConnectorClick = () => {
if (location.pathname === "/network") {
smoothScrollToElement("download", 1200);
} else {
navigate("/network");
}
};
useMotionValueEvent(scrollYProgress, "change", (current) => { useMotionValueEvent(scrollYProgress, "change", (current) => {
if (typeof current === "number") { if (typeof current === "number") {
@@ -80,7 +90,7 @@ export const FloatingNav = ({
> >
<span className="hidden sm:block text-sm">Docs</span> <span className="hidden sm:block text-sm">Docs</span>
</a> </a>
<Button to="/download" variant="solid" color="cyan"> <Button variant="solid" color="cyan" onClick={handleGetConnectorClick}>
Get Mycelium Connector Get Mycelium Connector
</Button> </Button>
</div> </div>

2
src/pages/cloud/CloudArchitecture.tsx
View File

@@ -76,7 +76,7 @@ export function CloudArchitecture() {
Get Started Get Started
</Button> </Button>
<Button variant="outline" color="white" href="/docs"> <Button variant="outline" color="white" href="/docs">
Explore Docs Explore Docs
</Button> </Button>
</div> </div>
</Container> </Container>

2
src/pages/cloud/CloudHeroNew.tsx
View File

@@ -47,7 +47,7 @@ export function CloudHeroNew() {
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
> >
Explore Docs <span aria-hidden="true">→</span> Explore Docs
</Button> </Button>
</div> </div>
</div> </div>

2
src/pages/gpu/GpuHero.tsx
View File

@@ -26,7 +26,7 @@ export function GpuHero() {
How it works How it works
</Button> </Button>
<Button to="#gpu-architecture" as="a" variant="outline"> <Button to="#gpu-architecture" as="a" variant="outline">
Explore Docs <span aria-hidden="true">→</span> Explore Docs
</Button> </Button>
</div> </div>
</div> </div>

2
src/pages/home/CallToAction.tsx
View File

@@ -51,7 +51,7 @@ export function CallToAction() {
</P> </P>
<div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4"> <div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4">
<Button to="/network#download" variant="solid" color="cyan"> <Button to="/network" variant="solid" color="cyan">
Join the Network Join the Network
</Button> </Button>

1
src/pages/home/archive/HomeCTA.tsx
View File

@@ -30,7 +30,6 @@ export function HomeCTA() {
{/* Button 2 */} {/* Button 2 */}
<button className="inline-flex items-center justify-between bg-white border border-gray-300 rounded-full px-6 py-3 text-sm font-semibold shadow-sm hover:border-cyan-500 transition"> <button className="inline-flex items-center justify-between bg-white border border-gray-300 rounded-full px-6 py-3 text-sm font-semibold shadow-sm hover:border-cyan-500 transition">
Explore Docs Explore Docs
<ArrowRightIcon className="h-4 w-4 ml-2 text-gray-700" />
</button> </button>
</div> </div>

4
src/pages/network/CallToAction.tsx
View File

@@ -2,6 +2,7 @@
import { Container } from '@/components/Container' import { Container } from '@/components/Container'
import { Button } from "@/components/Button"; import { Button } from "@/components/Button";
import { smoothScrollToElement } from "@/utils/scroll";
export function CallToAction() { export function CallToAction() {
return ( return (
@@ -50,7 +51,8 @@ Use the network to link environments, deploy workloads, or host nodes to strengt
{/* ✅ Two cards, stacked center with spacing */} {/* ✅ Two cards, stacked center with spacing */}
<div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4"> <div className="mt-10 flex flex-wrap justify-center items-center gap-x-6 gap-y-4">
<Button to="/network" variant="solid" color="cyan"> <Button variant="solid" color="cyan" onClick={() => smoothScrollToElement('download', 1200)}
>
Join the Network Join the Network
</Button> </Button>

7
src/pages/network/Hero.tsx
View File

@@ -1,6 +1,7 @@
import { useId } from 'react' import { useId } from 'react'
import { Container } from '@/components/Container' import { Container } from '@/components/Container'
import { Button } from '@/components/Button' import { Button } from '@/components/Button'
import { smoothScrollToElement } from '@/utils/scroll'
import phoneFrame from '../../images/phoneframe.png' import phoneFrame from '../../images/phoneframe.png'
import { H3, P import { H3, P
, Eyebrow } from "@/components/Texts"; , Eyebrow } from "@/components/Texts";
@@ -93,7 +94,11 @@ export function Hero() {
Your Pod is your personal gateway to the network. Your Pod is your personal gateway to the network.
</P> </P>
<div className="mt-8 flex flex-wrap gap-x-6 gap-y-4"> <div className="mt-8 flex flex-wrap gap-x-6 gap-y-4">
<Button to="/download" variant="solid" color="cyan"> <Button
variant="solid"
color="cyan"
onClick={() => smoothScrollToElement('download', 1200)}
>
Get Started Get Started
</Button> </Button>
<Button <Button

9
src/pages/nodes/NodeHero.tsx
View File

@@ -2,6 +2,7 @@
import { Button } from '@/components/Button' import { Button } from '@/components/Button'
import { Eyebrow, H3, P } from '@/components/Texts' import { Eyebrow, H3, P } from '@/components/Texts'
import { smoothScrollToElement } from '@/utils/scroll'
export function NodeHero() { export function NodeHero() {
return ( return (
@@ -28,10 +29,14 @@ export function NodeHero() {
The Mycelium Network runs on nodes hosted by people and organizations around the world. Each node adds capacity, resilience, and sovereignty, expanding a global network for private, distributed compute and AI. The Mycelium Network runs on nodes hosted by people and organizations around the world. Each node adds capacity, resilience, and sovereignty, expanding a global network for private, distributed compute and AI.
</P> </P>
<div className="mt-10 flex items-center gap-x-6"> <div className="mt-10 flex items-center gap-x-6">
<Button to="#node-getting-started" as="a" variant="solid" color="cyan"> <Button
variant="solid"
color="cyan"
onClick={() => smoothScrollToElement('node-how-it-works', 1200)}
>
How it works How it works
</Button> </Button>
<Button to="#node-architecture" as="a" variant="outline"> <Button to="https://threefold.info/mycelium_economics/docs/faq/hosting_faq" as="a" variant="outline" target="_blank">
Explore Docs Explore Docs
</Button> </Button>
</div> </div>

2
src/pages/nodes/NodeSteps.tsx
View File

@@ -37,7 +37,7 @@ const steps = [
export function NodeSteps() { export function NodeSteps() {
return ( return (
<section className="w-full max-w-8xl mx-auto bg-transparent"> <section id="node-how-it-works" className="w-full max-w-8xl mx-auto bg-transparent">
{/* Header spacing + borders */} {/* Header spacing + borders */}
<div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-100" /> <div className="max-w-7xl mx-auto py-6 border border-t-0 border-b-0 border-gray-100" />

3
src/pages/pods/Homepod.tsx
View File

@@ -45,9 +45,12 @@ export default function Homepod() {
> >
Join the Waitlist Join the Waitlist
</Button> </Button>
{/* The updated onClick handler calls the function
<Button to="#" variant="outline"> <Button to="#" variant="outline">
Explore Docs Explore Docs
</Button> </Button>
*/}
</div> </div>
</div> </div>
</div> </div>

2
src/pages/storage/StorageHero.tsx
View File

@@ -30,7 +30,7 @@ export function StorageHero() {
as="a" as="a"
variant="outline" variant="outline"
> >
Explore Docs <span aria-hidden="true">→</span> Explore Docs
</Button> </Button>
</div> </div>
</div> </div>

28
src/utils/scroll.ts Normal file
View File

@@ -0,0 +1,28 @@
export function smoothScrollToElement(id: string, duration = 800) {
const element = document.getElementById(id)
if (!element) return
const startY = window.scrollY || window.pageYOffset
const targetRect = element.getBoundingClientRect()
const targetY = startY + targetRect.top
const startTime = performance.now()
function easeInOutQuad(t: number) {
return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t
}
function step(currentTime: number) {
const elapsed = currentTime - startTime
const progress = Math.min(elapsed / duration, 1)
const eased = easeInOutQuad(progress)
const nextY = startY + (targetY - startY) * eased
window.scrollTo(0, nextY)
if (progress < 1) {
requestAnimationFrame(step)
}
}
requestAnimationFrame(step)
}