初始化项目
This commit is contained in:
3
.eslintrc.json
Normal file
3
.eslintrc.json
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"extends": "next/core-web-vitals"
|
||||
}
|
||||
36
.gitignore
vendored
Normal file
36
.gitignore
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
.yarn/install-state.gz
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# local env files
|
||||
.env*.local
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
# typescript
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
41
README.md
Normal file
41
README.md
Normal file
@@ -0,0 +1,41 @@
|
||||
# Asset Homepage
|
||||
|
||||
这是资产管理平台的前台页面项目。
|
||||
|
||||
## 技术栈
|
||||
|
||||
- Next.js 15.1.4
|
||||
- React 19.0.0
|
||||
- TypeScript 5
|
||||
- Tailwind CSS 3.4.17
|
||||
|
||||
## 开发
|
||||
|
||||
首先，安装依赖：
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
然后，运行开发服务器：
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
在浏览器中打开 [http://localhost:3002](http://localhost:3002) 查看结果。
|
||||
|
||||
注意：此项目运行在端口 3002，以避免与后台项目（端口 3000）冲突。
|
||||
|
||||
## 项目结构
|
||||
|
||||
- `app/` - Next.js App Router 页面和布局
|
||||
- `components/` - React 组件
|
||||
- `public/` - 静态资源文件
|
||||
|
||||
## 与后台项目的关系
|
||||
|
||||
- 后台项目：`asset-dashboard-next` (端口 3000)
|
||||
- 前台项目：`asset-homepage` (端口 3002)
|
||||
|
||||
两个项目使用相同的依赖版本和配置，确保开发体验的一致性。
|
||||
71
app/globals.css
Normal file
71
app/globals.css
Normal file
@@ -0,0 +1,71 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
--background: #ffffff;
|
||||
--foreground: #111827;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--background: #0a0a0a;
|
||||
--foreground: #ededed;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--foreground);
|
||||
background: var(--background);
|
||||
font-family: var(--font-inter), Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
.text-balance {
|
||||
text-wrap: balance;
|
||||
}
|
||||
}
|
||||
|
||||
/* Calculator card wiggle animation */
|
||||
@keyframes wiggle {
|
||||
0% { transform: rotate(0deg); }
|
||||
15% { transform: rotate(-5deg); }
|
||||
35% { transform: rotate(4.5deg); }
|
||||
55% { transform: rotate(-2.5deg); }
|
||||
75% { transform: rotate(2deg); }
|
||||
90% { transform: rotate(-0.5deg); }
|
||||
100% { transform: rotate(0deg); }
|
||||
}
|
||||
|
||||
.calculator-card-container:hover {
|
||||
animation: wiggle 2.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* Menu animations */
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideDown {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateX(-50%) translateY(-10px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateX(-50%) translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.animate-fade-in {
|
||||
animation: fadeIn 0.2s ease-out;
|
||||
}
|
||||
|
||||
.animate-slide-down {
|
||||
animation: slideDown 0.3s ease-out;
|
||||
}
|
||||
41
app/layout.tsx
Normal file
41
app/layout.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter, JetBrains_Mono, Domine } from "next/font/google";
|
||||
import "./globals.css";
|
||||
|
||||
const inter = Inter({
|
||||
subsets: ["latin"],
|
||||
variable: "--font-inter",
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
const jetbrainsMono = JetBrains_Mono({
|
||||
subsets: ["latin"],
|
||||
variable: "--font-jetbrains",
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
const domine = Domine({
|
||||
subsets: ["latin"],
|
||||
variable: "--font-domine",
|
||||
weight: ["400", "700"],
|
||||
display: "swap",
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Asset Homepage",
|
||||
description: "Asset management platform homepage",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="zh-CN" className={`${inter.variable} ${jetbrainsMono.variable} ${domine.variable}`}>
|
||||
<body className="antialiased">
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
25
app/page.tsx
Normal file
25
app/page.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
import Navbar from '@/components/Navbar';
|
||||
import HeroSection from '@/components/HeroSection';
|
||||
import StatsSection from '@/components/StatsSection';
|
||||
import TrustedBySection from '@/components/TrustedBySection';
|
||||
import WhyAssetXSection from '@/components/WhyAssetXSection';
|
||||
import HowItWorksSection from '@/components/HowItWorksSection';
|
||||
import SecuritySection from '@/components/SecuritySection';
|
||||
import Footer from '@/components/Footer';
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
<Navbar />
|
||||
<div className="pt-[80px]">
|
||||
<HeroSection />
|
||||
<StatsSection />
|
||||
<TrustedBySection />
|
||||
<WhyAssetXSection />
|
||||
<HowItWorksSection />
|
||||
<SecuritySection />
|
||||
<Footer />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
222
components/Footer.tsx
Normal file
222
components/Footer.tsx
Normal file
@@ -0,0 +1,222 @@
|
||||
'use client';
|
||||
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function Footer() {
|
||||
const productLinks = [
|
||||
'AX-Fund',
|
||||
'AX-Matrix',
|
||||
'Launchpad',
|
||||
'Liquid Market',
|
||||
'Token Factory'
|
||||
];
|
||||
|
||||
const resourceLinks = [
|
||||
'Docs',
|
||||
'FAQ & Support',
|
||||
'Trust & Security',
|
||||
'Learning Center',
|
||||
'Community Forum'
|
||||
];
|
||||
|
||||
const companyLinks = [
|
||||
'About Team',
|
||||
'Careers',
|
||||
'Contact Us',
|
||||
'Press & Media'
|
||||
];
|
||||
|
||||
const socialIcons = [
|
||||
{ src: '/component-12.svg', alt: 'Twitter', width: 24, height: 24 },
|
||||
{ src: '/component-13.svg', alt: 'Discord', width: 24, height: 24 },
|
||||
{ src: '/component-14.svg', alt: 'Telegram', width: 24, height: 24 },
|
||||
{ src: '/component-15.svg', alt: 'Medium', width: 24, height: 24 }
|
||||
];
|
||||
|
||||
return (
|
||||
<footer className="bg-white border-t border-[#e5e7eb] w-full flex flex-col items-center">
|
||||
{/* Main Footer Content */}
|
||||
<div className="w-full max-w-[1280px] px-6 py-20 flex flex-row gap-8">
|
||||
|
||||
{/* Left Section - Logo, Address, Social Icons */}
|
||||
<div className="flex flex-col gap-6 w-[389.33px]">
|
||||
{/* Logo */}
|
||||
<div className="flex items-center">
|
||||
<Image
|
||||
src="/logo2.svg"
|
||||
alt="AssetX Logo"
|
||||
width={160}
|
||||
height={40}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Address */}
|
||||
<div
|
||||
className="text-[#9ca1af] text-left font-inter"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
G/F, Hong Kong Museum Of Art, 10號 Salisbury
|
||||
<br />
|
||||
Rd, Tsim Sha Tsui, HongKong
|
||||
</div>
|
||||
|
||||
{/* Social Icons */}
|
||||
<div className="flex flex-row gap-4 items-center">
|
||||
{socialIcons.map((icon, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="cursor-pointer hover:opacity-70 transition-opacity"
|
||||
>
|
||||
<Image
|
||||
src={icon.src}
|
||||
alt={icon.alt}
|
||||
width={icon.width}
|
||||
height={icon.height}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Section - Links */}
|
||||
<div className="flex flex-row justify-between flex-1">
|
||||
|
||||
{/* Products Column */}
|
||||
<div className="flex flex-col gap-4 w-[178.67px]">
|
||||
<h3
|
||||
className="text-[#111827] font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Products
|
||||
</h3>
|
||||
<div className="flex flex-col gap-2">
|
||||
{productLinks.map((link, index) => (
|
||||
<a
|
||||
key={index}
|
||||
href="#"
|
||||
className="text-[#9ca1af] hover:text-[#111827] transition-colors font-inter cursor-pointer"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{link}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Resources Column */}
|
||||
<div className="flex flex-col gap-4 w-[178.67px]">
|
||||
<h3
|
||||
className="text-[#111827] font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Resources
|
||||
</h3>
|
||||
<div className="flex flex-col gap-2">
|
||||
{resourceLinks.map((link, index) => (
|
||||
<a
|
||||
key={index}
|
||||
href="#"
|
||||
className="text-[#9ca1af] hover:text-[#111827] transition-colors font-inter cursor-pointer"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{link}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Company Column */}
|
||||
<div className="flex flex-col gap-4 w-[178.67px]">
|
||||
<h3
|
||||
className="text-[#111827] font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Company
|
||||
</h3>
|
||||
<div className="flex flex-col gap-2">
|
||||
{companyLinks.map((link, index) => (
|
||||
<a
|
||||
key={index}
|
||||
href="#"
|
||||
className="text-[#9ca1af] hover:text-[#111827] transition-colors font-inter cursor-pointer"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{link}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bottom Section - Copyright and Legal Links */}
|
||||
<div className="w-full max-w-[1280px] border-t border-[#f3f4f6] px-6 py-8 flex flex-row items-center justify-between">
|
||||
{/* Copyright */}
|
||||
<div
|
||||
className="text-[#9ca1af] font-inter"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
© 2025 ASSETX Protocol. All rights reserved.
|
||||
</div>
|
||||
|
||||
{/* Legal Links */}
|
||||
<div className="flex flex-row gap-6">
|
||||
<a
|
||||
href="#"
|
||||
className="text-[#9ca1af] hover:text-[#111827] transition-colors font-inter cursor-pointer"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Privacy Policy
|
||||
</a>
|
||||
<a
|
||||
href="#"
|
||||
className="text-[#9ca1af] hover:text-[#111827] transition-colors font-inter cursor-pointer"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Terms of Service
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
128
components/HeroSection.tsx
Normal file
128
components/HeroSection.tsx
Normal file
@@ -0,0 +1,128 @@
|
||||
'use client';
|
||||
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function HeroSection() {
|
||||
return (
|
||||
<section className="relative w-full">
|
||||
{/* .header - 背景容器 */}
|
||||
<div
|
||||
className="flex flex-col items-start justify-center flex-shrink-0 h-[670px] relative"
|
||||
style={{
|
||||
background: 'linear-gradient(to left, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55))',
|
||||
padding: '114px 85px'
|
||||
}}
|
||||
>
|
||||
{/* .frame-21 - 主内容容器 */}
|
||||
<div className="flex flex-col gap-[60px] flex-shrink-0 w-[926px] relative">
|
||||
|
||||
{/* .frame-25 - 标题和描述区域 */}
|
||||
<div className="flex flex-col gap-8 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
|
||||
{/* .frame-22 - 标题容器 */}
|
||||
<div className="flex flex-col gap-4 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
{/* .yield-bearing-asset */}
|
||||
<div
|
||||
className="text-[#fcfcfd] text-left relative self-stretch font-domine"
|
||||
style={{
|
||||
fontSize: '100px',
|
||||
lineHeight: '100%',
|
||||
letterSpacing: '-0.03em',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Yield-Bearing Asset
|
||||
</div>
|
||||
|
||||
{/* .on-chain */}
|
||||
<div
|
||||
className="text-[#fcfcfd] text-left relative w-[926px] h-[100px] font-domine"
|
||||
style={{
|
||||
fontSize: '100px',
|
||||
lineHeight: '100%',
|
||||
letterSpacing: '-0.03em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
On Chain.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description text */}
|
||||
<div
|
||||
className="text-[#fcfcfd] text-left relative w-[488px] flex items-center justify-start font-domine"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Access Yield- Bearing Asset like Equities, Real Estate, and
|
||||
Commercial Loans with low barriers. Enjoy 10%-30% APY backed by
|
||||
real assets.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* .frame-23 - 按钮容器 */}
|
||||
<div className="flex flex-row gap-5 items-start justify-start flex-shrink-0 relative">
|
||||
|
||||
{/* .component-82 - Start Investing Button */}
|
||||
<button
|
||||
className="bg-white flex flex-row gap-2 items-center justify-center flex-shrink-0 h-[60px] relative overflow-hidden hover:opacity-90 transition-opacity"
|
||||
style={{
|
||||
borderRadius: '4px',
|
||||
padding: '0px 32px'
|
||||
}}
|
||||
>
|
||||
{/* .text4 */}
|
||||
<div
|
||||
className="text-[#111827] text-center relative flex items-center justify-center font-inter"
|
||||
style={{
|
||||
fontSize: '18px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Start Investing
|
||||
</div>
|
||||
|
||||
{/* .component-1 - Arrow icon */}
|
||||
<Image
|
||||
src="/component-10.svg"
|
||||
alt="Arrow"
|
||||
width={20}
|
||||
height={20}
|
||||
className="flex-shrink-0 w-5 h-5 relative overflow-visible"
|
||||
style={{ aspectRatio: 1 }}
|
||||
/>
|
||||
</button>
|
||||
|
||||
{/* .component-9 - Read the Whitepaper Button */}
|
||||
<button
|
||||
className="border border-white/20 flex flex-row gap-2 items-center justify-center self-stretch flex-shrink-0 relative overflow-hidden hover:bg-white/20 transition-colors"
|
||||
style={{
|
||||
background: 'rgba(255, 255, 255, 0.1)',
|
||||
borderRadius: '4px',
|
||||
padding: '12px 32px',
|
||||
backdropFilter: 'blur(30px)'
|
||||
}}
|
||||
>
|
||||
{/* .text5 */}
|
||||
<div
|
||||
className="text-[#fcfcfd] text-center relative flex items-center justify-center font-inter"
|
||||
style={{
|
||||
fontSize: '18px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Read the Whitepaper
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
409
components/HowItWorksSection.tsx
Normal file
409
components/HowItWorksSection.tsx
Normal file
@@ -0,0 +1,409 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
// 数字增长动画Hook
|
||||
function useCountUp(end: number, duration: number = 1500, startRangePercent: number = 0.75) {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [count, setCount] = useState(end);
|
||||
const [hasAnimated, setHasAnimated] = useState(false);
|
||||
const elementRef = useRef<HTMLDivElement>(null);
|
||||
const startValueRef = useRef<number>(end);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
startValueRef.current = Math.floor(end * (startRangePercent + Math.random() * 0.15));
|
||||
setCount(startValueRef.current);
|
||||
}, [end, startRangePercent]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!mounted) return;
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
if (entries[0].isIntersecting && !hasAnimated) {
|
||||
setHasAnimated(true);
|
||||
const start = startValueRef.current;
|
||||
const startTime = Date.now();
|
||||
|
||||
const timer = setInterval(() => {
|
||||
const elapsed = Date.now() - startTime;
|
||||
const progress = Math.min(elapsed / duration, 1);
|
||||
|
||||
const easeOutCubic = 1 - Math.pow(1 - progress, 3);
|
||||
const currentCount = Math.floor(start + (end - start) * easeOutCubic);
|
||||
|
||||
setCount(currentCount);
|
||||
|
||||
if (progress === 1) {
|
||||
setCount(end);
|
||||
clearInterval(timer);
|
||||
}
|
||||
}, 16);
|
||||
|
||||
return () => clearInterval(timer);
|
||||
}
|
||||
},
|
||||
{ threshold: 0.1 }
|
||||
);
|
||||
|
||||
if (elementRef.current) {
|
||||
observer.observe(elementRef.current);
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [end, duration, hasAnimated, mounted]);
|
||||
|
||||
return { count, elementRef };
|
||||
}
|
||||
|
||||
export default function HowItWorksSection() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [visible, setVisible] = useState(false);
|
||||
const [activeStep, setActiveStep] = useState(1); // 默认第1步激活
|
||||
const sectionRef = useRef<HTMLElement>(null);
|
||||
|
||||
// 数字动画
|
||||
const investAmount = useCountUp(100000, 1500, 0.85);
|
||||
const earnAmount = useCountUp(5150, 1500, 0.85);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting && !visible) {
|
||||
setVisible(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
{
|
||||
threshold: 0.1,
|
||||
}
|
||||
);
|
||||
|
||||
if (sectionRef.current) {
|
||||
observer.observe(sectionRef.current);
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (sectionRef.current) {
|
||||
observer.unobserve(sectionRef.current);
|
||||
}
|
||||
};
|
||||
}, [visible]);
|
||||
|
||||
const steps = [
|
||||
{
|
||||
number: 1,
|
||||
title: 'Deposit & Mint WUSD',
|
||||
description: 'Connect your wallet and deposit USDC to swap WUSD. This serves as the native stablecoin and gateway to the entire AssetX ecosystem.',
|
||||
hasLine: true
|
||||
},
|
||||
{
|
||||
number: 2,
|
||||
title: 'Dual Investment Options',
|
||||
description: 'Choose your strategy: use WUSD to purchase specific Yield-Bearing Assets for real-world returns, or provide liquidity in DeFi Pools to earn trading fees.',
|
||||
hasLine: true
|
||||
},
|
||||
{
|
||||
number: 3,
|
||||
title: 'Earn & Boost',
|
||||
description: 'Receive daily yield distributions. Use Asset Tokens as collateral to borrow WUSD and leverage up to 2.5x for maximized returns.',
|
||||
hasLine: false
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
ref={sectionRef}
|
||||
className="bg-[#f9fafb] flex flex-col items-center justify-center flex-shrink-0 w-full relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '1px 0px',
|
||||
padding: '80px 0px'
|
||||
}}
|
||||
>
|
||||
{/* .container20 - Main container */}
|
||||
<div className="flex flex-row items-start justify-between flex-shrink-0 relative w-[1200px]">
|
||||
|
||||
{/* Left Side - Steps (.container21) */}
|
||||
<div className="flex flex-col gap-10 items-start justify-start flex-shrink-0 relative w-[520px]">
|
||||
|
||||
{/* Title (.heading-2) */}
|
||||
<div className="flex flex-col items-start justify-start flex-shrink-0 relative">
|
||||
<h2
|
||||
className="text-[#111827] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '120%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
How it works
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
{/* Steps Container (.frame-34) */}
|
||||
<div className="flex flex-col gap-6 items-start justify-start flex-shrink-0 relative">
|
||||
|
||||
{steps.map((step, index) => {
|
||||
const isActive = activeStep === step.number;
|
||||
|
||||
return (
|
||||
<div
|
||||
key={step.number}
|
||||
onClick={() => setActiveStep(step.number)}
|
||||
className={`flex flex-row gap-6 items-start justify-start flex-shrink-0 relative cursor-pointer transition-all duration-300 ease-out hover:opacity-80 ${
|
||||
mounted && visible
|
||||
? 'translate-x-0 opacity-100'
|
||||
: '-translate-x-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
transitionDelay: `${index * 150}ms`
|
||||
}}
|
||||
>
|
||||
{/* Number and Line Container */}
|
||||
<div className="pt-2 flex flex-col items-center justify-start self-stretch flex-shrink-0 relative">
|
||||
|
||||
{/* Number Badge */}
|
||||
{isActive ? (
|
||||
// Active step (black background)
|
||||
<div
|
||||
className="bg-[#111827] rounded-[999px] flex items-center justify-center flex-shrink-0 w-8 h-[21.63px] relative transition-all duration-300"
|
||||
style={{
|
||||
padding: '0.31px 0px 1.32px 0px'
|
||||
}}
|
||||
>
|
||||
<span
|
||||
className="text-[#fcfcfd] text-center relative flex items-center justify-center font-inter transition-all duration-300"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
{step.number}
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
// Inactive step (border)
|
||||
<div
|
||||
className="bg-[#f9fafb] rounded-[9999px] border-2 border-[#d1d5db] flex items-center justify-center flex-shrink-0 w-8 h-[24.5px] relative transition-all duration-300"
|
||||
>
|
||||
<span
|
||||
className="text-[#9ca1af] text-center relative flex items-center justify-center font-inter transition-all duration-300"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
{step.number}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Connecting Line */}
|
||||
{step.hasLine && (
|
||||
<div className="pt-6 flex flex-col items-start justify-center flex-1 w-[2px] relative">
|
||||
<div className="bg-[#e5e7eb] flex-1 w-[2px] relative" />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Text Content */}
|
||||
<div
|
||||
className="flex flex-col gap-2 items-start justify-start flex-1 relative"
|
||||
style={{
|
||||
paddingBottom: step.hasLine ? '32px' : '0px'
|
||||
}}
|
||||
>
|
||||
<h3
|
||||
className="text-[#111827] text-left relative flex items-center justify-start font-inter transition-all duration-300"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '130%',
|
||||
letterSpacing: '-0.005em',
|
||||
fontWeight: isActive ? 700 : 500
|
||||
}}
|
||||
>
|
||||
{step.title}
|
||||
</h3>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative self-stretch flex items-center justify-start font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{step.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Calculator Card */}
|
||||
<div
|
||||
className={`calculator-card-container flex flex-col items-start justify-start flex-shrink-0 w-[558px] relative transition-all duration-700 ease-out ${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
transitionDelay: '450ms',
|
||||
height: '439px'
|
||||
}}
|
||||
>
|
||||
{/* Coin Images Container - Rotated Card */}
|
||||
<div
|
||||
className="bg-[#111827] rounded-[16px] flex flex-row gap-4 items-start justify-start h-[162px] absolute z-0"
|
||||
style={{
|
||||
padding: '25px 25px 1px 25px',
|
||||
left: '205.43px',
|
||||
top: '15.96px',
|
||||
boxShadow: '0px 25px 50px -12px rgba(0, 0, 0, 0.25)',
|
||||
transformOrigin: '0 0',
|
||||
transform: 'rotate(6.535deg) scale(1, 1)'
|
||||
}}
|
||||
>
|
||||
{/* USDC Logo */}
|
||||
<Image
|
||||
src="/usd-coin-usdc-logo-10.svg"
|
||||
alt="USDC"
|
||||
width={64}
|
||||
height={64}
|
||||
className="flex-shrink-0"
|
||||
/>
|
||||
|
||||
{/* WUSD Logo */}
|
||||
<div className="flex-shrink-0 w-[66px] h-[66px] relative">
|
||||
<div className="absolute inset-0 rounded-full bg-gradient-to-br from-green-400 to-emerald-500" />
|
||||
<Image
|
||||
src="/image-220.png"
|
||||
alt="WUSD"
|
||||
width={66}
|
||||
height={66}
|
||||
className="absolute inset-0 rounded-full"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Calculator Card */}
|
||||
<div
|
||||
className="bg-white/85 backdrop-blur-md rounded-[24px] border border-[#e5e7eb] p-8 absolute left-0 top-[99px] w-full shadow-lg z-10"
|
||||
style={{
|
||||
transform: 'rotate(-3deg)',
|
||||
transformOrigin: 'center center'
|
||||
}}
|
||||
>
|
||||
|
||||
{/* Header */}
|
||||
<div className="flex flex-row items-center justify-between mb-6">
|
||||
<div className="flex flex-row gap-3 items-center">
|
||||
<div className="bg-[#111827] rounded-[12px] w-10 h-10 flex items-center justify-center">
|
||||
<Image
|
||||
src="/icon1.svg"
|
||||
alt="Portfolio"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
className="text-[#111827] font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 500
|
||||
}}
|
||||
>
|
||||
Portfolio Overview Simulator
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="bg-green-50 rounded-lg px-3 py-1">
|
||||
<span className="text-green-600 font-inter text-sm font-bold">+5.2% APY</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Investment Amount */}
|
||||
<div className="mb-4">
|
||||
<div className="flex flex-col gap-2">
|
||||
<span
|
||||
className="text-[#9ca1af] font-inter"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
If you invest
|
||||
</span>
|
||||
<span
|
||||
ref={investAmount.elementRef}
|
||||
className="text-[#111827] font-inter"
|
||||
style={{
|
||||
fontSize: '32px',
|
||||
lineHeight: '120%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
${investAmount.count.toLocaleString()}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Range Slider */}
|
||||
<div className="mt-4 h-2 bg-[#e5e7eb] rounded-full relative">
|
||||
<div className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-4 h-4 bg-[#111827] rounded-full" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Earnings */}
|
||||
<div className="mt-6 pt-6 border-t border-[#e5e7eb]">
|
||||
<span
|
||||
className="text-[#9ca1af] font-inter block mb-2"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
You earn per year
|
||||
</span>
|
||||
<div className="flex flex-row gap-2 items-center">
|
||||
<Image
|
||||
src="/icon2.svg"
|
||||
alt="Earn"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
<span
|
||||
ref={earnAmount.elementRef}
|
||||
className="text-green-600 font-inter"
|
||||
style={{
|
||||
fontSize: '32px',
|
||||
lineHeight: '120%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
+${earnAmount.count.toLocaleString()}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
178
components/Navbar.tsx
Normal file
178
components/Navbar.tsx
Normal file
@@ -0,0 +1,178 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect } from 'react';
|
||||
import Image from 'next/image';
|
||||
import ProductMenu from './ProductMenu';
|
||||
import ResourceMenu from './ResourceMenu';
|
||||
|
||||
export default function Navbar() {
|
||||
const [scrolled, setScrolled] = useState(false);
|
||||
const [language, setLanguage] = useState<'zh' | 'en'>('zh');
|
||||
const [showLangMenu, setShowLangMenu] = useState(false);
|
||||
const [showProductMenu, setShowProductMenu] = useState(false);
|
||||
const [showResourceMenu, setShowResourceMenu] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
setScrolled(window.scrollY > 50);
|
||||
};
|
||||
|
||||
window.addEventListener('scroll', handleScroll);
|
||||
return () => window.removeEventListener('scroll', handleScroll);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const handleClickOutside = (e: MouseEvent) => {
|
||||
const target = e.target as Element;
|
||||
if (showLangMenu && !target.closest('.language-selector')) {
|
||||
setShowLangMenu(false);
|
||||
}
|
||||
if (showProductMenu && !target.closest('.product-menu-container')) {
|
||||
setShowProductMenu(false);
|
||||
}
|
||||
if (showResourceMenu && !target.closest('.resource-menu-container')) {
|
||||
setShowResourceMenu(false);
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener('click', handleClickOutside);
|
||||
return () => document.removeEventListener('click', handleClickOutside);
|
||||
}, [showLangMenu, showProductMenu, showResourceMenu]);
|
||||
|
||||
const toggleLanguage = (lang: 'zh' | 'en') => {
|
||||
setLanguage(lang);
|
||||
setShowLangMenu(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<nav className={`fixed top-0 left-0 right-0 z-50 px-10 py-5 flex items-center justify-between transition-all duration-300 ${
|
||||
scrolled
|
||||
? 'bg-white/70 backdrop-blur-[50px] shadow-sm'
|
||||
: 'bg-white/90 backdrop-blur-[50px]'
|
||||
}`}>
|
||||
{/* Logo Section */}
|
||||
<div className="flex-1">
|
||||
<Image
|
||||
src="/logo0.svg"
|
||||
alt="Logo"
|
||||
width={160}
|
||||
height={40}
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Navigation Menu */}
|
||||
<div className="flex items-center gap-12">
|
||||
<div className="flex items-center gap-6">
|
||||
{/* Product - Active */}
|
||||
<div className="product-menu-container">
|
||||
<div
|
||||
className={`rounded-lg px-4 py-2 h-9 flex items-center justify-center cursor-pointer transition-colors ${
|
||||
showProductMenu ? 'bg-[#f3f4f6]' : 'bg-transparent hover:bg-[#f3f4f6]'
|
||||
}`}
|
||||
onClick={() => {
|
||||
setShowProductMenu(!showProductMenu);
|
||||
setShowResourceMenu(false);
|
||||
}}
|
||||
>
|
||||
<span className={`font-bold text-sm leading-[150%] font-inter ${
|
||||
showProductMenu ? 'text-[#111827]' : 'text-[#4b5563]'
|
||||
}`}>
|
||||
{language === 'zh' ? '产品' : 'Product'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Ecosystem */}
|
||||
<div className="bg-transparent rounded-lg px-4 py-2 h-9 flex items-center justify-center hover:bg-[#f3f4f6] transition-colors cursor-pointer">
|
||||
<span className="text-[#4b5563] font-bold text-sm leading-[150%] font-inter">
|
||||
{language === 'zh' ? '生态' : 'Ecosystem'}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Resource */}
|
||||
<div className="resource-menu-container">
|
||||
<div
|
||||
className={`rounded-lg px-4 py-2 h-9 flex items-center justify-center cursor-pointer transition-colors ${
|
||||
showResourceMenu ? 'bg-[#f3f4f6]' : 'bg-transparent hover:bg-[#f3f4f6]'
|
||||
}`}
|
||||
onClick={() => {
|
||||
setShowResourceMenu(!showResourceMenu);
|
||||
setShowProductMenu(false);
|
||||
}}
|
||||
>
|
||||
<span className={`font-bold text-sm leading-[150%] font-inter ${
|
||||
showResourceMenu ? 'text-[#111827]' : 'text-[#4b5563]'
|
||||
}`}>
|
||||
{language === 'zh' ? '资源' : 'Resource'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Launch App Button & Language Selector */}
|
||||
<div className="flex-1 flex justify-end items-center gap-4">
|
||||
<div className="bg-[#111827] rounded-lg px-5 py-2.5 h-10 flex items-center justify-center overflow-hidden cursor-pointer hover:opacity-90 transition-opacity">
|
||||
<span className="text-[#fcfcfd] font-bold text-sm leading-[150%] font-inter">
|
||||
{language === 'zh' ? '启动应用' : 'Launch App'}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Language Selector */}
|
||||
<div className="relative language-selector">
|
||||
<div
|
||||
className="flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-[#f3f4f6] transition-colors cursor-pointer"
|
||||
onClick={() => setShowLangMenu(!showLangMenu)}
|
||||
>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10 18.3333C14.6024 18.3333 18.3333 14.6024 18.3333 10C18.3333 5.39763 14.6024 1.66667 10 1.66667C5.39763 1.66667 1.66667 5.39763 1.66667 10C1.66667 14.6024 5.39763 18.3333 10 18.3333Z" stroke="#4B5563" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
<path d="M1.66667 10H18.3333" stroke="#4B5563" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
<path d="M10 1.66667C12.0844 3.94863 13.269 6.91003 13.3333 10C13.269 13.09 12.0844 16.0514 10 18.3333C7.91561 16.0514 6.73104 13.09 6.66667 10C6.73104 6.91003 7.91561 3.94863 10 1.66667Z" stroke="#4B5563" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
</svg>
|
||||
<span className="text-[#4b5563] font-inter text-sm font-bold">
|
||||
{language === 'zh' ? '中文' : 'EN'}
|
||||
</span>
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M3 4.5L6 7.5L9 4.5" stroke="#4B5563" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
{/* Dropdown Menu */}
|
||||
{showLangMenu && (
|
||||
<div className="absolute right-0 mt-2 w-32 bg-white rounded-lg shadow-lg border border-[#e5e7eb] overflow-hidden z-50">
|
||||
<div
|
||||
className={`px-4 py-2.5 hover:bg-[#f3f4f6] cursor-pointer transition-colors ${
|
||||
language === 'zh' ? 'bg-[#f3f4f6]' : ''
|
||||
}`}
|
||||
onClick={() => toggleLanguage('zh')}
|
||||
>
|
||||
<span className="text-[#111827] font-inter text-sm font-medium">中文</span>
|
||||
</div>
|
||||
<div
|
||||
className={`px-4 py-2.5 hover:bg-[#f3f4f6] cursor-pointer transition-colors ${
|
||||
language === 'en' ? 'bg-[#f3f4f6]' : ''
|
||||
}`}
|
||||
onClick={() => toggleLanguage('en')}
|
||||
>
|
||||
<span className="text-[#111827] font-inter text-sm font-medium">English</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<ProductMenu
|
||||
isOpen={showProductMenu}
|
||||
onClose={() => setShowProductMenu(false)}
|
||||
language={language}
|
||||
/>
|
||||
<ResourceMenu
|
||||
isOpen={showResourceMenu}
|
||||
onClose={() => setShowResourceMenu(false)}
|
||||
language={language}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
292
components/ProductMenu.tsx
Normal file
292
components/ProductMenu.tsx
Normal file
@@ -0,0 +1,292 @@
|
||||
'use client';
|
||||
|
||||
import Image from 'next/image';
|
||||
|
||||
interface ProductMenuProps {
|
||||
isOpen: boolean;
|
||||
onClose: () => void;
|
||||
language: 'zh' | 'en';
|
||||
}
|
||||
|
||||
export default function ProductMenu({ isOpen, onClose, language }: ProductMenuProps) {
|
||||
if (!isOpen) return null;
|
||||
|
||||
const content = {
|
||||
zh: {
|
||||
coreYieldAssets: '核心收益资产',
|
||||
axFund: 'AX-Fund',
|
||||
axFundDesc: '购买AX-Fund收益代币，获得市场中性收益策略的敞口。收益随时间在代币价格中累积。',
|
||||
axFundBadge: '最高22% APY',
|
||||
axPool: 'AX-Pool',
|
||||
axPoolDesc: '以ALP提供流动性支持收益代币市场并赚取交易费',
|
||||
axPoolBadge: '多元化',
|
||||
platformsProtocols: '平台与协议',
|
||||
launchpad: 'Launchpad',
|
||||
launchpadDesc: '发行与代币化新RWA',
|
||||
defiMarket: 'DeFi市场',
|
||||
defiMarketDesc: '资产代币的交换与借贷',
|
||||
tokenFactory: 'Token Factory',
|
||||
tokenFactoryDesc: '标准化铸造协议',
|
||||
infrastructure: '基础设施',
|
||||
assetCockpit: 'Asset Cockpit',
|
||||
assetCockpitDesc: '投资组合分析与管理',
|
||||
oracleNetwork: 'Oracle Network',
|
||||
oracleNetworkDesc: '实时链下数据源',
|
||||
latestAudit: '最新审计：',
|
||||
auditInfo: 'Oct 2025 (Certik)',
|
||||
viewDocs: '查看文档 →'
|
||||
},
|
||||
en: {
|
||||
coreYieldAssets: 'Core Yield Assets',
|
||||
axFund: 'AX-Fund',
|
||||
axFundDesc: 'Buy the AX-Fund Yield Token to gain exposure to market-neutral yield strategies. Yield accrues in token price over time.',
|
||||
axFundBadge: 'up to 22% APY',
|
||||
axPool: 'AX-Pool',
|
||||
axPoolDesc: 'Provide liquidity as ALP to support Yield Token markets and earn trading fees',
|
||||
axPoolBadge: 'Diversified',
|
||||
platformsProtocols: 'Platforms & Protocols',
|
||||
launchpad: 'Launchpad',
|
||||
launchpadDesc: 'Issue & tokenize new RWAs.',
|
||||
defiMarket: 'Defi Market',
|
||||
defiMarketDesc: 'Swap & Lending for assets tokens.',
|
||||
tokenFactory: 'Token Factory',
|
||||
tokenFactoryDesc: 'Standardized minting protocol.',
|
||||
infrastructure: 'Infrastructure',
|
||||
assetCockpit: 'Asset Cockpit',
|
||||
assetCockpitDesc: 'Portfolio analytics & mgmt.',
|
||||
oracleNetwork: 'Oracle Network',
|
||||
oracleNetworkDesc: 'Real-time off-chain data feeds.',
|
||||
latestAudit: 'Latest Audit:',
|
||||
auditInfo: 'Oct 2025 (Certik)',
|
||||
viewDocs: 'View Documentation →'
|
||||
}
|
||||
};
|
||||
|
||||
const t = content[language];
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Backdrop */}
|
||||
<div
|
||||
className="fixed inset-0 bg-black/20 z-40 animate-fade-in"
|
||||
onClick={onClose}
|
||||
/>
|
||||
|
||||
{/* Menu */}
|
||||
<div className="fixed left-1/2 -translate-x-1/2 bg-white rounded-2xl shadow-xl border border-[#e5e7eb] p-6 z-50 animate-slide-down"
|
||||
style={{ width: '1080px', top: '90px' }}
|
||||
>
|
||||
<div className="flex flex-row gap-8">
|
||||
{/* Left Column - Core Yield Assets */}
|
||||
<div className="flex flex-col gap-2 w-[340px]">
|
||||
{/* Section Title */}
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.coreYieldAssets}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* AX-Fund Card */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#111827] rounded-xl w-12 h-12 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/environment-rainbow0.svg"
|
||||
alt="AX-Fund"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1 flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.axFund}
|
||||
</span>
|
||||
<div className="bg-green-50 rounded px-2 py-0.5">
|
||||
<span className="text-green-600 font-inter text-xs font-medium">
|
||||
{t.axFundBadge}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-[#9ca1af] font-inter text-xs leading-relaxed">
|
||||
{t.axFundDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* AX-Pool Card */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-12 h-12 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/environment-planet0.svg"
|
||||
alt="AX-Pool"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1 flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.axPool}
|
||||
</span>
|
||||
<div className="bg-blue-50 rounded px-2 py-0.5">
|
||||
<span className="text-blue-600 font-inter text-xs font-medium">
|
||||
{t.axPoolBadge}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-[#9ca1af] font-inter text-xs leading-relaxed">
|
||||
{t.axPoolDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Middle Column - Image + Platforms */}
|
||||
<div className="flex flex-col gap-6 flex-1 min-w-[380px]">
|
||||
{/* Image */}
|
||||
<div className="bg-[#f9fafb] rounded-xl p-3 flex items-center justify-center">
|
||||
<Image
|
||||
src="/image-270.png"
|
||||
alt="Product Showcase"
|
||||
width={96}
|
||||
height={96}
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Platforms & Protocols */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.platformsProtocols}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
{/* Launchpad */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#111827] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-20.svg"
|
||||
alt="Launchpad"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.launchpad}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.launchpadDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* DeFi Market */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-21.svg"
|
||||
alt="DeFi Market"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.defiMarket}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.defiMarketDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Token Factory */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/vuesax-linear-buy-crypto1.svg"
|
||||
alt="Token Factory"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.tokenFactory}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.tokenFactoryDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column - Infrastructure */}
|
||||
<div className="flex flex-col gap-2 w-[280px]">
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.infrastructure}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
{/* Asset Cockpit */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/navigation-map0.svg"
|
||||
alt="Asset Cockpit"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.assetCockpit}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.assetCockpitDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Oracle Network */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-10.svg"
|
||||
alt="Oracle Network"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.oracleNetwork}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.oracleNetworkDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bottom Border */}
|
||||
<div className="border-t border-[#f3f4f6] mt-6 pt-4 flex items-center justify-between">
|
||||
<div className="text-[#9ca1af] font-inter text-sm">
|
||||
<span className="font-medium">{t.latestAudit}</span>
|
||||
<span className="ml-1 text-[#111827] font-bold">{t.auditInfo}</span>
|
||||
</div>
|
||||
<div className="text-green-600 font-inter text-sm font-bold cursor-pointer hover:opacity-70 transition-opacity">
|
||||
{t.viewDocs}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
338
components/ResourceMenu.tsx
Normal file
338
components/ResourceMenu.tsx
Normal file
@@ -0,0 +1,338 @@
|
||||
'use client';
|
||||
|
||||
import Image from 'next/image';
|
||||
|
||||
interface ResourceMenuProps {
|
||||
isOpen: boolean;
|
||||
onClose: () => void;
|
||||
language: 'zh' | 'en';
|
||||
}
|
||||
|
||||
export default function ResourceMenu({ isOpen, onClose, language }: ResourceMenuProps) {
|
||||
if (!isOpen) return null;
|
||||
|
||||
const content = {
|
||||
zh: {
|
||||
docLearning: '文档与学习',
|
||||
docs: '文档',
|
||||
docsDesc: '阅读技术文档、智能合约参考和集成指南。',
|
||||
docsBadge: '已更新',
|
||||
trustSecurity: '信任与安全',
|
||||
trustSecurityDesc: '查看审计、合规认证和我们的安全实践。',
|
||||
helpSupport: '帮助与支持',
|
||||
learningCenter: '学习中心',
|
||||
learningCenterDesc: '教程与视频指南。',
|
||||
communityForum: '社区论坛',
|
||||
communityForumDesc: '提问与交流。',
|
||||
contactSupport: '联系支持',
|
||||
contactSupportDesc: '从我们的团队获得帮助。',
|
||||
company: '公司',
|
||||
aboutTeam: '关于团队',
|
||||
aboutTeamDesc: '认识AssetX背后的团队。',
|
||||
careers: '招聘',
|
||||
careersDesc: '加入我们不断成长的团队。',
|
||||
contactUs: '联系我们',
|
||||
contactUsDesc: '合作与媒体咨询。',
|
||||
pressMedia: '新闻媒体',
|
||||
pressMediaDesc: '最新消息与品牌资产。',
|
||||
latestAudit: '最新审计：',
|
||||
auditInfo: 'Oct 2025 (Certik)',
|
||||
privacyPolicy: '隐私政策',
|
||||
termsOfService: '服务条款'
|
||||
},
|
||||
en: {
|
||||
docLearning: 'Documentation & Learning',
|
||||
docs: 'Docs',
|
||||
docsDesc: 'Read technical docs, smart contract references, and integration guides.',
|
||||
docsBadge: 'Updated',
|
||||
trustSecurity: 'Trust & Security',
|
||||
trustSecurityDesc: 'Review audits, compliance attestations, and our security practices.',
|
||||
helpSupport: 'Help & Support',
|
||||
learningCenter: 'Learning Center',
|
||||
learningCenterDesc: 'Tutorials & video guides.',
|
||||
communityForum: 'Community Forum',
|
||||
communityForumDesc: 'Ask questions & connect.',
|
||||
contactSupport: 'Contact Support',
|
||||
contactSupportDesc: 'Get help from our team.',
|
||||
company: 'Company',
|
||||
aboutTeam: 'About Team',
|
||||
aboutTeamDesc: 'Meet the people behind AssetX.',
|
||||
careers: 'Careers',
|
||||
careersDesc: 'Join our growing team.',
|
||||
contactUs: 'Contact Us',
|
||||
contactUsDesc: 'Partnerships & media inquiries.',
|
||||
pressMedia: 'Press & Media',
|
||||
pressMediaDesc: 'Latest news & brand assets.',
|
||||
latestAudit: 'Latest Audit:',
|
||||
auditInfo: 'Oct 2025 (Certik)',
|
||||
privacyPolicy: 'Privacy Policy',
|
||||
termsOfService: 'Terms of Service'
|
||||
}
|
||||
};
|
||||
|
||||
const t = content[language];
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Backdrop */}
|
||||
<div
|
||||
className="fixed inset-0 bg-black/20 z-40 animate-fade-in"
|
||||
onClick={onClose}
|
||||
/>
|
||||
|
||||
{/* Menu */}
|
||||
<div className="fixed left-1/2 -translate-x-1/2 bg-white rounded-2xl shadow-xl border border-[#e5e7eb] p-6 z-50 animate-slide-down"
|
||||
style={{ width: '1080px', top: '90px' }}
|
||||
>
|
||||
<div className="flex flex-row gap-8">
|
||||
{/* Left Column - Documentation & Learning */}
|
||||
<div className="flex flex-col gap-2 w-[340px]">
|
||||
{/* Section Title */}
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.docLearning}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Docs Card */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#111827] rounded-xl w-12 h-12 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-10.svg"
|
||||
alt="Docs"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1 flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.docs}
|
||||
</span>
|
||||
<div className="bg-green-50 rounded px-2 py-0.5">
|
||||
<span className="text-green-600 font-inter text-xs font-medium">
|
||||
{t.docsBadge}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-[#9ca1af] font-inter text-xs leading-relaxed">
|
||||
{t.docsDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Trust & Security Card */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-12 h-12 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-11.svg"
|
||||
alt="Trust & Security"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1 flex-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.trustSecurity}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs leading-relaxed">
|
||||
{t.trustSecurityDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Middle Column - Image + Help & Support */}
|
||||
<div className="flex flex-col gap-6 flex-1 min-w-[380px]">
|
||||
{/* Image */}
|
||||
<div className="bg-[#f9fafb] rounded-xl p-3 flex items-center justify-center">
|
||||
<Image
|
||||
src="/image-280.png"
|
||||
alt="Resource Showcase"
|
||||
width={96}
|
||||
height={96}
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Help & Support */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.helpSupport}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
{/* Learning Center */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-12.svg"
|
||||
alt="Learning Center"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.learningCenter}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.learningCenterDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Community Forum */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/communication-chat-conversation0.svg"
|
||||
alt="Community Forum"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.communityForum}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.communityForumDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Contact Support */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-13.svg"
|
||||
alt="Contact Support"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.contactSupport}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.contactSupportDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Column - Company */}
|
||||
<div className="flex flex-col gap-2 w-[280px]">
|
||||
<div className="px-4 py-2">
|
||||
<span className="text-[#9ca1af] font-inter text-xs font-medium tracking-wider">
|
||||
{t.company}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
{/* About Team */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-14.svg"
|
||||
alt="About Team"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.aboutTeam}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.aboutTeamDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Careers */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-20-dark.svg"
|
||||
alt="Careers"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.careers}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.careersDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Contact Us */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-21.svg"
|
||||
alt="Contact Us"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.contactUs}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.contactUsDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Press & Media */}
|
||||
<div className="bg-transparent hover:bg-[#f9fafb] border border-transparent hover:border-[#e5e7eb] rounded-xl p-3 flex gap-2 cursor-pointer transition-all">
|
||||
<div className="bg-[#f3f4f6] rounded-xl w-8 h-8 flex items-center justify-center flex-shrink-0">
|
||||
<Image
|
||||
src="/component-22.svg"
|
||||
alt="Press & Media"
|
||||
width={16}
|
||||
height={16}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">
|
||||
{t.pressMedia}
|
||||
</span>
|
||||
<p className="text-[#9ca1af] font-inter text-xs">
|
||||
{t.pressMediaDesc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bottom Border */}
|
||||
<div className="border-t border-[#f3f4f6] mt-6 pt-4 flex items-center justify-between">
|
||||
<div className="text-[#9ca1af] font-inter text-sm">
|
||||
<span className="font-medium">{t.latestAudit}</span>
|
||||
<span className="ml-1 text-[#111827] font-bold">{t.auditInfo}</span>
|
||||
</div>
|
||||
<div className="flex gap-4">
|
||||
<div className="text-[#9ca1af] font-inter text-sm cursor-pointer hover:text-[#111827] transition-colors">
|
||||
{t.privacyPolicy}
|
||||
</div>
|
||||
<div className="text-[#9ca1af] font-inter text-sm cursor-pointer hover:text-[#111827] transition-colors">
|
||||
{t.termsOfService}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
224
components/SecuritySection.tsx
Normal file
224
components/SecuritySection.tsx
Normal file
@@ -0,0 +1,224 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function SecuritySection() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [visible, setVisible] = useState(false);
|
||||
const sectionRef = useRef<HTMLElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting && !visible) {
|
||||
setVisible(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
{
|
||||
threshold: 0.1,
|
||||
}
|
||||
);
|
||||
|
||||
if (sectionRef.current) {
|
||||
observer.observe(sectionRef.current);
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (sectionRef.current) {
|
||||
observer.unobserve(sectionRef.current);
|
||||
}
|
||||
};
|
||||
}, [visible]);
|
||||
|
||||
const features = [
|
||||
{
|
||||
icon: '/interface-search-magnifying-glass0.svg',
|
||||
title: 'Audited',
|
||||
description: 'Smart contracts audited by top-tier firms. Underlying assets undergo strict due diligence and financial auditing.',
|
||||
position: 'top-left'
|
||||
},
|
||||
{
|
||||
icon: '/navigation-building-010.svg',
|
||||
title: 'Segregated',
|
||||
description: 'SPV Setup. User assets are held in segregated Special Purpose Vehicles, isolated from platform risks.',
|
||||
position: 'top-right'
|
||||
},
|
||||
{
|
||||
icon: '/interface-chart-bar-vertical-010.svg',
|
||||
title: 'Transparency',
|
||||
description: 'Real-Time NAV. Fund performance data and asset valuations are publicly available and updated on-chain.',
|
||||
position: 'bottom-left'
|
||||
},
|
||||
{
|
||||
icon: '/component-11.svg',
|
||||
title: 'Powered By NASDAQ & HKEX Listed Partners',
|
||||
description: null,
|
||||
position: 'bottom-right',
|
||||
special: true
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
ref={sectionRef}
|
||||
className="bg-black flex flex-col items-center justify-start self-stretch flex-shrink-0 w-full relative"
|
||||
style={{
|
||||
padding: '1px 24px 0px 24px',
|
||||
gap: '40px'
|
||||
}}
|
||||
>
|
||||
{/* Main Container */}
|
||||
<div className="flex flex-row items-start justify-start flex-shrink-0 w-[1440px] relative">
|
||||
|
||||
{/* Left Side - Title */}
|
||||
<div
|
||||
className={`flex flex-row items-center justify-center flex-shrink-0 w-[459px] h-[604px] relative transition-all duration-700 ease-out ${
|
||||
mounted && visible
|
||||
? 'translate-x-0 opacity-100'
|
||||
: '-translate-x-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#222222',
|
||||
borderWidth: '0px 0px 1px 0px',
|
||||
padding: '180px 24px 180px 120px'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-6 items-start justify-start flex-1 relative">
|
||||
<h2
|
||||
className="text-[#fcfcfd] text-left relative self-stretch font-domine"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '120%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Security First Architecture
|
||||
</h2>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative w-[290px] flex items-center justify-start font-domine"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Real-time data transparency with segregated asset management.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Side - Grid */}
|
||||
<div
|
||||
className="flex-shrink-0 grid gap-0 relative"
|
||||
style={{
|
||||
width: '981px',
|
||||
gridTemplateColumns: 'repeat(2, minmax(0, 1fr))',
|
||||
gridTemplateRows: 'repeat(2, fit-content(100%))'
|
||||
}}
|
||||
>
|
||||
{features.map((feature, index) => (
|
||||
<div
|
||||
key={feature.title}
|
||||
className={`flex flex-col items-start justify-center relative transition-all duration-700 ease-out ${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#222222',
|
||||
borderWidth:
|
||||
feature.position === 'top-left' ? '0px 1px 1px 1px' :
|
||||
feature.position === 'top-right' ? '0px 0px 1px 0px' :
|
||||
feature.position === 'bottom-left' ? '0px 1px 1px 1px' :
|
||||
'0px 1px 1px 0px',
|
||||
padding: '72px 48px 72px 48px',
|
||||
gridColumn: feature.position.includes('left') ? '1 / span 1' : '2 / span 1',
|
||||
gridRow: feature.position.includes('top') ? '1 / span 1' : '2 / span 1',
|
||||
height: feature.position === 'bottom-right' ? '302px' : 'auto',
|
||||
transitionDelay: `${index * 150}ms`
|
||||
}}
|
||||
>
|
||||
{feature.special ? (
|
||||
// Special card (bottom-right)
|
||||
<div className="flex flex-col gap-6 items-start justify-center self-stretch flex-shrink-0 h-[166px] relative">
|
||||
<div className="flex flex-col gap-4 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<h3
|
||||
className="text-[#fcfcfd] text-left relative self-stretch font-domine"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '140%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{feature.title}
|
||||
</h3>
|
||||
<Image
|
||||
src={feature.icon}
|
||||
alt="Icon"
|
||||
width={24}
|
||||
height={24}
|
||||
className="flex-shrink-0"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
// Regular cards
|
||||
<div className="flex flex-col gap-6 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<Image
|
||||
src={feature.icon}
|
||||
alt={feature.title}
|
||||
width={32}
|
||||
height={32}
|
||||
className="flex-shrink-0"
|
||||
/>
|
||||
<div className="flex flex-col gap-2 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<h3
|
||||
className="text-[#fcfcfd] text-left relative self-stretch font-inter"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '130%',
|
||||
letterSpacing: '-0.005em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
{feature.title}
|
||||
</h3>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative self-stretch font-inter"
|
||||
style={{
|
||||
fontSize: '14px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
{feature.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Logo */}
|
||||
<div className="flex-shrink-0 w-[1200px] h-[187px] relative">
|
||||
<Image
|
||||
src="/logo1.svg"
|
||||
alt="Logo"
|
||||
width={1200}
|
||||
height={187}
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
395
components/StatsSection.tsx
Normal file
395
components/StatsSection.tsx
Normal file
@@ -0,0 +1,395 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
// 数字增长动画Hook
|
||||
function useCountUp(end: number, duration: number = 1500, startRangePercent: number = 0.75) {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [count, setCount] = useState(end); // 初始值设为目标值，避免hydration错误
|
||||
const [hasAnimated, setHasAnimated] = useState(false);
|
||||
const elementRef = useRef<HTMLDivElement>(null);
|
||||
const startValueRef = useRef<number>(end);
|
||||
|
||||
// 客户端挂载后设置随机起始值
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
startValueRef.current = Math.floor(end * (startRangePercent + Math.random() * 0.15));
|
||||
setCount(startValueRef.current);
|
||||
}, [end, startRangePercent]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!mounted) return;
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
if (entries[0].isIntersecting && !hasAnimated) {
|
||||
setHasAnimated(true);
|
||||
const start = startValueRef.current;
|
||||
const startTime = Date.now();
|
||||
|
||||
const timer = setInterval(() => {
|
||||
const elapsed = Date.now() - startTime;
|
||||
const progress = Math.min(elapsed / duration, 1);
|
||||
|
||||
// 使用缓动函数 - easeOutCubic 更自然
|
||||
const easeOutCubic = 1 - Math.pow(1 - progress, 3);
|
||||
const currentCount = Math.floor(start + (end - start) * easeOutCubic);
|
||||
|
||||
setCount(currentCount);
|
||||
|
||||
if (progress === 1) {
|
||||
setCount(end); // 确保最终值准确
|
||||
clearInterval(timer);
|
||||
}
|
||||
}, 16);
|
||||
|
||||
return () => clearInterval(timer);
|
||||
}
|
||||
},
|
||||
{ threshold: 0.1 }
|
||||
);
|
||||
|
||||
if (elementRef.current) {
|
||||
observer.observe(elementRef.current);
|
||||
}
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, [end, duration, hasAnimated, mounted]);
|
||||
|
||||
return { count, elementRef };
|
||||
}
|
||||
|
||||
// 格式化数字 - 确保始终显示正确的单位
|
||||
function formatNumber(num: number, prefix: string = '', suffix: string = '', forceUnit: 'M' | 'K' | '' = '') {
|
||||
if (forceUnit === 'M') {
|
||||
return `${prefix}${Math.floor(num)}${suffix}`;
|
||||
} else if (forceUnit === 'K') {
|
||||
return `${prefix}${Math.floor(num)}${suffix}`;
|
||||
} else if (num >= 1000000) {
|
||||
return `${prefix}${Math.floor(num / 1000000)}M${suffix}`;
|
||||
} else if (num >= 1000) {
|
||||
return `${prefix}${Math.floor(num / 1000)}K${suffix}`;
|
||||
}
|
||||
return `${prefix}${num.toLocaleString()}${suffix}`;
|
||||
}
|
||||
|
||||
export default function StatsSection() {
|
||||
const tvl = useCountUp(485, 1500, 0.80); // 从80-95%开始
|
||||
const apy = useCountUp(515, 1500, 0.85); // 5.15 * 100，从85-100%开始
|
||||
const yield_ = useCountUp(45, 1500, 0.75); // 从75-90%开始
|
||||
const users = useCountUp(23928, 1800, 0.80); // 从80-95%开始
|
||||
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [imagesVisible, setImagesVisible] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
// 客户端挂载
|
||||
setMounted(true);
|
||||
|
||||
// 延迟显示图片动画
|
||||
const timer = setTimeout(() => {
|
||||
setImagesVisible(true);
|
||||
}, 500);
|
||||
return () => clearTimeout(timer);
|
||||
}, []);
|
||||
return (
|
||||
<section
|
||||
className="bg-white flex flex-row items-center justify-center flex-shrink-0 w-full relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '0px 0px 1px 0px',
|
||||
padding: '0px 0px 1px 0px'
|
||||
}}
|
||||
>
|
||||
{/* .section2 */}
|
||||
<div
|
||||
className="flex flex-row items-center justify-center w-[1440px] h-[183px] relative"
|
||||
>
|
||||
{/* .container4 - Grid container */}
|
||||
<div
|
||||
className="flex-shrink-0 grid gap-0 relative w-full"
|
||||
style={{
|
||||
gridTemplateColumns: 'repeat(4, minmax(0, 1fr))',
|
||||
gridTemplateRows: 'repeat(1, minmax(0, 1fr))'
|
||||
}}
|
||||
>
|
||||
{/* Card 1 - Total Value Locked */}
|
||||
<div
|
||||
className="bg-white flex flex-row items-center justify-between h-[182px] relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '0px 1px 0px 0px',
|
||||
gridColumn: '1 / span 1',
|
||||
gridRow: '1 / span 1'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-2 items-start justify-center flex-1 relative">
|
||||
<div
|
||||
className="text-[#4b5563] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Total Value Locked
|
||||
</div>
|
||||
<div
|
||||
ref={tvl.elementRef}
|
||||
className="text-[#111827] text-left relative font-jetbrains"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '110%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 800
|
||||
}}
|
||||
>
|
||||
{formatNumber(tvl.count, '$', 'M+', 'M')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Card 2 - Avg. APY */}
|
||||
<div
|
||||
className="bg-white flex flex-row items-center justify-between h-[182px] relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '0px 1px 0px 0px',
|
||||
padding: '0px 32px',
|
||||
gridColumn: '2 / span 1',
|
||||
gridRow: '1 / span 1'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-2 items-start justify-center flex-1 relative">
|
||||
<div
|
||||
className="text-[#4b5563] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Avg. APY
|
||||
</div>
|
||||
<div
|
||||
ref={apy.elementRef}
|
||||
className="text-[#111827] text-left relative font-jetbrains"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '110%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 800
|
||||
}}
|
||||
>
|
||||
{(apy.count / 100).toFixed(2)}%
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Card 3 - Yield Captured */}
|
||||
<div
|
||||
className="bg-white flex flex-row items-center justify-between h-[182px] relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '0px 1px 0px 0px',
|
||||
padding: '0px 32px',
|
||||
gridColumn: '3 / span 1',
|
||||
gridRow: '1 / span 1'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-2 items-start justify-center flex-1 relative">
|
||||
<div
|
||||
className="text-[#4b5563] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Yield Captured
|
||||
</div>
|
||||
<div
|
||||
ref={yield_.elementRef}
|
||||
className="text-[#111827] text-left relative self-stretch font-jetbrains"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '110%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 800
|
||||
}}
|
||||
>
|
||||
{formatNumber(yield_.count, '$', 'M', 'M')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Card 4 - Connected Users */}
|
||||
<div
|
||||
className="bg-white flex flex-row items-center justify-between h-[182px] relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: 'transparent',
|
||||
borderWidth: '0px 1px 0px 0px',
|
||||
padding: '0px 0px 0px 32px',
|
||||
gridColumn: '4 / span 1',
|
||||
gridRow: '1 / span 1'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-2 items-start justify-center flex-1 relative">
|
||||
<div
|
||||
className="text-[#4b5563] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Connected Users
|
||||
</div>
|
||||
|
||||
{/* .frame-38 - Number and avatars */}
|
||||
<div className="flex flex-row items-center justify-between self-stretch flex-shrink-0 relative">
|
||||
{/* Number */}
|
||||
<div
|
||||
ref={users.elementRef}
|
||||
className="text-[#111827] text-left relative font-jetbrains"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '110%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 800
|
||||
}}
|
||||
>
|
||||
{users.count.toLocaleString()}+
|
||||
</div>
|
||||
|
||||
{/* .container9 - Avatar group */}
|
||||
<div className="flex flex-row items-center justify-start flex-shrink-0 relative overflow-hidden">
|
||||
{/* Avatar 1 - image-23 */}
|
||||
<div
|
||||
className={`flex-shrink-0 w-9 h-9 relative overflow-hidden border-white transition-all duration-700 ease-out ${
|
||||
mounted && imagesVisible ? 'translate-y-0 opacity-100' : 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
borderRadius: '15239273px',
|
||||
borderStyle: 'solid',
|
||||
borderWidth: '1.82px',
|
||||
padding: '1.82px',
|
||||
aspectRatio: 1,
|
||||
transitionDelay: '100ms'
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src="/image-230.png"
|
||||
alt="User"
|
||||
width={33}
|
||||
height={33}
|
||||
className="absolute object-cover"
|
||||
style={{
|
||||
left: '1.82px',
|
||||
top: '1.82px',
|
||||
aspectRatio: 1
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Avatar 2 - image-24 */}
|
||||
<div
|
||||
className={`flex-shrink-0 w-9 h-9 relative overflow-hidden border-white transition-all duration-700 ease-out ${
|
||||
mounted && imagesVisible ? 'translate-y-0 opacity-100' : 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
margin: '0 0 0 -8px',
|
||||
borderRadius: '15239273px',
|
||||
borderStyle: 'solid',
|
||||
borderWidth: '1.82px',
|
||||
padding: '1.82px',
|
||||
aspectRatio: 1,
|
||||
transitionDelay: '200ms'
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src="/image-240.png"
|
||||
alt="User"
|
||||
width={36}
|
||||
height={36}
|
||||
className="absolute object-cover"
|
||||
style={{
|
||||
left: '0px',
|
||||
top: '0px',
|
||||
aspectRatio: 1
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Avatar 3 - image-25 */}
|
||||
<div
|
||||
className={`flex-shrink-0 w-9 h-9 relative overflow-hidden border-white transition-all duration-700 ease-out ${
|
||||
mounted && imagesVisible ? 'translate-y-0 opacity-100' : 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
margin: '0 0 0 -8px',
|
||||
borderRadius: '15239273px',
|
||||
borderStyle: 'solid',
|
||||
borderWidth: '1.82px',
|
||||
padding: '1.82px',
|
||||
aspectRatio: 1,
|
||||
transitionDelay: '300ms'
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src="/image-250.png"
|
||||
alt="User"
|
||||
width={40}
|
||||
height={40}
|
||||
className="absolute object-cover"
|
||||
style={{
|
||||
left: '6px',
|
||||
top: '0.5px',
|
||||
aspectRatio: 1
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Avatar 4 - image-252 */}
|
||||
<div
|
||||
className={`flex-shrink-0 w-9 h-9 relative overflow-hidden border-white transition-all duration-700 ease-out ${
|
||||
mounted && imagesVisible ? 'translate-y-0 opacity-100' : 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
margin: '0 0 0 -8px',
|
||||
borderRadius: '15239273px',
|
||||
borderStyle: 'solid',
|
||||
borderWidth: '1.82px',
|
||||
padding: '1.82px',
|
||||
aspectRatio: 1,
|
||||
transitionDelay: '400ms'
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src="/image-251.png"
|
||||
alt="User"
|
||||
width={36}
|
||||
height={36}
|
||||
className="absolute object-cover"
|
||||
style={{
|
||||
left: '0px',
|
||||
top: '0px',
|
||||
aspectRatio: 1
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
131
components/TrustedBySection.tsx
Normal file
131
components/TrustedBySection.tsx
Normal file
@@ -0,0 +1,131 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function TrustedBySection() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [visible, setVisible] = useState(false);
|
||||
const sectionRef = useRef<HTMLElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
|
||||
// 使用 IntersectionObserver 检测元素进入视口
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting && !visible) {
|
||||
setVisible(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
{
|
||||
threshold: 0.2, // 当20%的元素可见时触发
|
||||
}
|
||||
);
|
||||
|
||||
if (sectionRef.current) {
|
||||
observer.observe(sectionRef.current);
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (sectionRef.current) {
|
||||
observer.unobserve(sectionRef.current);
|
||||
}
|
||||
};
|
||||
}, [visible]);
|
||||
|
||||
// 合作伙伴 logo 数据
|
||||
const partners = [
|
||||
{
|
||||
name: 'BlackRock',
|
||||
src: '/nav-ireland0.svg',
|
||||
width: 193,
|
||||
height: 28,
|
||||
className: 'w-[193px] h-[28px]'
|
||||
},
|
||||
{
|
||||
name: 'Coinbase',
|
||||
src: '/coinbase-10.svg',
|
||||
width: 179,
|
||||
height: 32,
|
||||
className: 'w-[179px] h-[32px]'
|
||||
},
|
||||
{
|
||||
name: 'Wintermute',
|
||||
src: '/wintermute0.svg',
|
||||
width: 247,
|
||||
height: 40,
|
||||
className: 'w-[247px] h-[40px]'
|
||||
},
|
||||
{
|
||||
name: 'Circle',
|
||||
src: '/group0.svg',
|
||||
width: 156,
|
||||
height: 40,
|
||||
className: 'w-[156px] h-[40px]'
|
||||
},
|
||||
{
|
||||
name: 'ConsenSys',
|
||||
src: '/logo1.svg', // 临时使用一个 logo
|
||||
width: 176,
|
||||
height: 40,
|
||||
className: 'w-[176px] h-[40px]'
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
ref={sectionRef}
|
||||
className="bg-[#f9fafb] flex flex-col items-center justify-center flex-shrink-0 w-full relative"
|
||||
style={{
|
||||
borderStyle: 'solid',
|
||||
borderColor: '#e5e7eb',
|
||||
borderWidth: '0px 0px 1px 0px',
|
||||
padding: '80px 0px',
|
||||
gap: '32px'
|
||||
}}
|
||||
>
|
||||
{/* 标题 - .text6 */}
|
||||
<div
|
||||
className="text-[#111827] text-center relative flex items-center justify-center font-inter"
|
||||
style={{
|
||||
fontSize: '18px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 500
|
||||
}}
|
||||
>
|
||||
Trusted by Industry Leaders
|
||||
</div>
|
||||
|
||||
{/* Logo容器 - .frame-26 */}
|
||||
<div
|
||||
className="flex flex-row items-center justify-between flex-shrink-0 w-[1200px] relative"
|
||||
>
|
||||
{partners.map((partner, index) => (
|
||||
<div
|
||||
key={partner.name}
|
||||
className={`flex-shrink-0 relative overflow-hidden transition-all duration-700 ease-out ${partner.className} ${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}`}
|
||||
style={{
|
||||
transitionDelay: `${index * 150}ms`, // 每个logo延迟150ms
|
||||
aspectRatio: `${partner.width}/${partner.height}`
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src={partner.src}
|
||||
alt={partner.name}
|
||||
width={partner.width}
|
||||
height={partner.height}
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
310
components/WhyAssetXSection.tsx
Normal file
310
components/WhyAssetXSection.tsx
Normal file
@@ -0,0 +1,310 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect, useRef } from 'react';
|
||||
import Image from 'next/image';
|
||||
|
||||
export default function WhyAssetXSection() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [visible, setVisible] = useState(false);
|
||||
const sectionRef = useRef<HTMLElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting && !visible) {
|
||||
setVisible(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
{
|
||||
threshold: 0.1,
|
||||
}
|
||||
);
|
||||
|
||||
if (sectionRef.current) {
|
||||
observer.observe(sectionRef.current);
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (sectionRef.current) {
|
||||
observer.unobserve(sectionRef.current);
|
||||
}
|
||||
};
|
||||
}, [visible]);
|
||||
|
||||
const features = [
|
||||
{
|
||||
id: 'sustainable',
|
||||
icon: '/system-data0.svg',
|
||||
title: 'Sustainable Real Yield',
|
||||
description: 'Access 15%-30% returns from Delta-neutral arbitrage strategies and commercial credit. No inflationary token emissions, just real profits.',
|
||||
image: '/frame-110.svg',
|
||||
imageWidth: 305,
|
||||
imageHeight: 162,
|
||||
large: true
|
||||
},
|
||||
{
|
||||
id: 'reliability',
|
||||
icon: '/warning-shield-check0.svg',
|
||||
title: 'Proven Reliability',
|
||||
description: 'Backed by partners holding HK SFC Licenses (1/2/4/5/9) and NASDAQ-listed entities. Audited, compliant, and transparent.',
|
||||
rightIcon: '/icon0.svg',
|
||||
large: false
|
||||
},
|
||||
{
|
||||
id: 'liquidity',
|
||||
icon: '/arrow-arrow-left-right0.svg',
|
||||
title: 'Flexible Liquidity',
|
||||
description: 'Solve the illiquidity of traditional finance. Enjoy instant exit via secondary markets or leverage your positions for up to 40% APY.',
|
||||
badges: ['40%+ APR', 'Instant Exit'],
|
||||
large: false
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section
|
||||
ref={sectionRef}
|
||||
className="flex flex-row items-center justify-center flex-wrap flex-shrink-0 w-full relative"
|
||||
style={{
|
||||
padding: '80px 0px',
|
||||
gap: '40px',
|
||||
alignContent: 'center'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col items-center justify-center w-[1200px]">
|
||||
{/* Header - .frame-27 */}
|
||||
<div className="flex flex-col gap-2 items-start justify-start flex-shrink-0 w-[1200px] relative mb-10">
|
||||
{/* Title - .why-assetx */}
|
||||
<h2
|
||||
className="text-[#111827] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '48px',
|
||||
lineHeight: '120%',
|
||||
letterSpacing: '-0.01em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Why ASSETX?
|
||||
</h2>
|
||||
|
||||
{/* Subtitle */}
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '20px',
|
||||
lineHeight: '140%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Institutional-grade access to real-world yield, with DeFi-native composability.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Cards Container - .frame-30 */}
|
||||
<div className="flex flex-row gap-6 items-center justify-start flex-shrink-0 w-[1199px] relative">
|
||||
|
||||
{/* Left Large Card - Sustainable Real Yield */}
|
||||
<div
|
||||
className={`bg-white rounded-[24px] border border-[#e5e7eb] p-10 flex flex-col items-start justify-between self-stretch flex-1 relative overflow-hidden
|
||||
${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}
|
||||
hover:-translate-y-2 hover:shadow-xl`}
|
||||
style={{
|
||||
transition: 'transform 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.7s ease-out, translate 0.7s ease-out'
|
||||
}}
|
||||
>
|
||||
{/* .frame-33 */}
|
||||
<div className="flex flex-col gap-6 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
{/* Icon Container - .container12 */}
|
||||
<div className="bg-[#f9fafb] rounded-[16px] flex flex-row items-center justify-center flex-shrink-0 w-12 h-12 relative">
|
||||
<Image
|
||||
src="/system-data0.svg"
|
||||
alt="System Data"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Text Content - .frame-31 */}
|
||||
<div className="flex flex-col gap-4 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<h3
|
||||
className="text-[#111827] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '130%',
|
||||
letterSpacing: '-0.005em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Sustainable Real Yield
|
||||
</h3>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative self-stretch font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Access 15%-30% returns from Delta-neutral arbitrage strategies and commercial credit. No inflationary token emissions, just real profits.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Chart Image - .frame-11 */}
|
||||
<Image
|
||||
src="/frame-110.svg"
|
||||
alt="Chart"
|
||||
width={305}
|
||||
height={162}
|
||||
className="flex-shrink-0 relative"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Right Column - .frame-29 */}
|
||||
<div className="flex flex-col gap-6 items-start justify-start flex-shrink-0 w-[790px] relative">
|
||||
|
||||
{/* Proven Reliability Card */}
|
||||
<div
|
||||
className={`bg-white rounded-[24px] border border-[#e5e7eb] p-10 flex flex-col items-start justify-start self-stretch flex-shrink-0 relative overflow-hidden
|
||||
${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}
|
||||
hover:-translate-y-2 hover:shadow-xl`}
|
||||
style={{
|
||||
transition: 'transform 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.7s ease-out 0.15s, translate 0.7s ease-out 0.15s'
|
||||
}}
|
||||
>
|
||||
{/* .features2 */}
|
||||
<div className="flex flex-row items-center justify-between self-stretch flex-shrink-0 relative">
|
||||
{/* Left Content - .container13 */}
|
||||
<div className="flex flex-col gap-6 items-start justify-start flex-shrink-0 w-[414px] relative">
|
||||
{/* Icon */}
|
||||
<div className="bg-[#f9fafb] rounded-[16px] flex flex-row items-center justify-center flex-shrink-0 w-12 h-12 relative">
|
||||
<Image
|
||||
src="/warning-shield-check0.svg"
|
||||
alt="Shield Check"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Text - .frame-28 */}
|
||||
<div className="flex flex-col gap-4 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<h3
|
||||
className="text-[#111827] text-left relative self-stretch font-inter"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '130%',
|
||||
letterSpacing: '-0.005em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Proven Reliability
|
||||
</h3>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Backed by partners holding HK SFC Licenses (1/2/4/5/9) and NASDAQ-listed entities. Audited, compliant, and transparent.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Right Icon */}
|
||||
<div className="flex items-center justify-center">
|
||||
<Image
|
||||
src="/icon0.svg"
|
||||
alt="Icon"
|
||||
width={200}
|
||||
height={200}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Flexible Liquidity Card */}
|
||||
<div
|
||||
className={`bg-white rounded-[24px] border border-[#e5e7eb] p-10 flex flex-col items-start justify-start self-stretch flex-shrink-0 relative overflow-hidden
|
||||
${
|
||||
mounted && visible
|
||||
? 'translate-y-0 opacity-100'
|
||||
: 'translate-y-12 opacity-0'
|
||||
}
|
||||
hover:-translate-y-2 hover:shadow-xl`}
|
||||
style={{
|
||||
transition: 'transform 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.7s ease-out 0.3s, translate 0.7s ease-out 0.3s'
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col gap-6 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
{/* Top Section with Icon and Badges */}
|
||||
<div className="flex flex-col gap-6 items-start justify-start flex-shrink-0 relative">
|
||||
{/* Icon and Badges Row */}
|
||||
<div className="flex flex-row gap-6 items-center justify-start relative">
|
||||
{/* Icon */}
|
||||
<div className="bg-[#f9fafb] rounded-[16px] flex flex-row items-center justify-center flex-shrink-0 w-12 h-12 relative">
|
||||
<Image
|
||||
src="/arrow-arrow-left-right0.svg"
|
||||
alt="Arrow"
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Badges */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="bg-[#f9fafb] rounded-lg px-3 py-1 flex items-center justify-center">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">40%+ APR</span>
|
||||
</div>
|
||||
<div className="bg-[#f9fafb] rounded-lg px-3 py-1 flex items-center justify-center">
|
||||
<span className="text-[#111827] font-inter text-sm font-bold">Instant Exit</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Text Content */}
|
||||
<div className="flex flex-col gap-4 items-start justify-start self-stretch flex-shrink-0 relative">
|
||||
<h3
|
||||
className="text-[#111827] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '24px',
|
||||
lineHeight: '130%',
|
||||
letterSpacing: '-0.005em',
|
||||
fontWeight: 700
|
||||
}}
|
||||
>
|
||||
Flexible Liquidity
|
||||
</h3>
|
||||
<p
|
||||
className="text-[#9ca1af] text-left relative font-inter"
|
||||
style={{
|
||||
fontSize: '16px',
|
||||
lineHeight: '150%',
|
||||
fontWeight: 400
|
||||
}}
|
||||
>
|
||||
Solve the illiquidity of traditional finance. Enjoy instant exit via secondary markets or leverage your positions for up to 40% APY.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
8
next.config.ts
Normal file
8
next.config.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
import type { NextConfig } from "next";
|
||||
import path from "path";
|
||||
|
||||
const nextConfig: NextConfig = {
|
||||
outputFileTracingRoot: path.join(__dirname),
|
||||
};
|
||||
|
||||
export default nextConfig;
|
||||
6204
package-lock.json
generated
Normal file
6204
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
27
package.json
Normal file
27
package.json
Normal file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "asset-homepage",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev -H 0.0.0.0 -p 3002",
|
||||
"build": "next build",
|
||||
"start": "next start -p 3002",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"next": "^15.1.4",
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20",
|
||||
"@types/react": "^19",
|
||||
"@types/react-dom": "^19",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"eslint": "^8",
|
||||
"eslint-config-next": "^15.1.4",
|
||||
"postcss": "^8.4.49",
|
||||
"tailwindcss": "^3.4.17",
|
||||
"typescript": "^5"
|
||||
}
|
||||
}
|
||||
9
postcss.config.mjs
Normal file
9
postcss.config.mjs
Normal file
@@ -0,0 +1,9 @@
|
||||
/** @type {import('postcss-load-config').Config} */
|
||||
const config = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
|
||||
export default config;
|
||||
3
public/arrow-arrow-left-right0.svg
Normal file
3
public/arrow-arrow-left-right0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16 13L19 16M19 16L16 19M19 16H5M8 11L5 8M5 8L8 5M5 8H19" stroke="#111827" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 253 B |
10
public/coinbase-10.svg
Normal file
10
public/coinbase-10.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg width="179" height="32" viewBox="0 0 179 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4_10487)">
|
||||
<path d="M36.1269 8.93379C29.6243 8.93379 24.5434 13.8739 24.5434 20.4872C24.5434 27.1006 29.4959 31.9984 36.1269 31.9984C42.7579 31.9984 47.7966 27.016 47.7966 20.4449C47.7966 13.9162 42.844 8.93379 36.1269 8.93379ZM36.1708 27.2323C32.4678 27.2323 29.7543 24.3541 29.7543 20.4888C29.7543 16.5797 32.4239 13.7031 36.1269 13.7031C39.8738 13.7031 42.5857 16.6236 42.5857 20.4888C42.5857 24.3541 39.8738 27.2323 36.1708 27.2323ZM49.2167 13.9601H52.4469V31.5707H57.6139V9.36308H49.2167V13.9601ZM11.5397 13.7015C14.2532 13.7015 16.4061 15.3764 17.2234 17.8676H22.6927C21.7015 12.5421 17.3095 8.93379 11.5836 8.93379C5.08091 8.93379 0 13.8739 0 20.4888C0 27.1038 4.95254 32 11.5836 32C17.1812 32 21.6593 28.3917 22.6504 23.0223H17.2234C16.4484 25.5135 14.2954 27.2323 11.5819 27.2323C7.83503 27.2323 5.20927 24.3541 5.20927 20.4888C5.21089 16.5797 7.79441 13.7015 11.5397 13.7015ZM147.393 18.3408L143.604 17.783C141.796 17.5261 140.504 16.9244 140.504 15.5065C140.504 13.9601 142.184 13.1877 144.465 13.1877C146.963 13.1877 148.557 14.2609 148.901 16.022H153.896C153.335 11.5551 149.891 8.93541 144.595 8.93541C139.126 8.93541 135.509 11.7274 135.509 15.6788C135.509 19.4579 137.878 21.6499 142.657 22.3361L146.446 22.8938C148.298 23.1508 149.332 23.8825 149.332 25.2566C149.332 27.0176 147.523 27.7478 145.026 27.7478C141.968 27.7478 140.246 26.5022 139.987 24.6126H134.906C135.381 28.9511 138.782 32 144.982 32C150.624 32 154.369 29.4226 154.369 24.998C154.369 21.0466 151.657 18.9847 147.393 18.3408ZM55.0304 0.214645C53.1358 0.214645 51.7141 1.5887 51.7141 3.47823C51.7141 5.36775 53.1342 6.74181 55.0304 6.74181C56.925 6.74181 58.3467 5.36775 58.3467 3.47823C58.3467 1.5887 56.925 0.214645 55.0304 0.214645ZM130.859 16.9667C130.859 12.1567 127.931 8.93541 121.731 8.93541C115.875 8.93541 112.602 11.8998 111.955 16.4529H117.08C117.339 14.6918 118.716 13.2316 121.644 13.2316C124.272 13.2316 125.564 14.391 125.564 15.8089C125.564 17.6562 123.195 18.1278 120.267 18.4286C116.305 18.8579 111.396 20.2319 111.396 25.3867C111.396 29.382 114.368 31.9577 119.105 31.9577C122.808 31.9577 125.133 30.4113 126.296 27.9624C126.469 30.1528 128.105 31.5707 130.388 31.5707H133.402V26.9754H130.861V16.9667H130.859ZM125.778 22.5507C125.778 25.5151 123.195 27.7055 120.05 27.7055C118.112 27.7055 116.476 26.8892 116.476 25.172C116.476 22.9817 119.103 22.38 121.514 22.1231C123.84 21.9084 125.131 21.393 125.778 20.4043V22.5507ZM98.3489 8.93379C95.4632 8.93379 93.0519 10.1371 91.3296 12.1551V0H86.1626V31.5707H91.2435V28.6502C92.9658 30.7544 95.421 32 98.3489 32C104.549 32 109.244 27.1038 109.244 20.4888C109.244 13.8739 104.463 8.93379 98.3489 8.93379ZM97.5739 27.2323C93.8708 27.2323 91.1573 24.3541 91.1573 20.4888C91.1573 16.6236 93.9131 13.7031 97.6161 13.7031C101.363 13.7031 103.989 16.5813 103.989 20.4888C103.989 24.3541 101.277 27.2323 97.5739 27.2323ZM73.8039 8.93379C70.4454 8.93379 68.2486 10.3078 66.9568 12.2413V9.36308H61.8321V31.5691H66.9991V19.5002C66.9991 16.1065 69.152 13.7015 72.3383 13.7015C75.3102 13.7015 77.1609 15.8057 77.1609 18.8562V31.5707H82.3279V18.4709C82.3295 12.8852 79.4454 8.93379 73.8039 8.93379ZM179 19.7587C179 13.4023 174.35 8.93541 168.105 8.93541C161.474 8.93541 156.608 13.9178 156.608 20.4888C156.608 27.4046 161.819 32 168.191 32C173.575 32 177.794 28.821 178.87 24.3118H173.487C172.712 26.2875 170.817 27.4046 168.276 27.4046C164.96 27.4046 162.462 25.3428 161.903 21.7344H178.998V19.7587H179ZM162.206 18.0399C163.024 14.9471 165.35 13.4446 168.019 13.4446C170.947 13.4446 173.186 15.1195 173.703 18.0399H162.206Z" fill="#9CA1AF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4_10487">
|
||||
<rect width="179" height="32" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.7 KiB |
3
public/communication-chat-conversation0.svg
Normal file
3
public/communication-chat-conversation0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.6667 5.33317H13.3333C13.7015 5.33317 14 5.63165 14 5.99984V13.3332L11.778 11.4871C11.6583 11.3877 11.5072 11.3332 11.3516 11.3332H6C5.63181 11.3332 5.33333 11.0347 5.33333 10.6665V8.6665M10.6667 5.33317V3.33317C10.6667 2.96498 10.3682 2.6665 10 2.6665H2.66667C2.29848 2.6665 2 2.96498 2 3.33317V10.6667L4.22201 8.82038C4.3417 8.72094 4.49283 8.6665 4.64844 8.6665H5.33333M10.6667 5.33317V7.99984C10.6667 8.36803 10.3682 8.6665 10 8.6665H5.33333" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 647 B |
4
public/component-10.svg
Normal file
4
public/component-10.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8 4.6665V13.9998" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M2.00016 12C1.82335 12 1.65378 11.9298 1.52876 11.8047C1.40373 11.6797 1.3335 11.5101 1.3335 11.3333V2.66667C1.3335 2.48986 1.40373 2.32029 1.52876 2.19526C1.65378 2.07024 1.82335 2 2.00016 2H5.3335C6.04074 2 6.71902 2.28095 7.21911 2.78105C7.71921 3.28115 8.00016 3.95942 8.00016 4.66667C8.00016 3.95942 8.28111 3.28115 8.78121 2.78105C9.28131 2.28095 9.95958 2 10.6668 2H14.0002C14.177 2 14.3465 2.07024 14.4716 2.19526C14.5966 2.32029 14.6668 2.48986 14.6668 2.66667V11.3333C14.6668 11.5101 14.5966 11.6797 14.4716 11.8047C14.3465 11.9298 14.177 12 14.0002 12H10.0002C9.46973 12 8.96102 12.2107 8.58595 12.5858C8.21088 12.9609 8.00016 13.4696 8.00016 14C8.00016 13.4696 7.78945 12.9609 7.41438 12.5858C7.0393 12.2107 6.5306 12 6.00016 12H2.00016Z" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
4
public/component-11.svg
Normal file
4
public/component-11.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M13.3332 8.66664C13.3332 12 10.9998 13.6666 8.2265 14.6333C8.08128 14.6825 7.92353 14.6802 7.77984 14.6266C4.99984 13.6666 2.6665 12 2.6665 8.66664V3.99997C2.6665 3.82316 2.73674 3.65359 2.86177 3.52857C2.98679 3.40355 3.15636 3.33331 3.33317 3.33331C4.6665 3.33331 6.33317 2.53331 7.49317 1.51997C7.63441 1.39931 7.81407 1.33301 7.99984 1.33301C8.1856 1.33301 8.36527 1.39931 8.5065 1.51997C9.67317 2.53997 11.3332 3.33331 12.6665 3.33331C12.8433 3.33331 13.0129 3.40355 13.1379 3.52857C13.2629 3.65359 13.3332 3.82316 13.3332 3.99997V8.66664Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6 7.99984L7.33333 9.33317L10 6.6665" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 875 B |
5
public/component-12.svg
Normal file
5
public/component-12.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M14.2799 7.28125C14.3992 7.2286 14.5005 7.14209 14.5712 7.03245C14.6418 6.9228 14.6788 6.79484 14.6774 6.6644C14.6761 6.53397 14.6365 6.40679 14.5636 6.29863C14.4907 6.19048 14.3876 6.10608 14.2672 6.05591L8.5532 3.45325C8.37949 3.37401 8.19079 3.33301 7.99986 3.33301C7.80894 3.33301 7.62024 3.37401 7.44653 3.45325L1.7332 6.05325C1.61451 6.10523 1.51354 6.19067 1.44264 6.29912C1.37174 6.40758 1.33398 6.53434 1.33398 6.66391C1.33398 6.79348 1.37174 6.92025 1.44264 7.0287C1.51354 7.13716 1.61451 7.2226 1.7332 7.27458L7.44653 9.87991C7.62024 9.95915 7.80894 10.0002 7.99986 10.0002C8.19079 10.0002 8.37949 9.95915 8.5532 9.87991L14.2799 7.28125Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M14.6665 6.6665V10.6665" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M4 8.3335V10.6668C4 11.1973 4.42143 11.706 5.17157 12.081C5.92172 12.4561 6.93913 12.6668 8 12.6668C9.06087 12.6668 10.0783 12.4561 10.8284 12.081C11.5786 11.706 12 11.1973 12 10.6668V8.3335" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
3
public/component-13.svg
Normal file
3
public/component-13.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2 9.33333H4C4.35362 9.33333 4.69276 9.47381 4.94281 9.72386C5.19286 9.97391 5.33333 10.313 5.33333 10.6667V12.6667C5.33333 13.0203 5.19286 13.3594 4.94281 13.6095C4.69276 13.8595 4.35362 14 4 14H3.33333C2.97971 14 2.64057 13.8595 2.39052 13.6095C2.14048 13.3594 2 13.0203 2 12.6667V8C2 6.4087 2.63214 4.88258 3.75736 3.75736C4.88258 2.63214 6.4087 2 8 2C9.5913 2 11.1174 2.63214 12.2426 3.75736C13.3679 4.88258 14 6.4087 14 8V12.6667C14 13.0203 13.8595 13.3594 13.6095 13.6095C13.3594 13.8595 13.0203 14 12.6667 14H12C11.6464 14 11.3072 13.8595 11.0572 13.6095C10.8071 13.3594 10.6667 13.0203 10.6667 12.6667V10.6667C10.6667 10.313 10.8071 9.97391 11.0572 9.72386C11.3072 9.47381 11.6464 9.33333 12 9.33333H14" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 909 B |
6
public/component-14.svg
Normal file
6
public/component-14.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.6668 14V12.6667C10.6668 11.9594 10.3859 11.2811 9.88578 10.781C9.38568 10.281 8.70741 10 8.00016 10H4.00016C3.29292 10 2.61464 10.281 2.11454 10.781C1.61445 11.2811 1.3335 11.9594 1.3335 12.6667V14" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M10.6665 2.08545C11.2383 2.2337 11.7448 2.56763 12.1063 3.03482C12.4678 3.50202 12.664 4.07604 12.664 4.66678C12.664 5.25752 12.4678 5.83154 12.1063 6.29874C11.7448 6.76594 11.2383 7.09987 10.6665 7.24812" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M14.6665 13.9998V12.6664C14.6661 12.0756 14.4694 11.5016 14.1074 11.0346C13.7454 10.5677 13.2386 10.2341 12.6665 10.0864" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.00016 7.33333C7.47292 7.33333 8.66683 6.13943 8.66683 4.66667C8.66683 3.19391 7.47292 2 6.00016 2C4.5274 2 3.3335 3.19391 3.3335 4.66667C3.3335 6.13943 4.5274 7.33333 6.00016 7.33333Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
4
public/component-15.svg
Normal file
4
public/component-15.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18.3337 5.8335L10.8412 10.606C10.5869 10.7537 10.2981 10.8315 10.0041 10.8315C9.71004 10.8315 9.42125 10.7537 9.16699 10.606L1.66699 5.8335" stroke="#9CA1AF" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16.667 3.3335H3.33366C2.41318 3.3335 1.66699 4.07969 1.66699 5.00016V15.0002C1.66699 15.9206 2.41318 16.6668 3.33366 16.6668H16.667C17.5875 16.6668 18.3337 15.9206 18.3337 15.0002V5.00016C18.3337 4.07969 17.5875 3.3335 16.667 3.3335Z" stroke="#9CA1AF" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 677 B |
4
public/component-20-dark.svg
Normal file
4
public/component-20-dark.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.6668 13.3335V2.66683C10.6668 2.31321 10.5264 1.97407 10.2763 1.72402C10.0263 1.47397 9.68712 1.3335 9.3335 1.3335H6.66683C6.31321 1.3335 5.97407 1.47397 5.72402 1.72402C5.47397 1.97407 5.3335 2.31321 5.3335 2.66683V13.3335" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.3335 4H2.66683C1.93045 4 1.3335 4.59695 1.3335 5.33333V12C1.3335 12.7364 1.93045 13.3333 2.66683 13.3333H13.3335C14.0699 13.3333 14.6668 12.7364 14.6668 12V5.33333C14.6668 4.59695 14.0699 4 13.3335 4Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 725 B |
6
public/component-20.svg
Normal file
6
public/component-20.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2.99984 11.0002C1.99984 11.8402 1.6665 14.3335 1.6665 14.3335C1.6665 14.3335 4.15984 14.0002 4.99984 13.0002C5.47317 12.4402 5.4665 11.5802 4.93984 11.0602C4.68071 10.8129 4.33937 10.67 3.98132 10.6589C3.62328 10.6478 3.27375 10.7694 2.99984 11.0002Z" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8 9.99984L6 7.99984C6.35476 7.07946 6.80147 6.19722 7.33333 5.36651C8.11012 4.1245 9.19175 3.10187 10.4753 2.3959C11.7589 1.68993 13.2018 1.32409 14.6667 1.33317C14.6667 3.14651 14.1467 6.33317 10.6667 8.66651C9.82459 9.19899 8.93123 9.64567 8 9.99984Z" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.99984 7.99985H2.6665C2.6665 7.99985 3.03317 5.97985 3.99984 5.33318C5.07984 4.61318 7.33317 5.33318 7.33317 5.33318" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8 9.99984V13.3332C8 13.3332 10.02 12.9665 10.6667 11.9998C11.3867 10.9198 10.6667 8.6665 10.6667 8.6665" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
4
public/component-21.svg
Normal file
4
public/component-21.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M14.6668 4.6665L8.67283 8.4845C8.46942 8.60265 8.23839 8.66487 8.00316 8.66487C7.76794 8.66487 7.5369 8.60265 7.3335 8.4845L1.3335 4.6665" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13.3335 2.6665H2.66683C1.93045 2.6665 1.3335 3.26346 1.3335 3.99984V11.9998C1.3335 12.7362 1.93045 13.3332 2.66683 13.3332H13.3335C14.0699 13.3332 14.6668 12.7362 14.6668 11.9998V3.99984C14.6668 3.26346 14.0699 2.6665 13.3335 2.6665Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 666 B |
6
public/component-22.svg
Normal file
6
public/component-22.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9.99984 12H6.6665" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.9998 9.3335H6.6665" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M2.66683 14.6668H13.3335C13.6871 14.6668 14.0263 14.5264 14.2763 14.2763C14.5264 14.0263 14.6668 13.6871 14.6668 13.3335V2.66683C14.6668 2.31321 14.5264 1.97407 14.2763 1.72402C14.0263 1.47397 13.6871 1.3335 13.3335 1.3335H5.3335C4.97987 1.3335 4.64074 1.47397 4.39069 1.72402C4.14064 1.97407 4.00016 2.31321 4.00016 2.66683V13.3335C4.00016 13.6871 3.85969 14.0263 3.60964 14.2763C3.35959 14.5264 3.02045 14.6668 2.66683 14.6668ZM2.66683 14.6668C2.31321 14.6668 1.97407 14.5264 1.72402 14.2763C1.47397 14.0263 1.3335 13.6871 1.3335 13.3335V7.3335C1.3335 6.97987 1.47397 6.64074 1.72402 6.39069C1.97407 6.14064 2.31321 6.00016 2.66683 6.00016H4.00016" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M11.3332 4H7.33317C6.96498 4 6.6665 4.29848 6.6665 4.66667V6C6.6665 6.36819 6.96498 6.66667 7.33317 6.66667H11.3332C11.7014 6.66667 11.9998 6.36819 11.9998 6V4.66667C11.9998 4.29848 11.7014 4 11.3332 4Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
3
public/environment-planet0.svg
Normal file
3
public/environment-planet0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.59841 12.1077C5.52165 12.8731 6.70714 13.3332 8.00009 13.3332C10.9456 13.3332 13.3334 10.9454 13.3334 7.99984C13.3334 7.62047 13.2938 7.25036 13.2185 6.89341M4.59841 12.1077C3.41837 11.1294 2.66676 9.6524 2.66676 7.99984C2.66676 5.05432 5.05457 2.6665 8.00009 2.6665C10.5662 2.6665 12.7091 4.47886 13.2185 6.89341M4.59841 12.1077C5.90209 11.8097 7.45305 11.1884 9.01735 10.2852C10.8376 9.23432 12.3182 8.00816 13.2185 6.89341M4.59841 12.1077C2.97896 12.4779 1.74106 12.3494 1.3331 11.6428C0.91289 10.9149 1.46421 9.73112 2.66666 8.47249M13.2185 6.89341C14.0531 5.86011 14.389 4.92254 14.0348 4.309C13.6756 3.68684 12.673 3.51276 11.3331 3.73269" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 846 B |
3
public/environment-rainbow0.svg
Normal file
3
public/environment-rainbow0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2 11.3333V10C2 6.68629 4.68629 4 8 4C11.3137 4 14 6.68629 14 10V11.3333M4 11.3333V10C4 7.79086 5.79086 6 8 6C10.2091 6 12 7.79086 12 10V11.3333M6 11.3333V10C6 8.89543 6.89543 8 8 8C9.10457 8 10 8.89543 10 10V11.3333" stroke="#FCFCFD" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 415 B |
16
public/frame-110.svg
Normal file
16
public/frame-110.svg
Normal file
@@ -0,0 +1,16 @@
|
||||
<svg width="305" height="162" viewBox="0 0 305 162" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4_10643)">
|
||||
<path d="M-1 161H304" stroke="#D1D5DB" stroke-width="0.521677" stroke-dasharray="3.13 3.13"/>
|
||||
<path d="M34.5112 137.394C21.7066 134.128 7.83516 138.756 2.5 141.478V162H302.5V4L268.308 16.2505L238.583 45.5156L174.366 76.7499L150.552 74.1002L112.825 85.6701C102.916 95.1983 81.0419 116.569 72.8104 125.824C62.5211 140.117 50.5169 141.478 34.5112 137.394Z" fill="url(#paint0_linear_4_10643)"/>
|
||||
<path d="M2.5 142C7.85368 139.267 21.7733 134.622 34.6223 137.901C50.6835 142 62.7294 140.634 73.0545 126.287C79.4259 119.12 93.9428 104.718 104.811 94.1177C110.317 88.7477 117.038 84.805 124.391 82.5494L141.319 77.3564C147.728 75.3903 154.508 74.952 161.117 76.0764C170.233 77.6274 179.607 76.1943 187.843 71.9902L232.671 49.109C237.132 46.8319 241.218 43.8849 244.787 40.3704L261.715 23.6982C266.669 18.8198 272.603 15.0505 279.124 12.6402L302.5 4" stroke="#10B981" stroke-width="2.08671" stroke-linecap="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4_10643" x1="134.431" y1="10.2653" x2="162.471" y2="160.036" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#10B981"/>
|
||||
<stop offset="1" stop-color="#D9D9D9" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_4_10643">
|
||||
<rect width="305" height="162" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
10
public/group0.svg
Normal file
10
public/group0.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg width="156" height="40" viewBox="0 0 156 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M37.292 10.0724L36.4259 8.57843C36.1853 8.14469 35.656 8.00012 35.2229 8.24108C35.1748 8.28927 35.0786 8.33747 35.0305 8.38566L33.0576 10.3616C32.7689 10.6507 32.7208 11.1326 32.9614 11.47C33.6831 12.5784 34.2606 13.7832 34.6936 15.0363C37.4364 23.1808 33.0576 32.0001 24.9256 34.7471C23.3377 35.2772 21.6535 35.5664 19.9694 35.5664C17.4191 35.5664 14.917 34.9399 12.7035 33.7351L16.0718 30.3616C21.7979 32.5302 28.1976 29.6387 30.363 23.9037C31.4216 21.0604 31.2772 17.8796 29.978 15.1326C29.7856 14.6989 29.2563 14.5061 28.7751 14.6989C28.6788 14.7471 28.5826 14.7953 28.5345 14.8917L26.5135 16.8676C26.2729 17.1086 26.2248 17.3977 26.2729 17.6869L26.4654 18.4098C27.2834 21.976 25.0699 25.5905 21.5092 26.4098C19.8732 26.7953 18.1409 26.5543 16.6973 25.6869L15.8312 25.1567C15.4944 24.964 15.0613 25.0122 14.7726 25.3013L6.59247 33.4941C6.25564 33.8314 6.25564 34.4098 6.59247 34.7471C6.64058 34.7953 6.64058 34.7953 6.6887 34.8435L7.89166 35.7592C11.3081 38.5543 15.5906 40.0001 19.9694 40.0001C30.9885 40.0001 39.9385 31.0363 39.9385 19.9519C39.9385 16.482 39.0243 13.1086 37.292 10.0724Z" fill="#9CA1AF"/>
|
||||
<path d="M32.095 4.14458C28.6305 1.44578 24.3479 0 19.9692 0C8.95003 0 0 8.96385 0 20.0482C0 23.5181 0.91425 26.9398 2.5984 29.9277L3.46453 31.4217C3.70512 31.8554 4.23442 32 4.66749 31.759C4.71561 31.7108 4.81184 31.6627 4.85996 31.6145L6.83282 29.6386C7.12153 29.3494 7.16965 28.8675 6.92906 28.5301C6.20728 27.4217 5.62986 26.2169 5.19679 24.9639C2.45404 16.8193 6.83282 8 14.9648 5.25301C16.5527 4.72289 18.2369 4.43373 19.921 4.43373C22.4713 4.43373 24.9735 5.06024 27.1869 6.26506L23.8186 9.63855C18.0925 7.46988 11.6928 10.3614 9.52745 16.0964C9.04627 17.3494 8.80567 18.6988 8.80567 20.0482C8.80567 20.241 8.85379 21.0602 8.85379 21.2048C8.99815 22.4578 9.33498 23.7108 9.9124 24.8675C10.1049 25.3012 10.6342 25.494 11.1154 25.3012C11.2116 25.253 11.3078 25.2048 11.356 25.1084L13.3769 23.0843C13.6175 22.8434 13.6656 22.5542 13.6175 22.2651L13.4732 21.5422C12.6552 17.9759 14.8686 14.3614 18.4294 13.5422C20.0654 13.1566 21.7977 13.3976 23.2412 14.2651L24.1073 14.7952C24.4442 14.988 24.8772 14.9398 25.1659 14.6506L33.3461 6.45783C33.6829 6.12048 33.6829 5.54217 33.3461 5.20482C33.298 5.15663 33.298 5.15663 33.2498 5.10843L32.095 4.14458Z" fill="#9CA1AF"/>
|
||||
<path d="M65.7302 25.5423C65.4415 25.3014 64.9603 25.3014 64.6716 25.5905C63.3724 26.6026 61.8807 27.5182 59.7154 27.5182C55.7216 27.5182 52.4976 24.1447 52.4976 20.0484C52.4976 15.952 55.7216 12.5303 59.7154 12.5303C61.4477 12.5303 63.2762 13.2532 64.6716 14.458C64.816 14.6508 65.0566 14.7471 65.2972 14.7471C65.4896 14.7471 65.6821 14.6026 65.8265 14.458L67.1257 13.1086C67.27 12.964 67.3662 12.723 67.3662 12.4821C67.3662 12.2411 67.27 12.0484 67.0775 11.8556C64.816 9.87968 62.5544 9.01221 59.7154 9.01221C53.6525 9.01221 48.6963 13.9761 48.6963 20.0965C48.6963 26.1688 53.6044 31.1327 59.7154 31.1327C62.5063 31.1809 65.1528 30.0724 67.1257 28.1447C67.3181 27.952 67.4144 27.711 67.3662 27.47C67.3662 27.2773 67.27 27.0845 67.1257 26.9399L65.7302 25.5423Z" fill="#9CA1AF"/>
|
||||
<path d="M75.161 9.25293H73.1881C72.7551 9.25293 72.3701 9.63847 72.3701 10.0722V29.9276C72.3701 30.3614 72.7551 30.7469 73.1881 30.7469H75.161C75.5941 30.7469 75.979 30.3614 75.979 29.9276V10.0722C75.979 9.63847 75.6422 9.25293 75.161 9.25293Z" fill="#9CA1AF"/>
|
||||
<path d="M98.4022 15.9517C98.4022 12.2891 95.3707 9.25293 91.6656 9.25293H83.5817C83.1005 9.25293 82.7637 9.63847 82.7637 10.0722V29.9276C82.7637 30.4096 83.1486 30.7469 83.5817 30.7469H85.5064C85.9395 30.7469 86.3244 30.3614 86.3244 29.9276V22.5541H90.3664L94.264 30.3614C94.4083 30.6023 94.697 30.7951 94.9858 30.7951H97.2954C97.5842 30.7951 97.8729 30.6505 98.0172 30.4096C98.1616 30.1204 98.1616 29.8312 98.0172 29.5421L94.0715 22.1686C96.7661 20.9638 98.4022 18.6023 98.4022 15.9517ZM94.7452 15.9999C94.7452 17.8794 93.2054 19.4698 91.3769 19.4698H86.3244V12.7228H91.425C93.2054 12.6746 94.7452 14.2168 94.7452 15.9999Z" fill="#9CA1AF"/>
|
||||
<path d="M119.526 25.5423C119.238 25.3014 118.756 25.3014 118.468 25.5905C117.169 26.6026 115.677 27.5182 113.512 27.5182C109.518 27.5182 106.294 24.1447 106.294 20.0484C106.294 15.952 109.518 12.5303 113.463 12.5303C115.196 12.5303 117.024 13.2532 118.42 14.458C118.564 14.6508 118.805 14.7471 119.045 14.7471C119.238 14.7471 119.43 14.6026 119.575 14.458L120.874 13.1086C121.018 12.964 121.114 12.723 121.114 12.4821C121.114 12.2411 121.018 12.0484 120.826 11.8556C118.564 9.87968 116.302 9.01221 113.463 9.01221C107.401 9.01221 102.444 13.9761 102.444 20.0965C102.444 26.1688 107.352 31.1327 113.463 31.1327C116.254 31.1809 118.901 30.0724 120.874 28.1447C121.066 27.952 121.162 27.711 121.114 27.47C121.114 27.2773 121.018 27.0845 120.874 26.9399L119.526 25.5423Z" fill="#9CA1AF"/>
|
||||
<path d="M137.571 27.4216H129.776V10.0722C129.776 9.63847 129.391 9.25293 128.958 9.25293H126.985C126.504 9.25293 126.167 9.63847 126.167 10.0722V29.9276C126.167 30.4096 126.552 30.7469 126.985 30.7469H137.571C138.052 30.7469 138.389 30.3614 138.389 29.9276V28.2891C138.389 27.8071 138.052 27.4216 137.571 27.4216Z" fill="#9CA1AF"/>
|
||||
<path d="M155.183 12.6266C155.664 12.6266 156.001 12.241 156.001 11.8073V10.1205C156.001 9.63862 155.616 9.30127 155.183 9.30127H143.297C142.816 9.30127 142.479 9.68681 142.479 10.1205V29.976C142.479 30.4579 142.864 30.7952 143.297 30.7952H155.183C155.664 30.7952 156.001 30.4097 156.001 29.976V28.3374C156.001 27.8555 155.616 27.5181 155.183 27.5181H146.04V21.5422H153.691C154.172 21.5422 154.509 21.1567 154.509 20.723V19.0362C154.509 18.6025 154.124 18.2169 153.691 18.2169H146.04V12.6266H155.183Z" fill="#9CA1AF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.6 KiB |
4
public/icon0.svg
Normal file
4
public/icon0.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M35.0662 20.3018H9.22781C7.18922 20.3018 5.53662 21.9544 5.53662 23.993V36.9121C5.53662 38.9507 7.18922 40.6033 9.22781 40.6033H35.0662C37.1048 40.6033 38.7574 38.9507 38.7574 36.9121V23.993C38.7574 21.9544 37.1048 20.3018 35.0662 20.3018Z" stroke="#9CA1AF" stroke-width="3.69119" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12.9189 20.3018V12.9194C12.9189 10.472 13.8912 8.1248 15.6218 6.39422C17.3523 4.66364 19.6995 3.69141 22.1469 3.69141C24.5943 3.69141 26.9415 4.66364 28.6721 6.39422C30.4027 8.1248 31.3749 10.472 31.3749 12.9194V20.3018" stroke="#9CA1AF" stroke-width="3.69119" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 762 B |
19
public/icon1.svg
Normal file
19
public/icon1.svg
Normal file
@@ -0,0 +1,19 @@
|
||||
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4_10721)">
|
||||
<path d="M12.0304 1.43642L4.03308 1.64314C3.29695 1.66217 2.71562 2.27435 2.73465 3.01048L3.01027 13.6736C3.0293 14.4097 3.64148 14.991 4.37761 14.972L12.3749 14.7653C13.1111 14.7463 13.6924 14.1341 13.6734 13.398L13.3978 2.73486C13.3787 1.99873 12.7665 1.4174 12.0304 1.43642Z" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.43457 4.27427L10.7661 4.13646" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M10.9043 9.46812L10.9732 12.1339" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M10.835 6.8021L10.8416 6.80193" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.16992 6.87095L8.17659 6.87078" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.50391 6.94029L5.51057 6.94012" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.23828 9.53697L8.24495 9.5368" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.57227 9.60582L5.57893 9.60564" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.30762 12.2025L8.31428 12.2023" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.6416 12.2718L5.64827 12.2717" stroke="#FCFCFD" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4_10721">
|
||||
<rect width="16" height="16" fill="white" transform="translate(0 0.413433) rotate(-1.48066)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
4
public/icon2.svg
Normal file
4
public/icon2.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M22.174 7.04965L13.8965 15.7664L8.76893 10.8973L2.43906 17.5631" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16.1758 7.20462L22.1738 7.04958L22.3288 13.0476" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 402 B |
BIN
public/image-220.png
Normal file
BIN
public/image-220.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
BIN
public/image-230.png
Normal file
BIN
public/image-230.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
BIN
public/image-240.png
Normal file
BIN
public/image-240.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
BIN
public/image-250.png
Normal file
BIN
public/image-250.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
public/image-251.png
Normal file
BIN
public/image-251.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
public/image-270.png
Normal file
BIN
public/image-270.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
BIN
public/image-280.png
Normal file
BIN
public/image-280.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
3
public/interface-chart-bar-vertical-010.svg
Normal file
3
public/interface-chart-bar-vertical-010.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 14.6668V26.6668M12 14.6668H6.13281C5.38608 14.6668 5.01308 14.6668 4.72786 14.8122C4.47698 14.94 4.27316 15.1438 4.14532 15.3947C4 15.6799 4 16.0536 4 16.8003V26.6668H12M12 14.6668V7.46696C12 6.72022 12 6.34658 12.1453 6.06136C12.2732 5.81048 12.477 5.60665 12.7279 5.47882C13.0131 5.3335 13.3861 5.3335 14.1328 5.3335H17.8661C18.6129 5.3335 18.987 5.3335 19.2723 5.47882C19.5231 5.60665 19.7263 5.81048 19.8542 6.06136C19.9995 6.34658 20 6.72022 20 7.46696V10.6668M12 26.6668H20M20 26.6668L28 26.667V12.8003C28 12.0536 27.9995 11.6799 27.8542 11.3947C27.7263 11.1438 27.5239 10.94 27.273 10.8122C26.9878 10.6668 26.6134 10.6668 25.8667 10.6668H20M20 26.6668V10.6668" stroke="#FCFCFD" stroke-width="2.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 873 B |
3
public/interface-search-magnifying-glass0.svg
Normal file
3
public/interface-search-magnifying-glass0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20 20L28 28M13.3333 22.6667C8.17868 22.6667 4 18.488 4 13.3333C4 8.17868 8.17868 4 13.3333 4C18.488 4 22.6667 8.17868 22.6667 13.3333C22.6667 18.488 18.488 22.6667 13.3333 22.6667Z" stroke="#FCFCFD" stroke-width="2.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 384 B |
9
public/logo0.svg
Normal file
9
public/logo0.svg
Normal file
@@ -0,0 +1,9 @@
|
||||
<svg width="160" height="40" viewBox="0 0 160 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M64.5039 27.4229H61.3193L55.4033 16.8848L49.4717 27.4229H46.2861L55.4053 11.2412L64.5039 27.4229ZM82.6846 14.7344H71.8057C71.2937 14.7345 70.8758 14.9071 70.5107 15.2715C70.1459 15.6358 69.9727 16.0526 69.9727 16.5635C69.9727 17.0728 70.1443 17.4891 70.5068 17.8525C70.87 18.2058 71.289 18.3759 71.8057 18.376H78.1533C79.3949 18.3762 80.4742 18.8246 81.3457 19.7041C82.2326 20.5757 82.6844 21.6559 82.6846 22.8994C82.6846 24.1427 82.2325 25.2259 81.3496 26.1074C80.4756 26.9799 79.3951 27.4228 78.1533 27.4229H67.2734V24.7295H78.1533C78.6651 24.7294 79.0823 24.5566 79.4473 24.1924C79.8124 23.8279 79.9863 23.4106 79.9863 22.8994C79.9862 22.3889 79.8133 21.9813 79.4541 21.6309L79.4473 21.624C79.0823 21.26 78.665 21.088 78.1533 21.0879H71.8057C70.5641 21.0879 69.4796 20.6456 68.5957 19.7773L68.5918 19.7715L68.5869 19.7686C67.7168 18.8861 67.2734 17.803 67.2734 16.5635C67.2735 15.324 67.7178 14.2454 68.5918 13.373C69.4749 12.4917 70.5602 12.0401 71.8057 12.04H82.6846V14.7344ZM101.412 14.7344H90.5332C90.0215 14.7345 89.6042 14.9074 89.2393 15.2715C88.8743 15.6357 88.7003 16.0526 88.7002 16.5635C88.7002 17.0728 88.873 17.4891 89.2354 17.8525C89.5986 18.2055 90.017 18.3758 90.5332 18.376H96.8809C98.1225 18.3761 99.2018 18.8247 100.073 19.7041C100.96 20.5757 101.412 21.6559 101.412 22.8994C101.412 24.1426 100.961 25.226 100.078 26.1074C99.2041 26.9799 98.1227 27.4228 96.8809 27.4229H86.001V24.7295H96.8809C97.3928 24.7294 97.8107 24.5568 98.1758 24.1924C98.541 23.8279 98.7139 23.4106 98.7139 22.8994C98.7137 22.3888 98.5411 21.9814 98.1816 21.6309L98.1758 21.624C97.8107 21.2598 97.3928 21.088 96.8809 21.0879H90.5332C89.2919 21.0877 88.2081 20.6454 87.3242 19.7773L87.3154 19.7686C86.4452 18.8861 86.001 17.803 86.001 16.5635C86.001 15.3241 86.4456 14.2454 87.3193 13.373C88.2024 12.4917 89.2879 12.0402 90.5332 12.04H101.412V14.7344ZM120.143 14.7344H112.438C111.139 14.7344 110.028 15.1657 109.071 16.04C108.343 16.7054 107.861 17.4793 107.617 18.376H120.143V21.0879H107.617C107.861 21.9868 108.343 22.7676 109.072 23.4424C110.027 24.3037 111.138 24.7295 112.438 24.7295H120.143V27.4229H112.438C110.316 27.4229 108.484 26.6672 106.986 25.1729C105.489 23.6783 104.732 21.8496 104.732 19.7314C104.733 17.6133 105.489 15.7854 106.986 14.291C108.484 12.7964 110.316 12.04 112.438 12.04H120.143V14.7344ZM138.874 14.7344H132.525V27.4229H129.81V14.7344H123.463V12.04H138.874V14.7344ZM149.896 17.6377L154.839 12.04H158.538L151.737 19.7314L158.538 27.4229H154.839L149.896 21.8271L144.955 27.4229H141.257L148.058 19.7314L141.257 12.04H144.955L149.896 17.6377Z" fill="#111827"/>
|
||||
<path d="M22.7595 21.1203C18.5742 26.4404 19.4882 25.3226 15.8872 29.3075C12.2862 33.2924 10.8695 34.122 7.84473 35.6161C10.6589 38.3532 17.6613 39.5414 20.5777 39.6614C31.9067 39.6614 37.8658 29.0974 39.4293 23.8154L34.6487 28.5872C26.8272 34.5505 27.5173 27.1545 27.8281 21.4701C28.139 15.7856 26.9448 15.8001 22.7595 21.1203Z" fill="#111827"/>
|
||||
<path opacity="0.1" d="M21.21 26.2439C25.3141 20.8326 24.7568 22.5015 24.8075 24.7774C24.8524 26.7963 26.5319 36.6559 33.1012 34.301C30.0474 37.3255 25.9075 39.662 20.5798 39.662C18.3127 39.5687 13.8582 38.9891 10.665 37.45C13.0175 35.3088 18.0426 30.4203 21.21 26.2439Z" fill="#111827"/>
|
||||
<path d="M25.6931 9.41385C31.7064 4.99711 33.3042 12.2451 33.3513 16.4212V23.1454C33.3513 27.4346 39.8398 20.9512 39.8398 18.7215C39.8398 17.7209 37.2516 0 21.084 0C4.91616 0 -1.11093 13.0945 0.165453 22.2252C1.44185 31.356 4.92273 29.6112 7.25637 28.1708C10.731 26.9675 18.1765 14.9347 25.6931 9.41385Z" fill="#111827"/>
|
||||
<path d="M21.0861 0C30.6554 4.75569e-06 35.4673 6.20837 37.8012 11.4831C34.1121 7.97614 30.7616 7.54956 28.4579 8.08875C27.6616 8.22689 26.7457 8.64219 25.6951 9.41381C18.1786 14.9347 10.2903 26.9881 7.36901 28.3181C4.44771 29.6479 0.986264 31.1565 0.167397 22.2252C-0.674318 13.0444 4.91822 0 21.0861 0Z" fill="#111827"/>
|
||||
<path opacity="0.1" d="M18.7263 33.5267C22.0196 29.4302 22.2611 26.9637 23.337 30.9474C24.2896 34.4746 26.7081 36.2162 29.1686 37.3452C26.7487 38.7572 23.8936 39.6621 20.5787 39.6621C18.8808 39.5922 15.9559 39.2493 13.2529 38.4351C15.031 37.2144 17.1298 35.5124 18.7263 33.5267Z" fill="#111827"/>
|
||||
<path d="M21.088 0C21.3164 0 21.5422 0.00350863 21.7652 0.0104881C23.9447 0.0786729 25.8683 0.475476 27.565 1.11005C27.7725 1.18767 27.9766 1.26895 28.1773 1.35352C28.2003 1.36323 28.2235 1.37276 28.2464 1.38255C28.3196 1.41379 28.3923 1.44574 28.4646 1.47788C28.5163 1.50086 28.5677 1.52413 28.619 1.54755C28.7651 1.61432 28.9095 1.68267 29.052 1.75301C29.1196 1.7864 29.1867 1.82035 29.2534 1.85452C29.3449 1.90133 29.4356 1.9488 29.5257 1.99705C30.6339 2.5913 31.6275 3.29283 32.5172 4.06639C32.6232 4.15858 32.7278 4.25182 32.831 4.346C32.9697 4.4727 33.1057 4.60121 33.2392 4.73125C33.2839 4.77477 33.3283 4.81848 33.3725 4.86235C33.434 4.92356 33.4949 4.98514 33.5554 5.04702C33.5739 5.06596 33.5924 5.08494 33.6107 5.10395C33.6736 5.16883 33.7359 5.23394 33.7974 5.29948C34.0164 5.53248 34.2277 5.76965 34.4318 6.01023C34.5281 6.12388 34.6225 6.23863 34.7157 6.35372C34.8215 6.48444 34.9255 6.61579 35.0271 6.74814C36.1938 8.2668 37.0918 9.88565 37.7782 11.4271C37.7864 11.4456 37.7946 11.4641 37.8028 11.4826C34.7535 8.5841 31.9355 7.79003 29.749 7.90634C27.2573 7.13785 23.2106 7.96321 17.9463 13.2178C5.91446 25.2275 -1.8284 26.8444 2.06022 12.1741C2.44117 10.7369 2.97053 9.45623 3.62937 8.31499C4.6146 6.90895 5.80945 5.60385 7.22473 4.46399C7.35114 4.36217 7.47942 4.26178 7.60937 4.16264C9.16188 2.97822 10.9663 1.98826 13.036 1.27149C13.3319 1.169 13.6333 1.07212 13.9402 0.98101C16.0584 0.352059 18.4368 2.0529e-05 21.088 0Z" fill="#111827"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.6 KiB |
3
public/logo1.svg
Normal file
3
public/logo1.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="1200" height="187" viewBox="0 0 1200 187" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M200.242 186.762H166.632L104.208 75.5576L41.6104 186.762H8L104.222 16L200.242 186.762ZM392.1 52.8594H277.295C271.892 52.8607 267.478 54.6792 263.626 58.5244C259.774 62.3696 257.951 66.7736 257.951 72.167C257.951 77.5427 259.761 81.9338 263.587 85.7695C267.42 89.4977 271.843 91.2881 277.295 91.2881H344.274C357.378 91.2895 368.767 96.0215 377.964 105.304C387.324 114.501 392.098 125.902 392.1 139.025C392.1 152.146 387.323 163.577 378.005 172.88C368.781 182.087 357.38 186.762 344.274 186.762H229.47V158.332H344.274C349.676 158.332 354.077 156.512 357.93 152.668C361.783 148.821 363.617 144.42 363.617 139.025C363.616 133.638 361.799 129.334 358.009 125.636L357.969 125.608L357.93 125.568C354.077 121.726 349.675 119.904 344.274 119.904H277.295C264.191 119.904 252.746 115.239 243.418 106.074L243.377 106.021L243.324 105.981C234.142 96.6693 229.47 85.2468 229.47 72.167C229.47 59.0858 234.153 47.705 243.377 38.499C252.697 29.1967 264.15 24.4309 277.295 24.4307H392.1V52.8594ZM589.724 52.8594H474.919C469.518 52.8607 465.115 54.6819 461.264 58.5244C457.41 62.3696 455.576 66.7736 455.576 72.167C455.576 77.5426 457.398 81.9339 461.223 85.7695C465.056 89.4949 469.471 91.2867 474.919 91.2881H541.898C555.002 91.2881 566.391 96.0229 575.588 105.304C584.948 114.501 589.722 125.902 589.724 139.025C589.724 152.145 584.958 163.579 575.642 172.88C566.417 182.087 555.005 186.762 541.898 186.762H427.094V158.332H541.898C547.303 158.332 551.714 156.515 555.567 152.668C559.421 148.821 561.242 144.42 561.242 139.025C561.241 133.636 559.426 129.335 555.633 125.636L555.567 125.568C551.714 121.723 547.303 119.904 541.898 119.904H474.919C461.818 119.903 450.383 115.237 441.055 106.074L440.962 105.981C431.779 96.6693 427.094 85.2467 427.094 72.167C427.094 59.0872 431.78 47.705 441.001 38.499C450.321 29.1969 461.776 24.4316 474.919 24.4307H589.724V52.8594ZM787.373 52.8594H706.073C692.359 52.8594 680.637 57.4096 670.545 66.6357C662.855 73.6576 657.768 81.8249 655.198 91.2881H787.373V119.904H655.198C657.767 129.393 662.857 137.634 670.559 144.757C680.637 153.846 692.35 158.332 706.073 158.332H787.373V186.762H706.073C683.677 186.762 664.338 178.785 648.537 163.014C632.739 147.242 624.758 127.949 624.758 105.597C624.759 83.2443 632.738 63.95 648.537 48.1797C664.338 32.4074 683.677 24.4307 706.073 24.4307H787.373V52.8594ZM985.042 52.8594H918.051V186.762H889.391V52.8594H822.409V24.4307H985.042V52.8594ZM1049.21 24.4307L1101.36 83.4961L1153.51 24.4307H1192.55L1120.79 105.597L1192.55 186.762H1153.51L1101.36 127.709L1049.21 186.762H1010.18L1081.95 105.597L1010.18 24.4307H1049.21Z" fill="#222222"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
9
public/logo2.svg
Normal file
9
public/logo2.svg
Normal file
@@ -0,0 +1,9 @@
|
||||
<svg width="160" height="40" viewBox="0 0 160 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M64.5039 27.4229H61.3193L55.4033 16.8848L49.4717 27.4229H46.2861L55.4053 11.2412L64.5039 27.4229ZM82.6846 14.7344H71.8057C71.2937 14.7345 70.8758 14.9071 70.5107 15.2715C70.1459 15.6358 69.9727 16.0526 69.9727 16.5635C69.9727 17.0728 70.1443 17.4891 70.5068 17.8525C70.87 18.2058 71.289 18.3759 71.8057 18.376H78.1533C79.3949 18.3762 80.4742 18.8246 81.3457 19.7041C82.2326 20.5757 82.6844 21.6559 82.6846 22.8994C82.6846 24.1427 82.2325 25.2259 81.3496 26.1074C80.4756 26.9799 79.3951 27.4228 78.1533 27.4229H67.2734V24.7295H78.1533C78.6651 24.7294 79.0823 24.5566 79.4473 24.1924C79.8124 23.8279 79.9863 23.4106 79.9863 22.8994C79.9862 22.3889 79.8133 21.9813 79.4541 21.6309L79.4473 21.624C79.0823 21.26 78.665 21.088 78.1533 21.0879H71.8057C70.5641 21.0879 69.4796 20.6456 68.5957 19.7773L68.5918 19.7715L68.5869 19.7686C67.7168 18.8861 67.2734 17.803 67.2734 16.5635C67.2735 15.324 67.7178 14.2454 68.5918 13.373C69.4749 12.4917 70.5602 12.0401 71.8057 12.04H82.6846V14.7344ZM101.412 14.7344H90.5332C90.0215 14.7345 89.6042 14.9074 89.2393 15.2715C88.8743 15.6357 88.7003 16.0526 88.7002 16.5635C88.7002 17.0728 88.873 17.4891 89.2354 17.8525C89.5986 18.2055 90.017 18.3758 90.5332 18.376H96.8809C98.1225 18.3761 99.2018 18.8247 100.073 19.7041C100.96 20.5757 101.412 21.6559 101.412 22.8994C101.412 24.1426 100.961 25.226 100.078 26.1074C99.2041 26.9799 98.1227 27.4228 96.8809 27.4229H86.001V24.7295H96.8809C97.3928 24.7294 97.8107 24.5568 98.1758 24.1924C98.541 23.8279 98.7139 23.4106 98.7139 22.8994C98.7137 22.3888 98.5411 21.9814 98.1816 21.6309L98.1758 21.624C97.8107 21.2598 97.3928 21.088 96.8809 21.0879H90.5332C89.2919 21.0877 88.2081 20.6454 87.3242 19.7773L87.3154 19.7686C86.4452 18.8861 86.001 17.803 86.001 16.5635C86.001 15.3241 86.4456 14.2454 87.3193 13.373C88.2024 12.4917 89.2879 12.0402 90.5332 12.04H101.412V14.7344ZM120.143 14.7344H112.438C111.139 14.7344 110.028 15.1657 109.071 16.04C108.343 16.7054 107.861 17.4793 107.617 18.376H120.143V21.0879H107.617C107.861 21.9868 108.343 22.7676 109.072 23.4424C110.027 24.3037 111.138 24.7295 112.438 24.7295H120.143V27.4229H112.438C110.316 27.4229 108.484 26.6672 106.986 25.1729C105.489 23.6783 104.732 21.8496 104.732 19.7314C104.733 17.6133 105.489 15.7854 106.986 14.291C108.484 12.7964 110.316 12.04 112.438 12.04H120.143V14.7344ZM138.874 14.7344H132.525V27.4229H129.81V14.7344H123.463V12.04H138.874V14.7344ZM149.896 17.6377L154.839 12.04H158.538L151.737 19.7314L158.538 27.4229H154.839L149.896 21.8271L144.955 27.4229H141.257L148.058 19.7314L141.257 12.04H144.955L149.896 17.6377Z" fill="#111827"/>
|
||||
<path d="M22.7595 21.1203C18.5742 26.4404 19.4882 25.3226 15.8872 29.3075C12.2862 33.2924 10.8695 34.122 7.84473 35.6161C10.6589 38.3532 17.6613 39.5414 20.5777 39.6614C31.9067 39.6614 37.8658 29.0974 39.4293 23.8154L34.6487 28.5872C26.8272 34.5505 27.5173 27.1545 27.8281 21.4701C28.139 15.7856 26.9448 15.8001 22.7595 21.1203Z" fill="#111827"/>
|
||||
<path opacity="0.1" d="M21.21 26.2439C25.3141 20.8326 24.7568 22.5015 24.8075 24.7774C24.8524 26.7963 26.5319 36.6559 33.1012 34.301C30.0474 37.3255 25.9075 39.662 20.5798 39.662C18.3127 39.5687 13.8582 38.9891 10.665 37.45C13.0175 35.3088 18.0426 30.4203 21.21 26.2439Z" fill="#111827"/>
|
||||
<path d="M25.6931 9.41385C31.7064 4.99711 33.3042 12.2451 33.3513 16.4212V23.1454C33.3513 27.4346 39.8398 20.9512 39.8398 18.7215C39.8398 17.7209 37.2516 0 21.084 0C4.91616 0 -1.11093 13.0945 0.165453 22.2252C1.44185 31.356 4.92273 29.6112 7.25637 28.1708C10.731 26.9675 18.1765 14.9347 25.6931 9.41385Z" fill="#111827"/>
|
||||
<path d="M21.0861 0C30.6554 4.75569e-06 35.4673 6.20837 37.8012 11.4831C34.1121 7.97614 30.7616 7.54956 28.4579 8.08875C27.6616 8.22689 26.7457 8.64219 25.6951 9.41381C18.1786 14.9347 10.2903 26.9881 7.36901 28.3181C4.44771 29.6479 0.986264 31.1565 0.167397 22.2252C-0.674318 13.0444 4.91822 0 21.0861 0Z" fill="#111827"/>
|
||||
<path opacity="0.1" d="M18.7263 33.5267C22.0196 29.4302 22.2611 26.9637 23.337 30.9474C24.2896 34.4746 26.7081 36.2162 29.1686 37.3452C26.7487 38.7572 23.8936 39.6621 20.5787 39.6621C18.8808 39.5922 15.9559 39.2493 13.2529 38.4351C15.031 37.2144 17.1298 35.5124 18.7263 33.5267Z" fill="#111827"/>
|
||||
<path d="M21.088 0C21.3164 0 21.5422 0.00350863 21.7652 0.0104881C23.9447 0.0786729 25.8683 0.475476 27.565 1.11005C27.7725 1.18767 27.9766 1.26895 28.1773 1.35352C28.2003 1.36323 28.2235 1.37276 28.2464 1.38255C28.3196 1.41379 28.3923 1.44574 28.4646 1.47788C28.5163 1.50086 28.5677 1.52413 28.619 1.54755C28.7651 1.61432 28.9095 1.68267 29.052 1.75301C29.1196 1.7864 29.1867 1.82035 29.2534 1.85452C29.3449 1.90133 29.4356 1.9488 29.5257 1.99705C30.6339 2.5913 31.6275 3.29283 32.5172 4.06639C32.6232 4.15858 32.7278 4.25182 32.831 4.346C32.9697 4.4727 33.1057 4.60121 33.2392 4.73125C33.2839 4.77477 33.3283 4.81848 33.3725 4.86235C33.434 4.92356 33.4949 4.98514 33.5554 5.04702C33.5739 5.06596 33.5924 5.08494 33.6107 5.10395C33.6736 5.16883 33.7359 5.23394 33.7974 5.29948C34.0164 5.53248 34.2277 5.76965 34.4318 6.01023C34.5281 6.12388 34.6225 6.23863 34.7157 6.35372C34.8215 6.48444 34.9255 6.61579 35.0271 6.74814C36.1938 8.2668 37.0918 9.88565 37.7782 11.4271C37.7864 11.4456 37.7946 11.4641 37.8028 11.4826C34.7535 8.5841 31.9355 7.79003 29.749 7.90634C27.2573 7.13785 23.2106 7.96321 17.9463 13.2178C5.91446 25.2275 -1.8284 26.8444 2.06022 12.1741C2.44117 10.7369 2.97053 9.45623 3.62937 8.31499C4.6146 6.90895 5.80945 5.60385 7.22473 4.46399C7.35114 4.36217 7.47942 4.26178 7.60937 4.16264C9.16188 2.97822 10.9663 1.98826 13.036 1.27149C13.3319 1.169 13.6333 1.07212 13.9402 0.98101C16.0584 0.352059 18.4368 2.0529e-05 21.088 0Z" fill="#111827"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.6 KiB |
3
public/nav-ireland0.svg
Normal file
3
public/nav-ireland0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="193" height="28" viewBox="0 0 193 28" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24.5535 26.8894V0H30.6639V26.8894H24.5535ZM143.334 16.8432C143.334 10.345 138.304 6.31155 132.417 6.31155C126.493 6.31155 121.501 10.3823 121.501 16.8432C121.501 23.3415 126.531 27.4123 132.417 27.4123C138.304 27.4123 143.334 23.3042 143.334 16.8432ZM137.298 16.8432C137.298 20.2418 135.025 22.1464 132.38 22.1464C129.735 22.1464 127.462 20.2418 127.462 16.8432C127.462 13.4074 129.735 11.5774 132.38 11.5774C135.025 11.5774 137.298 13.4074 137.298 16.8432ZM22.0944 19.1587C22.0944 16.1337 20.5295 13.8182 17.7351 12.7725C20.3805 11.316 21.312 9.4113 21.312 7.17052C21.312 3.24914 18.4803 0 12.1463 0.0373464H0V26.9268H12.668C19.0392 26.8894 22.0944 23.715 22.0944 19.1587ZM14.829 7.95479C14.829 9.78477 13.6739 10.8305 11.4384 10.8305H6.37124V5.2285H11.4384C13.4876 5.2285 14.829 6.12482 14.829 7.95479ZM15.3878 18.7479C15.3878 20.5032 14.1583 21.6609 11.8855 21.6609H6.37124V15.8349H11.8855C14.0838 15.8349 15.3878 16.9553 15.3878 18.7479ZM75.2998 11.8015C73.6232 8.29091 70.4934 6.34889 65.7616 6.34889C60.1728 6.34889 55.1801 9.85946 55.1801 16.8432C55.1801 23.6403 59.5766 27.4123 65.6871 27.4123C69.9718 27.4123 73.5859 25.6943 75.2998 21.9971L70.3817 19.4575C69.4874 21.1007 68.1089 22.1464 65.9106 22.1464C63.079 22.1464 61.2533 20.1297 61.2533 16.8432C61.2533 13.5568 63.3398 11.5774 65.8734 11.5774C67.8481 11.5774 69.3384 12.4737 70.2699 14.4157L75.2998 11.8015ZM165.354 11.8015C163.677 8.29091 160.548 6.34889 155.816 6.34889C150.227 6.34889 145.234 9.85946 145.234 16.8432C145.234 23.6403 149.631 27.4123 155.741 27.4123C160.026 27.4123 163.64 25.6943 165.354 21.9971L160.436 19.4575C159.542 21.1007 158.163 22.1464 155.965 22.1464C153.133 22.1464 151.308 20.1297 151.308 16.8432C151.308 13.5568 153.394 11.5774 155.928 11.5774C157.902 11.5774 159.393 12.4737 160.324 14.4157L165.354 11.8015ZM114.123 26.8894L109.019 17.8516H105.107V26.8894H98.81V0H110.174C116.322 0 120.606 2.95037 120.606 8.73907C120.606 12.4364 118.781 15.0506 115.539 16.6565L121.426 26.8894H114.123ZM105.144 12.5111H109.839C112.745 12.5111 114.161 10.8678 114.161 8.9258C114.161 6.61032 112.819 5.34054 109.839 5.34054H105.144V12.5111ZM54.1741 26.5533V22.3332C53.9133 22.4079 53.5407 22.4826 53.1309 22.4826C52.3485 22.4826 51.9386 22.0717 51.9386 21.3622V14.3784C51.9386 9.14988 48.4363 6.38624 42.6612 6.38624C38.8981 6.38624 35.6938 7.76806 33.6819 9.56069L37.0724 13.37C38.4137 12.1749 40.2021 11.428 41.9533 11.428C44.6359 11.428 45.9027 12.7725 45.9027 14.9759V15.6108C44.6359 15.312 43.0338 15.0133 41.0963 15.0133C36.2154 15.0133 33.0485 17.3661 33.0485 21.2501C33.0485 25.2462 35.6938 27.3376 39.7923 27.3376C42.5867 27.3376 45.083 26.1799 46.3871 24.686C47.1695 26.6654 48.8834 27.1882 50.56 27.1882C51.7151 27.2256 53.0564 27.0388 54.1741 26.5533ZM45.94 20.2418C45.94 22.0717 44.1888 23.2668 42.1768 23.2668C40.2766 23.2668 39.3452 22.2958 39.3452 20.9514C39.3452 19.5322 40.3884 18.4865 42.5122 18.4865C43.8162 18.4865 44.9712 18.7106 45.94 18.9346V20.2418ZM187.188 26.8894L179.997 14.3784L186.741 7.02113H179.959L172.843 14.9386V0.0373464H166.77V26.9268H172.843V22.0717L175.749 18.972L180.295 26.9268H187.188V26.8894ZM97.2079 26.8894L90.017 14.3784L96.7608 7.02113H89.9052L82.8633 14.9386V0.0373464H76.7902V26.9268H82.8633V22.0717L85.7695 18.972L90.3151 26.9268H97.2079V26.8894ZM190.914 23.1548C192.18 23.1548 192.925 23.9391 192.925 25.1342C192.925 26.3292 192.18 27.1135 190.914 27.1135C189.647 27.1135 188.902 26.3292 188.902 25.1342C188.902 23.9391 189.647 23.1548 190.914 23.1548ZM190.914 26.8521C191.919 26.8521 192.59 26.2545 192.59 25.1342C192.59 24.0138 191.882 23.4162 190.914 23.4162C189.908 23.4162 189.237 24.0138 189.237 25.1342C189.2 26.2919 189.908 26.8521 190.914 26.8521ZM190.131 24.1258H190.951C191.435 24.1258 191.696 24.3872 191.696 24.7607C191.696 25.0968 191.547 25.2835 191.286 25.3956L191.659 26.1052H191.286L190.951 25.4703H190.504V26.1052H190.131V24.1258ZM190.504 24.4246V25.1342H190.914C191.174 25.1342 191.323 25.0595 191.323 24.798C191.323 24.574 191.212 24.4619 190.951 24.4619H190.504V24.4246Z" fill="#9CA1AF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.1 KiB |
3
public/navigation-building-010.svg
Normal file
3
public/navigation-building-010.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2.66699 26.6668H5.33366M5.33366 26.6668H12.0003M5.33366 26.6668V9.60042C5.33366 8.10695 5.33366 7.35966 5.62431 6.78923C5.87997 6.28746 6.28762 5.87981 6.78939 5.62415C7.35982 5.3335 8.10711 5.3335 9.60059 5.3335H11.7339C13.2274 5.3335 13.9731 5.3335 14.5435 5.62415C15.0453 5.87981 15.4543 6.28746 15.71 6.78923C16.0003 7.3591 16.0003 8.10549 16.0003 9.59604V13.3338M12.0003 26.6668H26.667M12.0003 26.6668V19.1577C12.0003 18.4572 12.0003 18.1068 12.0843 17.7801C12.1588 17.4906 12.2813 17.216 12.4469 16.9671C12.6337 16.6864 12.8952 16.4514 13.4157 15.9838L16.4845 13.2268C17.4908 12.3227 17.9943 11.8703 18.5636 11.6987C19.0656 11.5474 19.6013 11.5474 20.1032 11.6987C20.673 11.8705 21.1772 12.3231 22.1852 13.2287L25.2519 15.9838C25.773 16.4519 26.033 16.6862 26.2199 16.9671C26.3855 17.216 26.5079 17.4906 26.5824 17.7801C26.6664 18.1068 26.667 18.4572 26.667 19.1577V26.6668M26.667 26.6668H29.3337" stroke="#FCFCFD" stroke-width="2.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
3
public/navigation-map0.svg
Normal file
3
public/navigation-map0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10 4V14M10 4L14 2V12L10 14M10 4L6 2M10 14L6 12M6 12L2 14V4L6 2M6 12V2" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 269 B |
3
public/system-data0.svg
Normal file
3
public/system-data0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18 12V17C18 18.6569 15.3137 20 12 20C8.68629 20 6 18.6569 6 17V12M18 12V7M18 12C18 13.6569 15.3137 15 12 15C8.68629 15 6 13.6569 6 12M18 7C18 5.34315 15.3137 4 12 4C8.68629 4 6 5.34315 6 7M18 7C18 8.65685 15.3137 10 12 10C8.68629 10 6 8.65685 6 7M6 12V7" stroke="#111827" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 451 B |
12
public/usd-coin-usdc-logo-10.svg
Normal file
12
public/usd-coin-usdc-logo-10.svg
Normal file
@@ -0,0 +1,12 @@
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4_10710)">
|
||||
<path d="M32 64C49.7334 64 64 49.7334 64 32C64 14.2666 49.7334 0 32 0C14.2666 0 0 14.2666 0 32C0 49.7334 14.2666 64 32 64Z" fill="#2775CA"/>
|
||||
<path d="M40.8002 37.0666C40.8002 32.4 38.0002 30.8 32.4002 30.1335C28.4002 29.6 27.6002 28.5335 27.6002 26.6666C27.6002 24.7997 28.9336 23.6 31.6002 23.6C34.0002 23.6 35.3336 24.4 36.0002 26.4C36.1336 26.8 36.5336 27.0666 36.9336 27.0666H39.0667C39.6002 27.0666 40.0002 26.6666 40.0002 26.1335V26C39.4667 23.0666 37.0667 20.8 34.0002 20.5335V17.3335C34.0002 16.8 33.6002 16.4 32.9336 16.2666H30.9336C30.4002 16.2666 30.0002 16.6666 29.8667 17.3335V20.4C25.8667 20.9335 23.3336 23.6 23.3336 26.9335C23.3336 31.3335 26.0002 33.0666 31.6002 33.7335C35.3336 34.4 36.5336 35.2 36.5336 37.3335C36.5336 39.4669 34.6667 40.9335 32.1336 40.9335C28.6667 40.9335 27.4667 39.4666 27.0667 37.4666C26.9336 36.9335 26.5336 36.6666 26.1336 36.6666H23.8667C23.3336 36.6666 22.9336 37.0666 22.9336 37.6V37.7335C23.4667 41.0666 25.6002 43.4666 30.0002 44.1335V47.3335C30.0002 47.8666 30.4002 48.2666 31.0667 48.4H33.0667C33.6002 48.4 34.0002 48 34.1336 47.3335V44.1335C38.1336 43.4666 40.8002 40.6666 40.8002 37.0666Z" fill="white"/>
|
||||
<path d="M25.1997 51.0666C14.7997 47.3335 9.46623 35.7335 13.3331 25.4666C15.3331 19.8666 19.7331 15.6001 25.1997 13.6001C25.7331 13.3335 25.9997 12.9335 25.9997 12.2666V10.4001C25.9997 9.86662 25.7331 9.46662 25.1997 9.3335C25.0662 9.3335 24.7997 9.3335 24.6662 9.46662C11.9997 13.4666 5.06623 26.9335 9.06623 39.6001C11.4662 47.0666 17.1997 52.8001 24.6662 55.2001C25.1997 55.4666 25.7331 55.2001 25.8662 54.6666C25.9997 54.5335 25.9997 54.4001 25.9997 54.1335V52.2666C25.9997 51.8666 25.5997 51.3335 25.1997 51.0666ZM39.3331 9.46662C38.7997 9.20006 38.2662 9.46662 38.1331 10.0001C37.9997 10.1335 37.9997 10.2666 37.9997 10.5335V12.4001C37.9997 12.9335 38.3997 13.4666 38.7997 13.7335C49.1997 17.4666 54.5331 29.0666 50.6662 39.3335C48.6662 44.9335 44.2662 49.2001 38.7997 51.2001C38.2662 51.4666 37.9997 51.8666 37.9997 52.5335V54.4001C37.9997 54.9335 38.2662 55.3335 38.7997 55.4666C38.9331 55.4666 39.1997 55.4666 39.3331 55.3335C51.9997 51.3335 58.9331 37.8666 54.9331 25.2001C52.5331 17.6001 46.6662 11.8666 39.3331 9.46662Z" fill="white"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_4_10710">
|
||||
<rect width="64" height="64" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.4 KiB |
5
public/vuesax-linear-buy-crypto1.svg
Normal file
5
public/vuesax-linear-buy-crypto1.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.3333 10.0002C10.22 10.0002 10.1 9.9935 9.98667 9.98684C9.82001 7.8735 8.12666 6.18016 6.01333 6.01349C6.00666 5.90016 6 5.78016 6 5.66683C6 3.2735 7.94 1.3335 10.3333 1.3335C12.7267 1.3335 14.6667 3.2735 14.6667 5.66683C14.6667 8.06016 12.7267 10.0002 10.3333 10.0002Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M5.66683 14.6667C3.2735 14.6667 1.3335 12.7267 1.3335 10.3333C1.3335 7.94 3.2735 6 5.66683 6C5.78016 6 5.90016 6.00666 6.01349 6.01333C8.12682 6.17999 9.82017 7.87334 9.98684 9.98667C9.9935 10.1 10.0002 10.22 10.0002 10.3333C10.0002 12.7267 8.06016 14.6667 5.66683 14.6667Z" stroke="#111827" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path opacity="0.01" fill-rule="evenodd" clip-rule="evenodd" d="M16 0V16H0V0H16Z" stroke="#111827" stroke-width="1.5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 960 B |
3
public/warning-shield-check0.svg
Normal file
3
public/warning-shield-check0.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15 9L11 13L9 11M20 10.165C20 16.7333 15.0319 19.6781 12.9258 20.6314L12.9231 20.6325C12.7016 20.7328 12.5906 20.7831 12.3389 20.8263C12.1795 20.8537 11.8215 20.8537 11.6621 20.8263C11.4094 20.7829 11.2972 20.7325 11.074 20.6314C8.9678 19.6781 4 16.7333 4 10.165V6.2002C4 5.08009 4 4.51962 4.21799 4.0918C4.40973 3.71547 4.71547 3.40973 5.0918 3.21799C5.51962 3 6.08009 3 7.2002 3H16.8002C17.9203 3 18.4796 3 18.9074 3.21799C19.2837 3.40973 19.5905 3.71547 19.7822 4.0918C20 4.5192 20 5.07899 20 6.19691V10.165Z" stroke="#111827" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 708 B |
20
public/wintermute0.svg
Normal file
20
public/wintermute0.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 10 KiB |
45
tailwind.config.ts
Normal file
45
tailwind.config.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
import type { Config } from "tailwindcss";
|
||||
|
||||
export default {
|
||||
darkMode: "class",
|
||||
content: [
|
||||
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
background: "var(--background)",
|
||||
foreground: "var(--foreground)",
|
||||
'bg-subtle': '#f9fafb',
|
||||
'bg-surface': '#ffffff',
|
||||
'border-normal': '#e5e7eb',
|
||||
'border-gray': '#f3f4f6',
|
||||
'text-primary': '#111827',
|
||||
'text-tertiary': '#9ca1af',
|
||||
'fill-secondary-click': '#f3f4f6',
|
||||
},
|
||||
fontFamily: {
|
||||
inter: ['var(--font-inter)', 'Inter', 'sans-serif'],
|
||||
jetbrains: ['var(--font-jetbrains)', 'JetBrains Mono', 'monospace'],
|
||||
domine: ['var(--font-domine)', 'Domine', 'serif'],
|
||||
},
|
||||
fontSize: {
|
||||
'caption-tiny': ['12px', { lineHeight: '150%', letterSpacing: '0.01em' }],
|
||||
'body-small': ['14px', { lineHeight: '150%' }],
|
||||
'body-default': ['16px', { lineHeight: '150%' }],
|
||||
'body-large': ['18px', { lineHeight: '150%' }],
|
||||
'heading-h3': ['24px', { lineHeight: '130%', letterSpacing: '-0.005em' }],
|
||||
'heading-h2': ['32px', { lineHeight: '120%', letterSpacing: '-0.01em' }],
|
||||
},
|
||||
fontWeight: {
|
||||
regular: '400',
|
||||
medium: '500',
|
||||
bold: '700',
|
||||
extrabold: '800',
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
} satisfies Config;
|
||||
27
tsconfig.json
Normal file
27
tsconfig.json
Normal file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2017",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
Reference in New Issue
Block a user