Compare commits
15 Commits
602b78b5bd
...
main
Author | SHA1 | Date | |
---|---|---|---|
1c2c274848 | |||
1577eb6c6c | |||
f4519ec8bf | |||
c09928018c | |||
54333f2bd5 | |||
e646198255 | |||
5f1774f03c | |||
d52190268a | |||
8b2bbb2536 | |||
6f8edae241 | |||
acbbc7445d | |||
6c3f1afecf | |||
7b5afa588e | |||
4cc20ac13f | |||
6116c5b87c |
115
README.md
115
README.md
@@ -1,83 +1,92 @@
|
|||||||
# Mycelium Cloud Website
|
# Project Mycelium Website
|
||||||
|
|
||||||
|
- **Repository:** [https://git.ourworld.tf/ourworld_web/www_project_mycelium/](https://git.ourworld.tf/ourworld_web/www_project_mycelium/)
|
||||||
|
|
||||||
|
- **Main Branch (Production):** [https://project.mycelium.tf/](https://project.mycelium.tf/)
|
||||||
|
- **Dev Branch (Staging):** [https://www2.project.mycelium.tf/](https://www2.project.mycelium.tf/)
|
||||||
|
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## About
|
||||||
|
|
||||||
This is the official website for Mycelium Cloud, built using Next.js and Tailwind CSS.
|
This is the official website for Mycelium Cloud, built using Next.js and Tailwind CSS.
|
||||||
|
|
||||||
## Getting Started
|
---
|
||||||
|
|
||||||
Follow these instructions to get a local copy up and running for development and testing purposes.
|
## Technologies
|
||||||
|
|
||||||
### Prerequisites
|
- **Framework**: [Next.js](https://nextjs.org/)
|
||||||
|
- **Language**: [TypeScript](https://www.typescriptlang.org/)
|
||||||
|
- **Styling**: [Tailwind CSS](https://tailwindcss.com/)
|
||||||
|
|
||||||
Make sure you have Node.js and npm installed on your machine. You can download them from [nodejs.org](https://nodejs.org/).
|
---
|
||||||
|
|
||||||
### Installation
|
## File Structure
|
||||||
|
|
||||||
|
- **Pages**: To edit the content of a specific page, navigate to `src/app/(main)/`.
|
||||||
|
- **Components**: Reusable components are located in `src/components/`.
|
||||||
|
- **Images and Videos**: Add or modify images and videos in the `public/` directory. Images are in `public/images/` and videos are in `public/videos/`.
|
||||||
|
- **CSS**: Global styles can be found in `src/styles/tailwind.css`. Most styling is done using Tailwind CSS utility classes directly in the `.tsx` files.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Branding
|
||||||
|
|
||||||
|
- **Font**: The primary font used is [Mulish](https://fonts.google.com/specimen/Mulish).
|
||||||
|
- **Logos**: Project logos are stored in `public/images/logos/`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Get Started
|
||||||
|
|
||||||
|
Follow these steps to get the project running locally:
|
||||||
|
|
||||||
|
1. **Install Dependencies**:
|
||||||
|
|
||||||
1. Clone the repository to your local machine.
|
|
||||||
2. Install the NPM packages:
|
|
||||||
```bash
|
```bash
|
||||||
npm install
|
npm install
|
||||||
```
|
```
|
||||||
|
|
||||||
### Running the Application
|
2. **Build the Project**:
|
||||||
|
|
||||||
To run the development server:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
Open [http://localhost:3000](http://localhost:3000) in your browser to see the result.
|
|
||||||
|
|
||||||
## Git Workflow
|
|
||||||
|
|
||||||
We follow a branching model to ensure code quality and a stable production environment. All new work should be done on a feature branch.
|
|
||||||
|
|
||||||
1. **Switch to the `development` branch** and make sure it's up to date:
|
|
||||||
```bash
|
```bash
|
||||||
git checkout development
|
npm run build
|
||||||
git pull origin development
|
|
||||||
```
|
```
|
||||||
|
|
||||||
2. **Create a new feature branch** for your changes:
|
3. **Start the Development Server**:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
git checkout -b your-feature-name
|
npm run start
|
||||||
```
|
```
|
||||||
|
|
||||||
3. **Make your changes and commit them**.
|
---
|
||||||
|
|
||||||
4. **Push your feature branch** to the remote repository:
|
## Contributing
|
||||||
```bash
|
|
||||||
git push origin your-feature-name
|
|
||||||
```
|
|
||||||
|
|
||||||
5. **Create a Pull Request** on GitHub from your feature branch to the `development` branch.
|
- **Never update the `main` branch directly.** All changes must be reviewed and merged by the team through a pull request.
|
||||||
|
- **Always work on the `development` branch.** Create a feature branch from `development` and submit your pull request to `development`.
|
||||||
|
- **Request a review.** After submitting your pull request, ask the team to review and accept it into the `main` branch.
|
||||||
|
|
||||||
6. After the pull request is reviewed and merged, the changes will be on the `development` branch. To deploy to production, the `development` branch will be merged into `main`.
|
---
|
||||||
|
|
||||||
## Project Structure
|
## Report an Error
|
||||||
|
|
||||||
Here is an overview of the key directories in the project:
|
To report an issue, please use the following link and provide the requested information:
|
||||||
|
|
||||||
- `src/app/(main)/page.tsx`
|
- **Issue Tracker**: [git.ourworld.tf/ourworld_web/HOME/issues/new](https://git.ourworld.tf/ourworld_web/HOME/issues/new) and tag **OW Website & Wiki Project 2025**
|
||||||
This is the main entry point for the homepage.
|
|
||||||
|
|
||||||
- `src/components/`
|
- See the current web rpoject on [OW Website & Wiki Project 2025](https://git.ourworld.tf/ourworld_web/-/projects/153)
|
||||||
This directory contains all the reusable React components used throughout the site. The main components rendered on the homepage (`src/app/(main)/page.tsx`) are:
|
|
||||||
- `HomeHero.tsx`
|
|
||||||
- `StackSection.tsx` (as `StackSectionPreview`)
|
|
||||||
- `BentoReviews.tsx`
|
|
||||||
- `WorldMap.tsx`
|
|
||||||
- `Steps.tsx`
|
|
||||||
- `Companies.tsx`
|
|
||||||
- `ClickableGallery.tsx`
|
|
||||||
- `CallToAction.tsx`
|
|
||||||
|
|
||||||
- `public/images/`
|
When reporting an issue, please include:
|
||||||
All static images are stored here. You can find logos, gallery images, and other visual assets in this folder.
|
|
||||||
|
|
||||||
- `public/videos/`
|
- **URL**: The page where the error occurred.
|
||||||
This folder contains video assets used on the site.
|
- **Repo**: The repository you are working with.
|
||||||
|
- **Branch**: The specific branch you are on.
|
||||||
|
- **Problem**: A detailed description of the problem.
|
||||||
|
|
||||||
## License
|
---
|
||||||
|
|
||||||
This site template is a commercial product and is licensed under the [Tailwind Plus license](https://tailwindcss.com/plus/license).
|
## Questions
|
||||||
|
|
||||||
|
If you have any questions, you can reach out to [sashaastiadi](https://git.ourworld.tf/sashaastiadi).
|
||||||
|
@@ -21,15 +21,12 @@ export default function Home() {
|
|||||||
<section id="home-hero">
|
<section id="home-hero">
|
||||||
<HomeHero />
|
<HomeHero />
|
||||||
</section>
|
</section>
|
||||||
<section id="technologies">
|
|
||||||
<StackSectionPreview />
|
|
||||||
</section>
|
|
||||||
<section id="bento-reviews">
|
|
||||||
<BentoReviews />
|
|
||||||
</section>
|
|
||||||
<section id="network">
|
<section id="network">
|
||||||
<WorldMap />
|
<WorldMap />
|
||||||
</section>
|
</section>
|
||||||
|
<section id="technologies">
|
||||||
|
<StackSectionPreview />
|
||||||
|
</section>
|
||||||
<section id="deploy">
|
<section id="deploy">
|
||||||
<Steps />
|
<Steps />
|
||||||
</section>
|
</section>
|
||||||
@@ -39,6 +36,9 @@ export default function Home() {
|
|||||||
<section id="clickable-gallery">
|
<section id="clickable-gallery">
|
||||||
<ClickableGallery />
|
<ClickableGallery />
|
||||||
</section>
|
</section>
|
||||||
|
<section id="bento-reviews">
|
||||||
|
<BentoReviews />
|
||||||
|
</section>
|
||||||
<section id="call-to-action">
|
<section id="call-to-action">
|
||||||
<CallToAction />
|
<CallToAction />
|
||||||
</section>
|
</section>
|
||||||
|
@@ -22,7 +22,7 @@ export function WorldMap() {
|
|||||||
{/* Top Left Intro Text */}
|
{/* Top Left Intro Text */}
|
||||||
<div className="absolute top-0 left-0 px-6 py-24 z-10 max-w-lg">
|
<div className="absolute top-0 left-0 px-6 py-24 z-10 max-w-lg">
|
||||||
<H4 color="light">Mycelium Network is Live.</H4>
|
<H4 color="light">Mycelium Network is Live.</H4>
|
||||||
<CP className="mt-6 text-base leading-relaxed font-light" color="light">
|
<CP className="hidden mt-6 text-base leading-relaxed font-light" color="light">
|
||||||
Mycelium Cloud's advancement technology enables anyone to deploy
|
Mycelium Cloud's advancement technology enables anyone to deploy
|
||||||
their own Internet infrastructure, anywhere.
|
their own Internet infrastructure, anywhere.
|
||||||
</CP>
|
</CP>
|
||||||
|
@@ -12,46 +12,45 @@ const items = [
|
|||||||
{
|
{
|
||||||
title: 'FungiStor',
|
title: 'FungiStor',
|
||||||
subtitle: 'Long-Term AI Memory',
|
subtitle: 'Long-Term AI Memory',
|
||||||
description: 'Quantum-safe permanent storage preserving AI knowledge forever. Zero-knowledge architecture with mathematical dispersal ensures immortality.',
|
description: 'Erasure coding + compression slash storage bloat by up to 10× vs basic replication. Source-encrypted shards are geo-dispersed—lose pieces, rebuild perfectly from a quorum.',
|
||||||
video: "/videos/fungistor.mp4",
|
video: "/videos/fungistor.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'HeroDB',
|
title: 'HeroDB',
|
||||||
subtitle: 'Active AI Memory',
|
subtitle: 'Active AI Memory',
|
||||||
description: 'High-performance datastore for AI working memory. Multi-modal indexing enables vector search with global accessibility.',
|
description: 'Multimodal vector+keyword retrieval makes RAG feel instant across text, image, audio. Time-aware, policy-guarded context keeps results fresh while access stays governed.',
|
||||||
video: "/videos/herodb.mp4",
|
video: "/videos/herodb.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'MOS Sandboxes',
|
title: 'MOS Sandboxes',
|
||||||
subtitle: 'Secure Agent Workspaces',
|
subtitle: 'Secure Agent Workspaces',
|
||||||
description: 'Lightweight isolated environments deploying globally in five seconds. Hardware-level isolation ensures maximum security for agents.',
|
description: 'Attested, signed workspaces spin up ≈5s worldwide—ready to execute. Hardware isolation and scoped egress: run hard, tear down clean, zero residue.',
|
||||||
video: "/videos/sandbox.mp4",
|
video: "/videos/sandbox.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Mycelium Mesh',
|
title: 'Mycelium Mesh',
|
||||||
subtitle: 'Secure Communication Network',
|
subtitle: 'Secure Communication Network',
|
||||||
description: 'Peer-to-peer overlay network with end-to-end encryption. Self-healing shortest-path routing creates resilient agentic communication.',
|
description: 'A private, public-key fabric with self-healing multi-path routing. Glides through NATs and firewalls—direct, low-latency, no middlemen.',
|
||||||
video: "/videos/mesh.mp4",
|
video: "/videos/mesh.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Deterministic Deployment',
|
title: 'Deterministic Deployment',
|
||||||
subtitle: 'Verifiable Code Execution',
|
subtitle: 'Verifiable Code Execution',
|
||||||
description: 'Cryptographic guarantee system ensuring deployed code matches specifications. Prevents supply-chain attacks with immutable trails.',
|
description: 'Declare intent, get a hash; remote attestation proves that’s what runs. Reproducible builds, signed artifacts, immutable logs—supply chain, sealed.',
|
||||||
video: "/videos/deterministic.mp4",
|
video: "/videos/deterministic.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Agent Coordination',
|
title: 'Agent Coordination',
|
||||||
subtitle: 'Sovereign Workflow Management',
|
subtitle: 'Sovereign Workflow Management',
|
||||||
description: 'User-centric orchestration where HERO agents coordinate worker fleets. Planetary-scale coordination with instant spawning.',
|
description: 'Your private agent conducts swarms of specialists in parallel. Policies fan out work; human checkpoints keep you in command.',
|
||||||
video: "/videos/agent.mp4",
|
video: "/videos/agent.mp4",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'Universal Interface Layer',
|
title: 'Universal Interface Layer',
|
||||||
subtitle: 'AI Service Gateway',
|
subtitle: 'AI Service Gateway',
|
||||||
description: 'Unified broker connecting agents to LLMs, APIs, and services. Integrated micropayments simplify development.',
|
description: 'One gateway to open-source LLMs, tools, APIs, and data—bring your own models & keys. Semantic retrieval, function calling, and metered micropayments built in.',
|
||||||
video: "/videos/universal.mp4",
|
video: "/videos/universal.mp4",
|
||||||
},
|
},
|
||||||
|
|
||||||
];
|
];
|
||||||
|
|
||||||
export function BentoReviews() {
|
export function BentoReviews() {
|
||||||
@@ -93,17 +92,16 @@ export function BentoReviews() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className="relative isolate pt-24 pb-12 bg-black text-center w-full lg:px-0 px-4">
|
<div className="relative isolate py-24 bg-black text-center w-full lg:px-0 px-4">
|
||||||
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
|
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
|
||||||
<div className="mx-auto max-w-5xl ">
|
<div className="mx-auto max-w-5xl ">
|
||||||
<H2 className="text-center">Mycelium Technologies</H2>
|
<H2 className="text-center">Augmented Intelligence Fabric</H2>
|
||||||
</div>
|
</div>
|
||||||
</FadeIn>
|
</FadeIn>
|
||||||
<FadeIn transition={{ duration: 0.8, delay: 0.2 }}>
|
<FadeIn transition={{ duration: 0.8, delay: 0.2 }}>
|
||||||
<div className="mx-auto max-w-4xl mt-6 mb-8">
|
<div className="mx-auto max-w-4xl mt-6 mb-8">
|
||||||
<P className="text-center" color="primary">
|
<P className="text-center" color="primary">
|
||||||
A robust infrastructure layer for autonomous AI agents, our technology stack
|
The sovereign substrate for autonomous AI. Stateless, geo-aware, end-to-end encrypted—and verifiable from intent to execution.
|
||||||
delivers a secure, efficient, and intuitive platform for deploying and managing AI agents at scale.
|
|
||||||
</P>
|
</P>
|
||||||
</div>
|
</div>
|
||||||
</FadeIn>
|
</FadeIn>
|
||||||
|
@@ -6,14 +6,14 @@ export function CallTo() {
|
|||||||
<div className="relative isolate overflow-hidden bg-gray-50/10 px-6 py-24 text-center shadow-md shadow-gray-900/5 sm:rounded-3xl sm:px-16 border border-gray-200">
|
<div className="relative isolate overflow-hidden bg-gray-50/10 px-6 py-24 text-center shadow-md shadow-gray-900/5 sm:rounded-3xl sm:px-16 border border-gray-200">
|
||||||
<div className="mx-auto max-w-4xl text-center">
|
<div className="mx-auto max-w-4xl text-center">
|
||||||
<H2 color="primary">
|
<H2 color="primary">
|
||||||
Say hello to Decentralized AI Agents that are Truly Yours
|
Are you Ready?
|
||||||
</H2>
|
</H2>
|
||||||
<P color="custom" className="mt-8 max-w-3xl">
|
<P color="custom" className="mt-8 max-w-3xl">
|
||||||
Why hand out your intelligence to centralized giants when you can build your own?
|
Why hand out your intelligence to centralized giants when you can build your own?
|
||||||
</P>
|
</P>
|
||||||
<div className="mt-10 flex items-center justify-center gap-x-6">
|
<div className="mt-10 flex items-center justify-center gap-x-6">
|
||||||
<a
|
<a
|
||||||
href="mailto:info@ourworld.tf"
|
href="https://calendly.com/sachao/30min"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="rounded-md bg-[#2F3178] px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-[#2F3178]/80 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#2F3178]"
|
className="rounded-md bg-[#2F3178] px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-[#2F3178]/80 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#2F3178]"
|
||||||
|
@@ -36,7 +36,7 @@ export function CallToAction() {
|
|||||||
<Button
|
<Button
|
||||||
variant="solid"
|
variant="solid"
|
||||||
color="cyan"
|
color="cyan"
|
||||||
href="mailto:info@ourworld.tf"
|
href="https://calendly.com/sachao/30min"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
>
|
>
|
||||||
|
@@ -52,14 +52,15 @@ export function ClickableGallery() {
|
|||||||
<div>
|
<div>
|
||||||
<div className="relative isolate pt-8 pb-0 bg-transparent text-center w-full">
|
<div className="relative isolate pt-8 pb-0 bg-transparent text-center w-full">
|
||||||
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
|
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
|
||||||
<div className="mx-auto max-w-5xl">
|
<div className="mx-auto max-w-5xl lg:mt-12">
|
||||||
<H2 className="text-center">One Agent, Endless Possibilities.</H2>
|
<H2 className="text-center">Agents with Endless Possibilities.</H2>
|
||||||
</div>
|
</div>
|
||||||
</FadeIn>
|
</FadeIn>
|
||||||
<FadeIn transition={{ duration: 0.8, delay: 0.2 }}>
|
<FadeIn transition={{ duration: 0.8, delay: 0.2 }}>
|
||||||
<div className="mx-auto max-w-4xl mt-6 lg:px-0 px-4">
|
<div className="mx-auto max-w-4xl mt-6 lg:px-0 px-4">
|
||||||
<P className="text-center" color="primary">
|
<P className="text-center" color="primary">
|
||||||
The future isn’t about more tools. It’s about one intelligent partner that can do it all. This is your gateway to creativity, automation, and discovery.
|
Your private agent coordinates a team of specialists that spin up on demand, collaborate across your world, and deliver end-to-end results.
|
||||||
|
Many agents, one intelligence—yours.
|
||||||
</P>
|
</P>
|
||||||
</div>
|
</div>
|
||||||
</FadeIn>
|
</FadeIn>
|
||||||
|
@@ -40,7 +40,7 @@ const row2 = logos.slice(6);
|
|||||||
|
|
||||||
export function Companies() {
|
export function Companies() {
|
||||||
return (
|
return (
|
||||||
<div id="companies" className="relative bg-black flex flex-col items-center justify-center w-full overflow-hidden antialiased lg:py-12 py-4 -top-20">
|
<div id="companies" className="relative bg-black flex flex-col items-center justify-center w-full overflow-hidden antialiased py-4 mb-12">
|
||||||
<div className="relative z-10 mx-auto w-full max-w-6xl p-4">
|
<div className="relative z-10 mx-auto w-full max-w-6xl p-4">
|
||||||
|
|
||||||
{/* Heading */}
|
{/* Heading */}
|
||||||
@@ -50,7 +50,7 @@ export function Companies() {
|
|||||||
animate={{ opacity: 1, y: 0 }}
|
animate={{ opacity: 1, y: 0 }}
|
||||||
transition={{ duration: 1 }}
|
transition={{ duration: 1 }}
|
||||||
>
|
>
|
||||||
<P className="text-gray-100 text-center mb-6">
|
<P className="hidden min-xl:text-gray-100 text-center mb-6">
|
||||||
Mycelium Cloud allows you to deploy and scale AI agents from top global providers on a decentralized, privacy-first infrastructure.
|
Mycelium Cloud allows you to deploy and scale AI agents from top global providers on a decentralized, privacy-first infrastructure.
|
||||||
</P>
|
</P>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
@@ -6,7 +6,6 @@ import { Container } from '@/components/Container'
|
|||||||
import { TextField } from '@/components/Fields'
|
import { TextField } from '@/components/Fields'
|
||||||
import { Logomark } from '@/components/Logo'
|
import { Logomark } from '@/components/Logo'
|
||||||
import { NavLinks } from '@/components/NavLinks'
|
import { NavLinks } from '@/components/NavLinks'
|
||||||
import { FadeIn } from '@/components/FadeIn'
|
|
||||||
import qrCode from '@/images/qr-code.svg'
|
import qrCode from '@/images/qr-code.svg'
|
||||||
|
|
||||||
function QrCodeBorder(props: React.ComponentPropsWithoutRef<'svg'>) {
|
function QrCodeBorder(props: React.ComponentPropsWithoutRef<'svg'>) {
|
||||||
@@ -24,61 +23,13 @@ function QrCodeBorder(props: React.ComponentPropsWithoutRef<'svg'>) {
|
|||||||
export function Footer() {
|
export function Footer() {
|
||||||
return (
|
return (
|
||||||
<footer id="footer" className="border-t border-gray-800">
|
<footer id="footer" className="border-t border-gray-800">
|
||||||
<FadeIn>
|
|
||||||
<Container>
|
<Container>
|
||||||
<div className="flex flex-col items-start justify-between gap-y-12 pt-12 pb-6 lg:flex-row lg:items-center lg:py-12">
|
<div className="flex justify-center py-8">
|
||||||
<div>
|
<p className="text-sm text-gray-400">
|
||||||
<div className="flex items-center text-white">
|
|
||||||
<Logomark className="h-10 w-10 flex-none fill-cyan-500" />
|
|
||||||
<div className="ml-4">
|
|
||||||
<p className="text-base font-semibold">Project Mycelium</p>
|
|
||||||
<p className="mt-1 text-sm">Unleash the Power of Decentralized Networks</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<nav className="mt-11 flex gap-8">
|
|
||||||
<NavLinks />
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
<div className="group relative -mx-4 flex items-center self-stretch p-4 transition-colors hover:bg-gray-800/50 sm:self-auto sm:rounded-2xl lg:mx-0 lg:self-auto lg:p-6">
|
|
||||||
<div className="relative flex h-24 w-24 flex-none items-center justify-center">
|
|
||||||
<QrCodeBorder className="absolute inset-0 h-full w-full stroke-gray-700 transition-colors group-hover:stroke-[#015eff]" />
|
|
||||||
<Image src={qrCode} alt="" unoptimized />
|
|
||||||
</div>
|
|
||||||
<div className="ml-8 lg:w-64">
|
|
||||||
<p className="text-base font-semibold text-white">
|
|
||||||
<Link href="https://threefoldfaq.crisp.help/en/">
|
|
||||||
<span className="absolute inset-0 sm:rounded-2xl" />
|
|
||||||
Talk to a human
|
|
||||||
</Link>
|
|
||||||
</p>
|
|
||||||
<p className="mt-1 text-sm text-gray-400">
|
|
||||||
Get in touch with us for any inquiries or questions.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col items-center border-t border-gray-800 pt-8 pb-12 md:flex-row-reverse md:justify-between md:pt-6">
|
|
||||||
{/* <form className="flex w-full justify-center md:w-auto">
|
|
||||||
<TextField
|
|
||||||
type="email"
|
|
||||||
aria-label="Email address"
|
|
||||||
placeholder="Email address"
|
|
||||||
autoComplete="email"
|
|
||||||
required
|
|
||||||
variant="dark"
|
|
||||||
className="w-60 min-w-0 shrink"
|
|
||||||
/>
|
|
||||||
<Button type="submit" color="cyan" className="ml-4 flex-none">
|
|
||||||
<span className="hidden lg:inline">Join our newsletter</span>
|
|
||||||
<span className="lg:hidden">Join newsletter</span>
|
|
||||||
</Button>
|
|
||||||
</form> */}
|
|
||||||
<p className="mt-6 text-sm text-gray-400 md:mt-0 ">
|
|
||||||
© Copyright OurWorld Holdings, {new Date().getFullYear()}. All rights reserved.
|
© Copyright OurWorld Holdings, {new Date().getFullYear()}. All rights reserved.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</Container>
|
</Container>
|
||||||
</FadeIn>
|
|
||||||
</footer>
|
</footer>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@@ -60,7 +60,7 @@ export function Header() {
|
|||||||
<nav>
|
<nav>
|
||||||
<Container className="relative z-50 flex justify-between py-4">
|
<Container className="relative z-50 flex justify-between py-4">
|
||||||
<div className="relative z-10 flex items-center gap-16">
|
<div className="relative z-10 flex items-center gap-16">
|
||||||
<Link href="/" aria-label="Home">
|
<Link href="/" aria-label="Home" className="hidden">
|
||||||
<img src="/images/logo.png" alt="Mycelium" className="h-10 w-auto" />
|
<img src="/images/logo.png" alt="Mycelium" className="h-10 w-auto" />
|
||||||
</Link>
|
</Link>
|
||||||
<div className="hidden lg:flex lg:gap-10">
|
<div className="hidden lg:flex lg:gap-10">
|
||||||
@@ -110,10 +110,10 @@ export function Header() {
|
|||||||
<NavLinks className="block text-base/7 tracking-tight" />
|
<NavLinks className="block text-base/7 tracking-tight" />
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-8 flex flex-col gap-4">
|
<div className="mt-8 flex flex-col gap-4">
|
||||||
<Button href="https://docs.ourworld.tf/mycelium_cloud/docs/" variant="outline" color="white" target="_blank" rel="noopener noreferrer">
|
<Button href="mailto:info@ourworld.tf" variant="outline" color="white" target="_blank" rel="noopener noreferrer">
|
||||||
Docs
|
Join the Waitlist
|
||||||
</Button>
|
</Button>
|
||||||
<Button href="https://www.mycelium.threefold.io/download/" color="cyan">Get Started</Button>
|
<Button href="https://calendly.com/sachao/30min" color="cyan">Book a Meeting</Button>
|
||||||
</div>
|
</div>
|
||||||
</PopoverPanel>
|
</PopoverPanel>
|
||||||
</>
|
</>
|
||||||
@@ -123,10 +123,10 @@ export function Header() {
|
|||||||
)}
|
)}
|
||||||
</Popover>
|
</Popover>
|
||||||
<div className="flex items-center gap-6 max-lg:hidden">
|
<div className="flex items-center gap-6 max-lg:hidden">
|
||||||
<Button href="https://docs.ourworld.tf/mycelium_cloud/docs/" variant="outline" color="white" target="_blank" rel="noopener noreferrer">
|
<Button href="mailto:info@ourworld.tf" variant="outline" color="white" target="_blank" rel="noopener noreferrer">
|
||||||
Docs
|
Join the Waitlist
|
||||||
</Button>
|
</Button>
|
||||||
<Button href="https://www.mycelium.threefold.io/download/" color="cyan">Get Started</Button>
|
<Button href="https://calendly.com/sachao/30min" color="cyan">Book a Meeting</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Container>
|
</Container>
|
||||||
|
@@ -32,7 +32,7 @@ export function HomeHero() {
|
|||||||
<div className="absolute inset-0 bg-black/60" />
|
<div className="absolute inset-0 bg-black/60" />
|
||||||
</div>
|
</div>
|
||||||
<div className="relative px-6 lg:px-8">
|
<div className="relative px-6 lg:px-8">
|
||||||
<div className="relative mt-4 mx-auto flex h-screen max-w-8xl items-center justify-center">
|
<div className="relative mx-auto flex h-screen max-w-8xl items-center justify-center">
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<div className="max-w-6xl">
|
<div className="max-w-6xl">
|
||||||
<H1 color="light">
|
<H1 color="light">
|
||||||
@@ -48,26 +48,13 @@ export function HomeHero() {
|
|||||||
</H1>
|
</H1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Mobile-only PL */}
|
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0 }}
|
initial={{ opacity: 0 }}
|
||||||
animate={{ opacity: 1 }}
|
animate={{ opacity: 1 }}
|
||||||
transition={{ duration: 1, delay: 1 }}
|
transition={{ duration: 1, delay: 1 }}
|
||||||
className="lg:hidden"
|
className="mt-12"
|
||||||
>
|
>
|
||||||
<PL className="mt-12 max-w-3xl text-center text-gray-100" color="light">
|
<PL className="mx-auto max-w-4xl text-center text-gray-100" color="light">
|
||||||
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
|
||||||
</PL>
|
|
||||||
</motion.div>
|
|
||||||
|
|
||||||
{/* Desktop-only PL */}
|
|
||||||
<motion.div
|
|
||||||
initial={{ opacity: 0 }}
|
|
||||||
animate={{ opacity: 1 }}
|
|
||||||
transition={{ duration: 1, delay: 1 }}
|
|
||||||
className="hidden lg:block"
|
|
||||||
>
|
|
||||||
<PL className="mt-12 max-w-4xl text-center text-gray-100 mx-auto" color="light">
|
|
||||||
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
Mycelium's advancements in Agentic infrastructure supports private, secure and autonomous Agents that connect, learn and grow with you.
|
||||||
</PL>
|
</PL>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
@@ -30,14 +30,13 @@ export function Steps() {
|
|||||||
const isInView = useInView(ref, { once: true });
|
const isInView = useInView(ref, { once: true });
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section id="benefits" ref={ref} className="relative bg-cover bg-center py-32 -top-20 text-white" style={{ backgroundImage: "url('/images/deployment.webp')" }}>
|
<section id="benefits" ref={ref} className="relative pt-12 pb-4 px-4 lg:px-12 text-white">
|
||||||
<div className="absolute inset-0 bg-black/60" />
|
<div className="relative px-6 lg:px-12">
|
||||||
<div className="relative px-6 lg:px-6">
|
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0, y: 20 }}
|
initial={{ opacity: 0, y: 20 }}
|
||||||
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
|
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
|
||||||
transition={{ duration: 0.8, delay: 0.1 }}
|
transition={{ duration: 0.8, delay: 0.1 }}
|
||||||
className="mx-auto max-w-5xl lg:mx-0"
|
className="mx-auto max-w-5xl text-center"
|
||||||
>
|
>
|
||||||
<H2 className="text-3xl font-medium tracking-tight" color="light">
|
<H2 className="text-3xl font-medium tracking-tight" color="light">
|
||||||
Deploy Scalable LLMs and AI Agents in Seconds
|
Deploy Scalable LLMs and AI Agents in Seconds
|
||||||
@@ -50,7 +49,7 @@ export function Steps() {
|
|||||||
initial={{ opacity: 0 }}
|
initial={{ opacity: 0 }}
|
||||||
animate={isInView ? { opacity: 1 } : { opacity: 0 }}
|
animate={isInView ? { opacity: 1 } : { opacity: 0 }}
|
||||||
transition={{ duration: 0.5, delay: 0.2, staggerChildren: 0.2 }}
|
transition={{ duration: 0.5, delay: 0.2, staggerChildren: 0.2 }}
|
||||||
className="mx-auto lg:mt-12 mt-8 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-8 text-base/7 sm:grid-cols-2 sm:gap-y-16 lg:mx-0 lg:max-w-none lg:grid-cols-3"
|
className="mx-auto lg:mt-12 mt-8 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-8 text-base/7 sm:grid-cols-2 sm:gap-y-16 lg:mx-12 lg:max-w-7xl lg:grid-cols-3"
|
||||||
>
|
>
|
||||||
{features.map((feature, index) => (
|
{features.map((feature, index) => (
|
||||||
<motion.li
|
<motion.li
|
||||||
@@ -58,7 +57,7 @@ export function Steps() {
|
|||||||
initial={{ opacity: 0, y: 20 }}
|
initial={{ opacity: 0, y: 20 }}
|
||||||
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
|
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
|
||||||
transition={{ duration: 0.5, delay: 0.3 + index * 0.2 }}
|
transition={{ duration: 0.5, delay: 0.3 + index * 0.2 }}
|
||||||
className="rounded-2xl border border-white/20 bg-black/20 lg:py-8 lg:px-8 py-6 px-6 backdrop-blur-sm transition-all duration-300 ease-in-out hover:scale-105 hover:border-white/40 hover:bg-black/40"
|
className="rounded-2xl border border-white/20 bg-black/30 lg:py-8 lg:px-8 py-6 px-6 backdrop-blur-sm transition-all duration-300 ease-in-out hover:scale-105 hover:border-white/40 hover:bg-black/40"
|
||||||
>
|
>
|
||||||
<feature.icon className="h-8 w-8 mb-4 text-white" />
|
<feature.icon className="h-8 w-8 mb-4 text-white" />
|
||||||
<CT as="span" className="font-semibold" color="light">{feature.name}</CT>
|
<CT as="span" className="font-semibold" color="light">{feature.name}</CT>
|
||||||
|
@@ -148,11 +148,11 @@ export function UseCases() {
|
|||||||
className="flex flex-col items-start justify-start pt-10 lg:pr-12"
|
className="flex flex-col items-start justify-start pt-10 lg:pr-12"
|
||||||
>
|
>
|
||||||
<H2 id="usecases-title" color="light" className="text-left">
|
<H2 id="usecases-title" color="light" className="text-left">
|
||||||
Mycelium Technologies
|
Augmented Intelligence Fabric
|
||||||
</H2>
|
</H2>
|
||||||
<P className="mt-4 text-left" color="light">
|
<P className="mt-4 text-left" color="light">
|
||||||
A robust infrastructure layer for autonomous AI agents, our technology stack
|
The sovereign substrate for autonomous AI.
|
||||||
delivers a secure, efficient, and intuitive platform for deploying and managing AI agents at scale.
|
Stateless, geo-aware, end-to-end encrypted—and verifiable from intent to execution.
|
||||||
</P>
|
</P>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
|
||||||
|
@@ -32,7 +32,7 @@ export function WorldMap() {
|
|||||||
className="max-w-xl"
|
className="max-w-xl"
|
||||||
>
|
>
|
||||||
<H2 color="light">Mycelium Network is Live.</H2>
|
<H2 color="light">Mycelium Network is Live.</H2>
|
||||||
<P className="mt-4 text-base leading-relaxed font-light" color="light">
|
<P className="hidden mt-4 text-base leading-relaxed font-light" color="light">
|
||||||
Mycelium Cloud's advancement technology enables anyone to deploy
|
Mycelium Cloud's advancement technology enables anyone to deploy
|
||||||
their own Internet infrastructure, anywhere.
|
their own Internet infrastructure, anywhere.
|
||||||
</P>
|
</P>
|
||||||
|
@@ -8,25 +8,25 @@ const stackData = [
|
|||||||
{
|
{
|
||||||
id: "agent",
|
id: "agent",
|
||||||
title: "Agent Layer",
|
title: "Agent Layer",
|
||||||
descriptionTitle: "Personal Agents - Secure & Sovereign",
|
descriptionTitle: "Your sovereign agent with private memory and permissioned data access—always under your control.",
|
||||||
description:
|
description:
|
||||||
"Personal AI agents operate as secure digital twins, providing tailored intelligent assistance. They interact with existing chat, MCP agents, and coding tools while maintaining sovereignty and ecosystem compatibility.",
|
"Choose from a wide library of open-source LLMs, paired with built-in semantic search and retrieval.\nIt coordinates across people, apps, and other agents to plan, create, and execute.\nIt operates inside a compliant legal & financial sandbox, ready for real-world transactions and operations.\nMore than just an assistant—an intelligent partner that learns and does your way.",
|
||||||
position: "top",
|
position: "top",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "ai",
|
id: "network",
|
||||||
title: "AI Layer",
|
title: "Network Layer",
|
||||||
descriptionTitle: "AI Agents & AI Brains + Mycelium Code & Compute Sandboxes",
|
descriptionTitle: "A global, end-to-end encrypted overlay that simply doesn’t break.",
|
||||||
description:
|
description:
|
||||||
"Intelligence core combining LLMs with specialized AI agents. Mycelium-powered sandboxes provide secure environments for development, testing, and compilation with active memory systems and unbreakable network architecture.",
|
"Shortest-path routing moves your traffic the fastest way, every time.\nInstant discovery with integrated DNS, semantic search, and indexing.\nA distributed CDN and edge delivery keep content available and tamper-resistant worldwide.\nBuilt-in tool services and secure coding sandboxes—seamless on phones, desktops, and edge.",
|
||||||
position: "middle",
|
position: "middle",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "cloud",
|
id: "cloud",
|
||||||
title: "Cloud Layer",
|
title: "Cloud Layer",
|
||||||
descriptionTitle: "Mycelium Compute & Storage - Decentralized Infrastructure Layer",
|
descriptionTitle: "An autonomous, stateless OS that enforces pre-deterministic deployments you define.",
|
||||||
description:
|
description:
|
||||||
"Foundation runs bare metal Zero OS enabling autonomous cloud. Decentralized infrastructure supports Web2, Web3, AI workloads with superior scalability. Built on twenty years cloud experience.",
|
"Workloads are cryptographically bound to your private key—location and access are yours.\nNo cloud vendor or middleman in the path: end-to-end ownership and isolation by default.\nGeo-aware placement delivers locality, compliance, and ultra-low latency where it matters.\nEncrypted, erasure-coded storage, decentralized compute and GPU on demand—including LLMs.",
|
||||||
position: "bottom",
|
position: "bottom",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
Reference in New Issue
Block a user