ourworld_web/www_mycelium_cloud2
22
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

ok

Browse Source
This commit is contained in:
sasha-astiadi
2025-09-29 19:13:25 +02:00
parent 6116c5b87c
commit 4cc20ac13f
7 changed files with 19 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/layout.tsx
View File

@@ -1,4 +1,5 @@
import { type Metadata } from 'next'
import { Footer } from '@/components/Footer'
import { Mulish } from 'next/font/google'
import clsx from 'clsx'
@@ -26,7 +27,7 @@ export default function RootLayout({
}) {
return (
<html lang="en" className={clsx('antialiased', mulish.variable)}>
<body className="bg-black text-white">{children}</body>
<body className="bg-black text-white">{children}<Footer /></body>
</html>
)
}

2
src/components/CallTo.tsx
View File

@@ -6,7 +6,7 @@ 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="mx-auto max-w-4xl text-center">
<H2 color="primary">
Say hello to Decentralized AI Agents that are Truly Yours
Are you Ready?
</H2>
<P color="custom" className="mt-8 max-w-3xl">
Why hand out your intelligence to centralized giants when you can build your own?

7
src/components/ClickableGallery.tsx
View File

@@ -52,14 +52,15 @@ export function ClickableGallery() {
<div>
<div className="relative isolate pt-8 pb-0 bg-transparent text-center w-full">
<FadeIn transition={{ duration: 0.8, delay: 0.1 }}>
<div className="mx-auto max-w-5xl">
<H2 className="text-center">One Agent, Endless Possibilities.</H2>
<div className="mx-auto max-w-5xl lg:mt-12">
<H2 className="text-center">Agents with Endless Possibilities.</H2>
</div>
</FadeIn>
<FadeIn transition={{ duration: 0.8, delay: 0.2 }}>
<div className="mx-auto max-w-4xl mt-6 lg:px-0 px-4">
<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>
</div>
</FadeIn>

4
src/components/Companies.tsx
View File

@@ -40,7 +40,7 @@ const row2 = logos.slice(6);
export function Companies() {
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 -top-20">
<div className="relative z-10 mx-auto w-full max-w-6xl p-4">
{/* Heading */}
@@ -50,7 +50,7 @@ export function Companies() {
animate={{ opacity: 1, y: 0 }}
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.
</P>
</motion.div>

53
src/components/Footer.tsx
View File

@@ -6,7 +6,6 @@ import { Container } from '@/components/Container'
import { TextField } from '@/components/Fields'
import { Logomark } from '@/components/Logo'
import { NavLinks } from '@/components/NavLinks'
import { FadeIn } from '@/components/FadeIn'
import qrCode from '@/images/qr-code.svg'
function QrCodeBorder(props: React.ComponentPropsWithoutRef<'svg'>) {
@@ -24,61 +23,13 @@ function QrCodeBorder(props: React.ComponentPropsWithoutRef<'svg'>) {
export function Footer() {
return (
<footer id="footer" className="border-t border-gray-800">
<FadeIn>
<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="hidden">
<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 ">
<div className="flex justify-center py-8">
<p className="text-sm text-gray-400">
&copy; Copyright OurWorld Holdings, {new Date().getFullYear()}. All rights reserved.
</p>
</div>
</Container>
</FadeIn>
</footer>
)
}

19
src/components/HomeHero.tsx
View File

@@ -32,7 +32,7 @@ export function HomeHero() {
<div className="absolute inset-0 bg-black/60" />
</div>
<div className="relative px-6 lg:px-8">
<div className="relative -top-15 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="max-w-5xl">
<H1 color="light">
@@ -48,30 +48,17 @@ export function HomeHero() {
</H1>
</div>
{/* Mobile-only PL */}
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 1, delay: 1 }}
className="lg:hidden"
className="mt-12"
>
<PL className="mt-8 max-w-xl 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>
</div>
{/* Desktop-only PL */}
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
transition={{ duration: 1, delay: 1 }}
className="hidden lg:block"
>
<PL className="absolute -bottom-8 left-0 max-w-xl text-left 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>
</div>
</div>
</div>

11
src/components/Steps.tsx
View File

@@ -30,14 +30,13 @@ export function Steps() {
const isInView = useInView(ref, { once: true });
return (
<section id="benefits" ref={ref} className="relative bg-cover bg-center py-32 -top-20 text-white" style={{ backgroundImage: "url('/images/deployment.webp')" }}>
<div className="absolute inset-0 bg-black/60" />
<div className="relative px-6 lg:px-6">
<section id="benefits" ref={ref} className="relative pt-16 pb-4 px-4 lg:px-12 -top-20 text-white">
<div className="relative px-6 lg:px-12">
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
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">
Deploy Scalable LLMs and AI Agents in Seconds
@@ -50,7 +49,7 @@ export function Steps() {
initial={{ opacity: 0 }}
animate={isInView ? { opacity: 1 } : { opacity: 0 }}
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) => (
<motion.li
@@ -58,7 +57,7 @@ export function Steps() {
initial={{ opacity: 0, y: 20 }}
animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 20 }}
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" />
<CT as="span" className="font-semibold" color="light">{feature.name}</CT>