77 lines
2.5 KiB
TypeScript
77 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
import { motion } from "framer-motion";
|
|
import { P, Eyebrow } from "@/components/Texts";
|
|
import { InfiniteMovingCards } from "@/components/magicui/infinite-moving-cards";
|
|
|
|
|
|
|
|
import Ai21 from '@/components/logos/Ai21';
|
|
import Claude from '@/components/logos/Claude';
|
|
import BaiduCloud from '@/components/logos/BaiduCloud';
|
|
import ByteDance from '@/components/logos/ByteDance';
|
|
import DeepSeek from '@/components/logos/DeepSeek';
|
|
import DeepMind from '@/components/logos/DeepMind';
|
|
import Minimax from '@/components/logos/Minimax';
|
|
import Mistral from '@/components/logos/Mistral';
|
|
import Moonshot from '@/components/logos/Moonshot';
|
|
import TencentCloud from '@/components/logos/TencentCloud';
|
|
import OpenAI from '@/components/logos/OpenAI';
|
|
import XAI from '@/components/logos/XAI';
|
|
|
|
const logos = [
|
|
<Ai21 key="ai21" />,
|
|
<Claude key="claude" />,
|
|
<BaiduCloud key="baidu" />,
|
|
<ByteDance key="bytedance" />,
|
|
<DeepSeek key="deepseek" />,
|
|
<DeepMind key="deepmind" />,
|
|
<Minimax key="minimax" />,
|
|
<Mistral key="mistral" />,
|
|
<Moonshot key="moonshot" />,
|
|
<TencentCloud key="tencent" />,
|
|
<OpenAI key="openai" />,
|
|
<XAI key="xai" />,
|
|
];
|
|
|
|
const row1 = logos.slice(0, 6);
|
|
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 py-4 mb-12">
|
|
<div className="relative z-10 mx-auto w-full max-w-6xl p-4">
|
|
|
|
{/* Heading */}
|
|
<motion.div
|
|
className="flex flex-col justify-center max-w-4xl items-center mb-8 mx-auto"
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true, amount: 0.3 }}
|
|
transition={{ duration: 0.6, ease: "easeOut" }}
|
|
>
|
|
<Eyebrow color="accent"></Eyebrow>
|
|
<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>
|
|
|
|
{/* Logos grid */}
|
|
<div className="flex flex-col items-center gap-y-6 text-white">
|
|
<InfiniteMovingCards
|
|
items={row1}
|
|
direction="right"
|
|
speed="slow"
|
|
/>
|
|
<InfiniteMovingCards
|
|
className=""
|
|
items={row2}
|
|
direction="left"
|
|
speed="slow"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|