diff --git a/components.json b/components.json new file mode 100644 index 0000000..9bfecee --- /dev/null +++ b/components.json @@ -0,0 +1,24 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "new-york", + "rsc": true, + "tsx": true, + "tailwind": { + "config": "", + "css": "src/styles/tailwind.css", + "baseColor": "gray", + "cssVariables": true, + "prefix": "" + }, + "iconLibrary": "lucide", + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "lib": "@/lib", + "hooks": "@/hooks" + }, + "registries": { + "@magicui": "https://magicui.design/r/{name}.json" + } +} diff --git a/package-lock.json b/package-lock.json index 53892f9..197bb11 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,8 +15,12 @@ "@types/node": "^20.10.8", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.18", - "clsx": "^2.1.0", + "class-variance-authority": "^0.7.1", + "clsx": "^2.1.1", + "cobe": "^0.6.4", "framer-motion": "^10.15.0", + "lucide-react": "^0.544.0", + "motion": "^12.23.12", "next": "^14.0.4", "popmotion": "^11.0.5", "react": "^18.2.0", @@ -34,7 +38,8 @@ "eslint-config-next": "^14.0.4", "prettier": "^3.3.2", "prettier-plugin-tailwindcss": "^0.6.11", - "sharp": "0.33.1" + "sharp": "0.33.1", + "tw-animate-css": "^1.3.8" } }, "node_modules/@alloc/quick-lru": { @@ -1713,6 +1718,15 @@ "integrity": "sha512-lb49vf1Xzfx080OKA0o6l8DQQpV+6Vg95zyCJX9VB/BqKYlhG7N4wgROUUHRA+ZPUefLnteQOad7z1kT2bV7bg==", "license": "MIT" }, + "node_modules/@lobehub/fluent-emoji/node_modules/lucide-react": { + "version": "0.469.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.469.0.tgz", + "integrity": "sha512-28vvUnnKQ/dBwiCQtwJw7QauYnE7yd2Cyp4tTTJpvglX4EMpbflcdBgrgToX2j71B3YvugK/NH3BGUk+E/p/Fw==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/@lobehub/icons": { "version": "1.97.2", "resolved": "https://registry.npmjs.org/@lobehub/icons/-/icons-1.97.2.tgz", @@ -1731,6 +1745,15 @@ "react-dom": "^18.0.0 || ^19.0.0" } }, + "node_modules/@lobehub/icons/node_modules/lucide-react": { + "version": "0.469.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.469.0.tgz", + "integrity": "sha512-28vvUnnKQ/dBwiCQtwJw7QauYnE7yd2Cyp4tTTJpvglX4EMpbflcdBgrgToX2j71B3YvugK/NH3BGUk+E/p/Fw==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/@lobehub/ui": { "version": "1.171.0", "resolved": "https://registry.npmjs.org/@lobehub/ui/-/ui-1.171.0.tgz", @@ -5003,6 +5026,15 @@ "node": ">=6" } }, + "node_modules/cobe": { + "version": "0.6.4", + "resolved": "https://registry.npmjs.org/cobe/-/cobe-0.6.4.tgz", + "integrity": "sha512-huuGFnDoXLy/tsCZYYa/H35BBRs9cxsS0XKJ3BXjRp699cQKuoEVrvKlAQMx0DKXG7+VUv4jsHVrS7yPbkLSkQ==", + "license": "MIT", + "dependencies": { + "phenomenon": "^1.6.0" + } + }, "node_modules/collapse-white-space": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-2.1.0.tgz", @@ -8959,9 +8991,9 @@ "license": "ISC" }, "node_modules/lucide-react": { - "version": "0.469.0", - "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.469.0.tgz", - "integrity": "sha512-28vvUnnKQ/dBwiCQtwJw7QauYnE7yd2Cyp4tTTJpvglX4EMpbflcdBgrgToX2j71B3YvugK/NH3BGUk+E/p/Fw==", + "version": "0.544.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.544.0.tgz", + "integrity": "sha512-t5tS44bqd825zAW45UQxpG2CvcC4urOwn2TrwSH8u+MjeE+1NnWl6QqeQ/6NdjMqdOygyiT9p3Ev0p1NJykxjw==", "license": "ISC", "peerDependencies": { "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" @@ -10265,6 +10297,32 @@ "pathe": "^2.0.1" } }, + "node_modules/motion": { + "version": "12.23.12", + "resolved": "https://registry.npmjs.org/motion/-/motion-12.23.12.tgz", + "integrity": "sha512-8jCD8uW5GD1csOoqh1WhH1A6j5APHVE15nuBkFeRiMzYBdRwyAHmSP/oXSuW0WJPZRXTFdBoG4hY9TFWNhhwng==", + "license": "MIT", + "dependencies": { + "framer-motion": "^12.23.12", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/motion-dom": { "version": "11.18.1", "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-11.18.1.tgz", @@ -10280,6 +10338,48 @@ "integrity": "sha512-49Kt+HKjtbJKLtgO/LKj9Ld+6vw9BjH5d9sc40R/kVyH8GLAXgT42M2NnuPcJNuA3s9ZfZBUcwIgpmZWGEE+hA==", "license": "MIT" }, + "node_modules/motion/node_modules/framer-motion": { + "version": "12.23.12", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.23.12.tgz", + "integrity": "sha512-6e78rdVtnBvlEVgu6eFEAgG9v3wLnYEboM8I5O5EXvfKC8gxGQB8wXJdhkMy10iVcn05jl6CNw7/HTsTCfwcWg==", + "license": "MIT", + "dependencies": { + "motion-dom": "^12.23.12", + "motion-utils": "^12.23.6", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, + "node_modules/motion/node_modules/motion-dom": { + "version": "12.23.12", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.23.12.tgz", + "integrity": "sha512-RcR4fvMCTESQBD/uKQe49D5RUeDOokkGRmz4ceaJKDBgHYtZtntC/s2vLvY38gqGaytinij/yi3hMcWVcEF5Kw==", + "license": "MIT", + "dependencies": { + "motion-utils": "^12.23.6" + } + }, + "node_modules/motion/node_modules/motion-utils": { + "version": "12.23.6", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.23.6.tgz", + "integrity": "sha512-eAWoPgr4eFEOFfg2WjIsMoqJTW6Z8MTUCgn/GZ3VRpClWBdnbjryiA3ZSNLyxCTmCQx4RmYX6jX1iWHbenUPNQ==", + "license": "MIT" + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", @@ -10806,6 +10906,12 @@ "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==", "license": "MIT" }, + "node_modules/phenomenon": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/phenomenon/-/phenomenon-1.6.0.tgz", + "integrity": "sha512-7h9/fjPD3qNlgggzm88cY58l9sudZ6Ey+UmZsizfhtawO6E3srZQXywaNm2lBwT72TbpHYRPy7ytIHeBUD/G0A==", + "license": "MIT" + }, "node_modules/picocolors": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", @@ -13491,6 +13597,16 @@ "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", "license": "0BSD" }, + "node_modules/tw-animate-css": { + "version": "1.3.8", + "resolved": "https://registry.npmjs.org/tw-animate-css/-/tw-animate-css-1.3.8.tgz", + "integrity": "sha512-Qrk3PZ7l7wUcGYhwZloqfkWCmaXZAoqjkdbIDvzfGshwGtexa/DAs9koXxIkrpEasyevandomzCBAV1Yyop5rw==", + "dev": true, + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/Wombosvideo" + } + }, "node_modules/type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", diff --git a/package.json b/package.json index bb05e2e..6d938be 100644 --- a/package.json +++ b/package.json @@ -17,8 +17,12 @@ "@types/node": "^20.10.8", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.18", - "clsx": "^2.1.0", + "class-variance-authority": "^0.7.1", + "clsx": "^2.1.1", + "cobe": "^0.6.4", "framer-motion": "^10.15.0", + "lucide-react": "^0.544.0", + "motion": "^12.23.12", "next": "^14.0.4", "popmotion": "^11.0.5", "react": "^18.2.0", @@ -36,6 +40,7 @@ "eslint-config-next": "^14.0.4", "prettier": "^3.3.2", "prettier-plugin-tailwindcss": "^0.6.11", - "sharp": "0.33.1" + "sharp": "0.33.1", + "tw-animate-css": "^1.3.8" } } diff --git a/public/images/logo.png b/public/images/logo.png index 0d9c3af..82bd02f 100644 Binary files a/public/images/logo.png and b/public/images/logo.png differ diff --git a/public/images/logo.svg b/public/images/logo.svg new file mode 100644 index 0000000..0fa4f9b --- /dev/null +++ b/public/images/logo.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/public/images/m.png b/public/images/m.png new file mode 100644 index 0000000..f7adaf7 Binary files /dev/null and b/public/images/m.png differ diff --git a/public/videos/mycelium.mp4 b/public/videos/mycelium.mp4 index 632ab36..12b298c 100644 Binary files a/public/videos/mycelium.mp4 and b/public/videos/mycelium.mp4 differ diff --git a/src/app/(main)/page.tsx b/src/app/(main)/page.tsx index 1f12f98..4eabe96 100644 --- a/src/app/(main)/page.tsx +++ b/src/app/(main)/page.tsx @@ -11,6 +11,7 @@ import { CallTo } from '@/components/CallTo' import { ScrollDown } from '@/components/ui/ScrollDown' import { ScrollUp } from '@/components/ui/ScrollUp' import { GridStats } from '@/components/GridStats' +import { WorldMap } from '@/components/WorldMap' export default function Home() { return ( @@ -18,21 +19,19 @@ export default function Home() {
-
- -
-
- -
-
- -
+
+ +
+
+ +
+ @@ -45,6 +44,7 @@ export default function Home() {
+ diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 03d1c10..9adc238 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -25,7 +25,7 @@ export default function RootLayout({ children: React.ReactNode }) { return ( - + {children} ) diff --git a/src/components/Archives/Companies copy.tsx b/src/components/Archives/Companies copy.tsx new file mode 100644 index 0000000..7693a86 --- /dev/null +++ b/src/components/Archives/Companies copy.tsx @@ -0,0 +1,92 @@ +"use client"; + +import React from "react"; +import { motion } from "framer-motion"; +import { H2, P } from '@/components/Texts'; + + + +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 AlibabaCloud from '@/components/logos/AlibabaCloud'; +import TencentCloud from '@/components/logos/TencentCloud'; +import OpenAI from '@/components/logos/OpenAI'; +import XAI from '@/components/logos/XAI'; + +const row1 = [Ai21, Claude, BaiduCloud, ByteDance]; +const row2 = [DeepSeek, DeepMind, Minimax, Mistral]; +const row3 = [Moonshot, AlibabaCloud]; +const row4 = [TencentCloud, OpenAI, XAI]; + +export function Companies() { + return ( +
+
+ + {/* Heading */} + +

+ Deploy the World’s Leading AI Models +

+

+ Deploy and scale AI from top global providers on a decentralized, privacy-first infrastructure. +

+
+ + {/* Animated Line */} + + + {/* Logos grid */} +
+ {[row1, row2, row3, row4].map((row, rowIndex) => ( + + {row.map((Logo, i) => ( + +
+
+ ))} +
+ ))} +
+
+
+ ); +} diff --git a/src/components/Archives/HomeHero copy.tsx b/src/components/Archives/HomeHero copy.tsx new file mode 100644 index 0000000..f235732 --- /dev/null +++ b/src/components/Archives/HomeHero copy.tsx @@ -0,0 +1,90 @@ +'use client' + +import { useState } from 'react' +import { motion } from 'framer-motion' +import { TypeAnimation } from 'react-type-animation' +import { Dialog, DialogPanel } from '@headlessui/react' +import { Bars3Icon, XMarkIcon, ChevronDoubleDownIcon } from '@heroicons/react/24/outline' +import { H1, PL } from '@/components/Texts' + +const navigation = [ + { name: 'Product', href: '#' }, + { name: 'Features', href: '#' }, + { name: 'Marketplace', href: '#' }, + { name: 'Company', href: '#' }, +] + +export function HomeHero() { + const [mobileMenuOpen, setMobileMenuOpen] = useState(false) + + return ( +
+ + + +
+ + ) +} diff --git a/src/components/Button.tsx b/src/components/Button.tsx index ba2efbf..223ee97 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -10,13 +10,13 @@ const baseStyles = { const variantStyles = { solid: { - cyan: 'relative overflow-hidden bg-[#2F3178] text-white before:absolute before:inset-0 active:before:bg-transparent hover:before:bg-white/10 active:bg-[#2F3178] active:text-white/80 before:transition-colors', + cyan: 'relative overflow-hidden bg-[#005eff] text-white before:absolute before:inset-0 active:before:bg-transparent hover:before:bg-white/10 active:bg-[#005eff] active:text-white/80 before:transition-colors', white: 'bg-white text-cyan-900 hover:bg-white/90 active:bg-white/90 active:text-cyan-900/70', gray: 'bg-gray-800 text-white hover:bg-gray-900 active:bg-gray-800 active:text-white/80', }, outline: { - gray: 'border-gray-300 text-gray-700 hover:border-gray-400 active:bg-gray-100 active:text-gray-700/80', + gray: 'border-gray-300 text-gray-200 hover:border-gray-400 active:bg-gray-100 active:text-gray-700/80', }, } diff --git a/src/components/Companies.tsx b/src/components/Companies.tsx index 68bd83f..d997033 100644 --- a/src/components/Companies.tsx +++ b/src/components/Companies.tsx @@ -3,6 +3,7 @@ import React from "react"; import { motion } from "framer-motion"; import { H2, P } from '@/components/Texts'; +import { InfiniteMovingCards } from "@/components/magicui/infinite-moving-cards"; @@ -15,76 +16,58 @@ 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 AlibabaCloud from '@/components/logos/AlibabaCloud'; import TencentCloud from '@/components/logos/TencentCloud'; import OpenAI from '@/components/logos/OpenAI'; import XAI from '@/components/logos/XAI'; -const row1 = [Ai21, Claude, BaiduCloud, ByteDance]; -const row2 = [DeepSeek, DeepMind, Minimax, Mistral]; -const row3 = [Moonshot, AlibabaCloud]; -const row4 = [TencentCloud, OpenAI, XAI]; +const logos = [ + , + , + , + , + , + , + , + , + , + , + , + , +]; + +const row1 = logos.slice(0, 6); +const row2 = logos.slice(6); export function Companies() { return ( -
-
+
+
{/* Heading */} -

- Deploy the World’s Leading AI Models -

-

- Deploy and scale AI from top global providers on a decentralized, privacy-first infrastructure. Mycelium Cloud lets you integrate state-of-the-art intelligence into your workflows with full control, sovereignty, and cost efficiency. +

+ Mycelium Cloud allows you to deploy and scale AI agents from top global providers on a decentralized, privacy-first infrastructure.

- {/* Animated Line */} - - {/* Logos grid */} -
- {[row1, row2, row3, row4].map((row, rowIndex) => ( - - {row.map((Logo, i) => ( - -
-
- ))} -
- ))} +
+ +
diff --git a/src/components/HomeHero.tsx b/src/components/HomeHero.tsx index f235732..4cf97d6 100644 --- a/src/components/HomeHero.tsx +++ b/src/components/HomeHero.tsx @@ -18,51 +18,23 @@ export function HomeHero() { const [mobileMenuOpen, setMobileMenuOpen] = useState(false) return ( -
- +
+
- -
-