diff --git a/components/Providers.tsx b/components/Providers.tsx
new file mode 100644
index 0000000..bdce6c7
--- /dev/null
+++ b/components/Providers.tsx
@@ -0,0 +1,15 @@
+'use client';
+
+import { LanguageProvider } from '@/contexts/LanguageContext';
+import TransitionWrapper from './TransitionWrapper';
+import { ReactNode } from 'react';
+
+export default function Providers({ children }: { children: ReactNode }) {
+ return (
+
+
+ {children}
+
+
+ );
+}
diff --git a/components/ResourceMenu.tsx b/components/ResourceMenu.tsx
index 5323a2e..19e17a8 100644
--- a/components/ResourceMenu.tsx
+++ b/components/ResourceMenu.tsx
@@ -1,6 +1,7 @@
'use client';
import Image from 'next/image';
+import { useState, useEffect } from 'react';
interface ResourceMenuProps {
isOpen: boolean;
@@ -9,7 +10,26 @@ interface ResourceMenuProps {
}
export default function ResourceMenu({ isOpen, onClose, language }: ResourceMenuProps) {
- if (!isOpen) return null;
+ const [isVisible, setIsVisible] = useState(false);
+ const [isClosing, setIsClosing] = useState(false);
+
+ useEffect(() => {
+ if (isOpen) {
+ setIsVisible(true);
+ setIsClosing(false);
+ } else if (isVisible) {
+ // 触发退出动画
+ setIsClosing(true);
+ // 动画结束后隐藏组件
+ const timer = setTimeout(() => {
+ setIsVisible(false);
+ setIsClosing(false);
+ }, 300); // 匹配动画时长
+ return () => clearTimeout(timer);
+ }
+ }, [isOpen, isVisible]);
+
+ if (!isVisible) return null;
const content = {
zh: {
@@ -76,12 +96,12 @@ export default function ResourceMenu({ isOpen, onClose, language }: ResourceMenu
<>
{/* Backdrop */}
{/* Menu */}
-
@@ -98,7 +118,7 @@ export default function ResourceMenu({ isOpen, onClose, language }: ResourceMenu
(null);
useEffect(() => {
- setMounted(true);
+ const currentRef = sectionRef.current;
+ if (!currentRef) return;
const observer = new IntersectionObserver(
(entries) => {
- entries.forEach((entry) => {
- if (entry.isIntersecting && !visible) {
- setVisible(true);
- }
- });
+ if (entries[0].isIntersecting) {
+ setAnimate(true);
+ observer.disconnect();
+ }
},
- {
- threshold: 0.1,
- }
+ { threshold: 0.3 }
);
- if (sectionRef.current) {
- observer.observe(sectionRef.current);
- }
-
- return () => {
- if (sectionRef.current) {
- observer.unobserve(sectionRef.current);
- }
- };
- }, [visible]);
+ observer.observe(currentRef);
+ return () => observer.disconnect();
+ }, []);
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.',
+ titleKey: 'security.audited.title',
+ descKey: 'security.audited.desc',
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.',
+ titleKey: 'security.segregated.title',
+ descKey: 'security.segregated.desc',
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.',
+ titleKey: 'security.transparency.title',
+ descKey: 'security.transparency.desc',
position: 'bottom-left'
},
{
icon: '/component-11.svg',
- title: 'Powered By NASDAQ & HKEX Listed Partners',
- description: null,
+ titleKey: 'security.partners.title',
+ descKey: null,
position: 'bottom-right',
special: true
}
@@ -78,7 +70,7 @@ export default function SecuritySection() {
{/* Left Side - Title */}
- Security First Architecture
+ {t('security.title')}
- Real-time data transparency with segregated asset management.
+ {t('security.subtitle')}
@@ -125,9 +117,9 @@ export default function SecuritySection() {
>
{features.map((feature, index) => (
- {feature.title}
+ {t(feature.titleKey)}
- {feature.title}
+ {t(feature.titleKey)}
- {feature.description}
+ {feature.descKey && t(feature.descKey)}
diff --git a/components/ShatterTransition.tsx b/components/ShatterTransition.tsx
new file mode 100644
index 0000000..da36a41
--- /dev/null
+++ b/components/ShatterTransition.tsx
@@ -0,0 +1,103 @@
+'use client';
+
+import { useEffect, useState, useMemo } from 'react';
+
+interface ShatterTransitionProps {
+ isActive: boolean;
+ onComplete: () => void;
+}
+
+// 增加网格密度以获得更细腻的破碎感
+const GRID_COLS = 10;
+const GRID_ROWS = 10;
+
+export default function ShatterTransition({ isActive, onComplete }: ShatterTransitionProps) {
+ const [isAnimating, setIsAnimating] = useState(false);
+
+ useEffect(() => {
+ if (isActive) {
+ setIsAnimating(true);
+ // 总动画时间 = 最大延迟 + 单个动画时长
+ // 这里预留充足时间确保最后一片落完
+ const timer = setTimeout(() => {
+ setIsAnimating(false);
+ onComplete();
+ }, 1500);
+ return () => clearTimeout(timer);
+ } else {
+ setIsAnimating(false);
+ }
+ }, [isActive, onComplete]);
+
+ // 预先计算碎片数据，避免重渲染时的性能抖动
+ const fragments = useMemo(() => {
+ return Array.from({ length: GRID_COLS * GRID_ROWS }, (_, i) => {
+ const col = i % GRID_COLS;
+ const row = Math.floor(i / GRID_COLS);
+
+ // 核心算法：计算距离左上角的距离 (欧几里得距离)
+ // 距离越远，delay 越大
+ const distance = Math.sqrt(col * col + row * row);
+ const maxDistance = Math.sqrt(GRID_COLS * GRID_COLS + GRID_ROWS * GRID_ROWS);
+ const normalizedDistance = distance / maxDistance;
+
+ // 爆炸参数
+ const randomX = (Math.random() - 0.5) * 200; // X轴偏移
+ const randomY = Math.random() * 300 + 100; // Y轴主要向下掉落
+ const randomRotateX = (Math.random() - 0.5) * 720; // 剧烈翻滚
+ const randomRotateY = (Math.random() - 0.5) * 720;
+ const randomScale = 0.5 + Math.random() * 0.5; // 碎片大小不一
+
+ return {
+ id: i,
+ col,
+ row,
+ // 延迟时间：基准延迟 + 随机微扰 (让波浪不那么死板)
+ delay: normalizedDistance * 600 + (Math.random() * 100),
+ randomX,
+ randomY,
+ randomRotateX,
+ randomRotateY,
+ randomScale
+ };
+ });
+ }, []);
+
+ if (!isActive && !isAnimating) return null;
+
+ return (
+
+
+ {fragments.map((frag) => (
+
+ {/* 内部容器负责材质，外部容器负责位置，分离关注点 */}
+
+
+ ))}
+
+
+ {/* 可选：背景遮罩，防止碎片飞走后直接漏出底部内容，根据需求调整 */}
+
+
+ );
+}
diff --git a/components/StatsSection.tsx b/components/StatsSection.tsx
index 8664e58..4ea9e22 100644
--- a/components/StatsSection.tsx
+++ b/components/StatsSection.tsx
@@ -2,14 +2,15 @@
import { useState, useEffect, useRef } from 'react';
import Image from 'next/image';
+import { useLanguage } from '@/contexts/LanguageContext';
-// 数字增长动画Hook
+// 数字增长动画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
(null);
const startValueRef = useRef(end);
+ const timerRef = useRef(null);
// 客户端挂载后设置随机起始值
useEffect(() => {
@@ -23,28 +24,38 @@ function useCountUp(end: number, duration: number = 1500, startRangePercent: num
const observer = new IntersectionObserver(
(entries) => {
- if (entries[0].isIntersecting && !hasAnimated) {
- setHasAnimated(true);
- const start = startValueRef.current;
- const startTime = Date.now();
+ if (entries[0].isIntersecting) {
+ // 进入视口 - 检查是否需要开始动画
+ if (!timerRef.current) {
+ const start = startValueRef.current;
+ const startTime = Date.now();
- const timer = setInterval(() => {
- const elapsed = Date.now() - startTime;
- const progress = Math.min(elapsed / duration, 1);
+ timerRef.current = 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);
+ // 使用缓动函数 - easeOutCubic 更自然
+ const easeOutCubic = 1 - Math.pow(1 - progress, 3);
+ const currentCount = Math.floor(start + (end - start) * easeOutCubic);
- setCount(currentCount);
+ setCount(currentCount);
- if (progress === 1) {
- setCount(end); // 确保最终值准确
- clearInterval(timer);
- }
- }, 16);
-
- return () => clearInterval(timer);
+ if (progress === 1) {
+ setCount(end); // 确保最终值准确
+ if (timerRef.current) {
+ clearInterval(timerRef.current);
+ timerRef.current = null;
+ }
+ }
+ }, 16);
+ }
+ } else {
+ // 离开视口 - 停止并重置
+ if (timerRef.current) {
+ clearInterval(timerRef.current);
+ timerRef.current = null;
+ }
+ setCount(startValueRef.current);
}
},
{ threshold: 0.1 }
@@ -54,8 +65,14 @@ function useCountUp(end: number, duration: number = 1500, startRangePercent: num
observer.observe(elementRef.current);
}
- return () => observer.disconnect();
- }, [end, duration, hasAnimated, mounted]);
+ return () => {
+ observer.disconnect();
+ if (timerRef.current) {
+ clearInterval(timerRef.current);
+ timerRef.current = null;
+ }
+ };
+ }, [end, duration, mounted]);
return { count, elementRef };
}
@@ -75,6 +92,7 @@ function formatNumber(num: number, prefix: string = '', suffix: string = '', for
}
export default function StatsSection() {
+ const { t } = useLanguage();
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%开始
@@ -135,7 +153,7 @@ export default function StatsSection() {
fontWeight: 400
}}
>
- Total Value Locked
+ {t('stats.tvl')}
- Avg. APY
+ {t('stats.apy')}
- Yield Captured
+ {t('stats.yield')}
- Connected Users
+ {t('stats.users')}
{/* .frame-38 - Number and avatars */}
diff --git a/components/TransitionWrapper.tsx b/components/TransitionWrapper.tsx
new file mode 100644
index 0000000..5eec28d
--- /dev/null
+++ b/components/TransitionWrapper.tsx
@@ -0,0 +1,36 @@
+'use client';
+
+import { useLanguage } from '@/contexts/LanguageContext';
+import ShatterTransition from './ShatterTransition';
+import { useState, useEffect } from 'react';
+
+export default function TransitionWrapper({ children }: { children: React.ReactNode }) {
+ const { transitionKey } = useLanguage();
+ const [isActive, setIsActive] = useState(false);
+
+ useEffect(() => {
+ // transitionKey > 0 表示已经发生过语言切换
+ if (transitionKey > 0) {
+ setIsActive(true);
+
+ // 动画结束后重置状态
+ const timer = setTimeout(() => {
+ setIsActive(false);
+ }, 1500);
+
+ return () => clearTimeout(timer);
+ }
+ }, [transitionKey]);
+
+ return (
+ <>
+ {children}
+
{
+ // 动画完成后的回调
+ }}
+ />
+
+ );
+}
diff --git a/components/TrustedBySection.tsx b/components/TrustedBySection.tsx
index 8c7b8ac..4113872 100644
--- a/components/TrustedBySection.tsx
+++ b/components/TrustedBySection.tsx
@@ -2,55 +2,47 @@
import { useState, useEffect, useRef } from 'react';
import Image from 'next/image';
+import { useLanguage } from '@/contexts/LanguageContext';
+import ConsenSysLogo from './ConsenSysLogo';
export default function TrustedBySection() {
- const [mounted, setMounted] = useState(false);
- const [visible, setVisible] = useState(false);
+ const { t } = useLanguage();
+ const [animate, setAnimate] = useState(false);
const sectionRef = useRef(null);
useEffect(() => {
- setMounted(true);
+ const currentRef = sectionRef.current;
+ if (!currentRef) return;
- // 使用 IntersectionObserver 检测元素进入视口
const observer = new IntersectionObserver(
(entries) => {
- entries.forEach((entry) => {
- if (entry.isIntersecting && !visible) {
- setVisible(true);
- }
- });
+ if (entries[0].isIntersecting) {
+ setAnimate(true);
+ observer.disconnect(); // 触发后立即断开
+ }
},
- {
- threshold: 0.2, // 当20%的元素可见时触发
- }
+ { threshold: 0.3 }
);
- if (sectionRef.current) {
- observer.observe(sectionRef.current);
- }
+ observer.observe(currentRef);
+ return () => observer.disconnect();
+ }, []);
- return () => {
- if (sectionRef.current) {
- observer.unobserve(sectionRef.current);
- }
- };
- }, [visible]);
-
- // 合作伙伴 logo 数据
+ // 合作伙伴 logo 数据 - 统一高度为40px
const partners = [
{
name: 'BlackRock',
src: '/nav-ireland0.svg',
- width: 193,
- height: 28,
- className: 'w-[193px] h-[28px]'
+ width: 200,
+ height: 40,
+ className: 'w-[200px] h-[40px]'
},
{
name: 'Coinbase',
src: '/coinbase-10.svg',
- width: 179,
- height: 32,
- className: 'w-[179px] h-[32px]'
+ width: 180,
+ height: 40,
+ className: 'w-[180px] h-[40px]'
},
{
name: 'Wintermute',
@@ -68,10 +60,10 @@ export default function TrustedBySection() {
},
{
name: 'ConsenSys',
- src: '/logo1.svg', // 临时使用一个 logo
- width: 176,
- height: 40,
- className: 'w-[176px] h-[40px]'
+ src: '', // 使用组合的vector文件
+ width: 220,
+ height: 50,
+ className: 'w-[220px] h-[50px]'
}
];
@@ -96,33 +88,39 @@ export default function TrustedBySection() {
fontWeight: 500
}}
>
- Trusted by Industry Leaders
+ {t('trusted.title')}
{/* Logo容器 - .frame-26 */}
{partners.map((partner, index) => (
-
+ {partner.name === 'ConsenSys' ? (
+
+ ) : (
+
+ )}
))}
diff --git a/components/WhyAssetXSection.tsx b/components/WhyAssetXSection.tsx
index 5284806..9596256 100644
--- a/components/WhyAssetXSection.tsx
+++ b/components/WhyAssetXSection.tsx
@@ -2,67 +2,31 @@
import { useState, useEffect, useRef } from 'react';
import Image from 'next/image';
+import { useLanguage } from '@/contexts/LanguageContext';
export default function WhyAssetXSection() {
- const [mounted, setMounted] = useState(false);
- const [visible, setVisible] = useState(false);
+ const { t } = useLanguage();
+ const [animate, setAnimate] = useState(false);
const sectionRef = useRef
(null);
useEffect(() => {
- setMounted(true);
+ const currentRef = sectionRef.current;
+ if (!currentRef) return;
const observer = new IntersectionObserver(
(entries) => {
- entries.forEach((entry) => {
- if (entry.isIntersecting && !visible) {
- setVisible(true);
- }
- });
+ if (entries[0].isIntersecting) {
+ setAnimate(true);
+ observer.disconnect(); // 触发后立即断开，不再监听
+ }
},
- {
- threshold: 0.1,
- }
+ { threshold: 0.5 } // 当50%可见时才触发
);
- if (sectionRef.current) {
- observer.observe(sectionRef.current);
- }
+ observer.observe(currentRef);
- 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 () => observer.disconnect();
+ }, []);
return (
-
+
{/* Header - .frame-27 */}
-
+
{/* Title - .why-assetx */}
- Why ASSETX?
+ {t('why.title')}
{/* Subtitle */}
@@ -99,18 +63,18 @@ export default function WhyAssetXSection() {
fontWeight: 400
}}
>
- Institutional-grade access to real-world yield, with DeFi-native composability.
+ {t('why.subtitle')}
{/* Cards Container - .frame-30 */}
-
+
{/* Left Large Card - Sustainable Real Yield */}
- Sustainable Real Yield
+ {t('why.sustainable.title')}
- Access 15%-30% returns from Delta-neutral arbitrage strategies and commercial credit. No inflationary token emissions, just real profits.
+ {t('why.sustainable.desc')}
@@ -163,18 +127,18 @@ export default function WhyAssetXSection() {
alt="Chart"
width={305}
height={162}
- className="flex-shrink-0 relative"
+ className="w-full h-auto flex-shrink-0 relative"
/>
{/* Right Column - .frame-29 */}
-
+
{/* Proven Reliability Card */}
- Proven Reliability
+ {t('why.reliability.title')}
- Backed by partners holding HK SFC Licenses (1/2/4/5/9) and NASDAQ-listed entities. Audited, compliant, and transparent.
+ {t('why.reliability.desc')}
{/* Right Icon */}
-
-
+
+
+
+
+
+
@@ -239,7 +240,7 @@ export default function WhyAssetXSection() {
-
- {/* Top Section with Icon and Badges */}
-
- {/* Icon and Badges Row */}
-
- {/* Icon */}
-
-
-
+
+ {/* Left Content */}
+
+ {/* Icon */}
+
+
+
- {/* Badges */}
-
-
- 40%+ APR
-
-
- Instant Exit
-
-
+ {/* Text Content */}
+
+
+ {t('why.liquidity.title')}
+
+
+ {t('why.liquidity.desc')}
+
- {/* Text Content */}
-
-
- Flexible Liquidity
-
-
- Solve the illiquidity of traditional finance. Enjoy instant exit via secondary markets or leverage your positions for up to 40% APY.
-
+ {/* Right Badges */}
+
+
+
+ {t('why.liquidity.badge1')}
+
+
+
+
+ {t('why.liquidity.badge2')}
+
+
diff --git a/contexts/LanguageContext.tsx b/contexts/LanguageContext.tsx
new file mode 100644
index 0000000..6fdbf88
--- /dev/null
+++ b/contexts/LanguageContext.tsx
@@ -0,0 +1,232 @@
+'use client';
+
+import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
+
+type Language = 'zh' | 'en';
+
+interface LanguageContextType {
+ language: Language;
+ setLanguage: (lang: Language) => void;
+ t: (key: string) => string;
+ transitionKey: number;
+}
+
+const LanguageContext = createContext
(undefined);
+
+export function LanguageProvider({ children }: { children: ReactNode }) {
+ // 默认语言为英文
+ const [language, setLanguage] = useState('en');
+ const [transitionKey, setTransitionKey] = useState(0);
+ const [pendingLanguage, setPendingLanguage] = useState(null);
+
+ // 监听 pendingLanguage，延迟切换语言
+ useEffect(() => {
+ if (pendingLanguage !== null) {
+ // 延迟 300ms 切换语言，此时蒙版已经完全覆盖
+ const timer = setTimeout(() => {
+ setLanguage(pendingLanguage);
+ setPendingLanguage(null);
+ }, 300);
+ return () => clearTimeout(timer);
+ }
+ }, [pendingLanguage]);
+
+ // 切换语言
+ const handleSetLanguage = (lang: Language) => {
+ if (lang === language) return; // 如果语言相同，不执行切换
+
+ // 先递增transitionKey触发动画
+ setTransitionKey(prev => prev + 1);
+
+ // 设置待切换的语言，稍后才真正切换
+ setPendingLanguage(lang);
+ };
+
+ // 简单的翻译函数
+ const t = (key: string): string => {
+ const translations = getTranslations(language);
+ return translations[key] || key;
+ };
+
+ return (
+
+ {children}
+
+ );
+}
+
+export function useLanguage() {
+ const context = useContext(LanguageContext);
+ if (!context) {
+ throw new Error('useLanguage must be used within a LanguageProvider');
+ }
+ return context;
+}
+
+// 翻译内容
+function getTranslations(lang: Language): Record {
+ const translations = {
+ zh: {
+ // Navbar
+ 'nav.product': '产品',
+ 'nav.resource': '资源',
+ 'nav.community': '社区',
+ 'nav.launchApp': '启动应用',
+
+ // Hero Section
+ 'hero.title1': '链上收益资产',
+ 'hero.title2': '随时可得',
+ 'hero.description': '低门槛投资股票、房地产和商业贷款等收益资产。享受真实资产支持的10%-30%年化收益。',
+ 'hero.startInvesting': '开始投资',
+ 'hero.readWhitepaper': '阅读白皮书',
+
+ // Stats Section
+ 'stats.tvl': '总锁仓价值',
+ 'stats.apy': '平均年化收益',
+ 'stats.yield': '累计收益',
+ 'stats.users': '连接用户',
+
+ // Trusted By Section
+ 'trusted.title': '受到行业领导者信赖',
+
+ // Why AssetX Section
+ 'why.title': '为什么选择ASSETX?',
+ 'why.subtitle': '机构级真实世界收益，兼具DeFi原生可组合性。',
+ 'why.sustainable.title': '可持续真实收益',
+ 'why.sustainable.desc': '从Delta中性套利策略和商业信贷中获得15%-30%的回报。没有通胀代币发行，只有真实利润。',
+ 'why.reliability.title': '经过验证的可靠性',
+ 'why.reliability.desc': '由持有香港证监会1/2/4/5/9号牌照的合作伙伴和纳斯达克上市实体支持。经过审计、合规且透明。',
+ 'why.liquidity.title': '灵活流动性',
+ 'why.liquidity.desc': '解决传统金融的流动性不足问题。通过二级市场即时退出，或通过杠杆头寸享受高达40%的年化收益。',
+ 'why.liquidity.badge1': '40%+年化',
+ 'why.liquidity.badge2': '即时退出',
+
+ // How It Works Section
+ 'how.title': '如何运作',
+ 'how.step1.title': '存入并铸造WUSD',
+ 'how.step1.desc': '连接您的钱包并存入USDC兑换WUSD。这是整个AssetX生态系统的原生稳定币和入口。',
+ 'how.step2.title': '双重投资选择',
+ 'how.step2.desc': '选择您的策略：使用WUSD购买特定的收益资产以获得现实世界回报，或在DeFi池中提供流动性赚取交易费用。',
+ 'how.step3.title': '赚取与提升',
+ 'how.step3.desc': '获得每日收益分配。使用资产代币作为抵押品借入WUSD，利用高达2.5倍的杠杆实现收益最大化。',
+ 'how.simulator.title': '投资组合概览模拟器',
+ 'how.simulator.invest': '如果您投资',
+ 'how.simulator.earn': '您每年赚取',
+
+ // Security Section
+ 'security.title': '安全优先架构',
+ 'security.subtitle': '实时数据透明度与隔离资产管理。',
+ 'security.audited.title': '已审计',
+ 'security.audited.desc': '智能合约由顶级公司审计。底层资产经过严格的尽职调查和财务审计。',
+ 'security.segregated.title': '隔离管理',
+ 'security.segregated.desc': 'SPV设置。用户资产保存在隔离的特殊目的实体中，与平台风险隔离。',
+ 'security.transparency.title': '透明度',
+ 'security.transparency.desc': '实时净值。基金表现数据和资产估值公开可查并在链上更新。',
+ 'security.partners.title': '由纳斯达克和港交所上市合作伙伴提供支持',
+
+ // Footer
+ 'footer.products': '产品',
+ 'footer.product1': 'AX-基金',
+ 'footer.product2': 'AX-矩阵',
+ 'footer.product3': '启动平台',
+ 'footer.product4': '流动性市场',
+ 'footer.product5': '代币工厂',
+ 'footer.resources': '资源',
+ 'footer.resource1': '文档',
+ 'footer.resource2': '常见问题与支持',
+ 'footer.resource3': '信任与安全',
+ 'footer.resource4': '学习中心',
+ 'footer.resource5': '社区论坛',
+ 'footer.company': '公司',
+ 'footer.company1': '关于团队',
+ 'footer.company2': '职业机会',
+ 'footer.company3': '联系我们',
+ 'footer.company4': '新闻媒体',
+ 'footer.privacy': '隐私政策',
+ 'footer.terms': '服务条款',
+ 'footer.copyright': '© 2025 ASSETX协议。保留所有权利。',
+ },
+ en: {
+ // Navbar
+ 'nav.product': 'Product',
+ 'nav.resource': 'Resource',
+ 'nav.community': 'Community',
+ 'nav.launchApp': 'Launch App',
+
+ // Hero Section
+ 'hero.title1': 'Yield-Bearing Asset',
+ 'hero.title2': 'On Chain.',
+ 'hero.description': 'Access Yield- Bearing Asset like Equities, Real Estate, and Commercial Loans with low barriers. Enjoy 10%-30% APY backed by real assets.',
+ 'hero.startInvesting': 'Start Investing',
+ 'hero.readWhitepaper': 'Read the Whitepaper',
+
+ // Stats Section
+ 'stats.tvl': 'Total Value Locked',
+ 'stats.apy': 'Avg. APY',
+ 'stats.yield': 'Yield Captured',
+ 'stats.users': 'Connected Users',
+
+ // Trusted By Section
+ 'trusted.title': 'Trusted by Industry Leaders',
+
+ // Why AssetX Section
+ 'why.title': 'Why ASSETX?',
+ 'why.subtitle': 'Institutional-grade access to real-world yield, with DeFi-native composability.',
+ 'why.sustainable.title': 'Sustainable Real Yield',
+ 'why.sustainable.desc': 'Access 15%-30% returns from Delta-neutral arbitrage strategies and commercial credit. No inflationary token emissions, just real profits.',
+ 'why.reliability.title': 'Proven Reliability',
+ 'why.reliability.desc': 'Backed by partners holding HK SFC Licenses (1/2/4/5/9) and NASDAQ-listed entities. Audited, compliant, and transparent.',
+ 'why.liquidity.title': 'Flexible Liquidity',
+ 'why.liquidity.desc': 'Solve the illiquidity of traditional finance. Enjoy instant exit via secondary markets or leverage your positions for up to 40% APY.',
+ 'why.liquidity.badge1': '40%+ APR',
+ 'why.liquidity.badge2': 'Instant Exit',
+
+ // How It Works Section
+ 'how.title': 'How it works',
+ 'how.step1.title': 'Deposit & Mint WUSD',
+ 'how.step1.desc': 'Connect your wallet and deposit USDC to swap WUSD. This serves as the native stablecoin and gateway to the entire AssetX ecosystem.',
+ 'how.step2.title': 'Dual Investment Options',
+ 'how.step2.desc': '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.',
+ 'how.step3.title': 'Earn & Boost',
+ 'how.step3.desc': 'Receive daily yield distributions. Use Asset Tokens as collateral to borrow WUSD and leverage up to 2.5x for maximized returns.',
+ 'how.simulator.title': 'Portfolio Overview Simulator',
+ 'how.simulator.invest': 'If you invest',
+ 'how.simulator.earn': 'You earn per year',
+
+ // Security Section
+ 'security.title': 'Security First Architecture',
+ 'security.subtitle': 'Real-time data transparency with segregated asset management.',
+ 'security.audited.title': 'Audited',
+ 'security.audited.desc': 'Smart contracts audited by top-tier firms. Underlying assets undergo strict due diligence and financial auditing.',
+ 'security.segregated.title': 'Segregated',
+ 'security.segregated.desc': 'SPV Setup. User assets are held in segregated Special Purpose Vehicles, isolated from platform risks.',
+ 'security.transparency.title': 'Transparency',
+ 'security.transparency.desc': 'Real-Time NAV. Fund performance data and asset valuations are publicly available and updated on-chain.',
+ 'security.partners.title': 'Powered By NASDAQ & HKEX Listed Partners',
+
+ // Footer
+ 'footer.products': 'Products',
+ 'footer.product1': 'AX-Fund',
+ 'footer.product2': 'AX-Matrix',
+ 'footer.product3': 'Launchpad',
+ 'footer.product4': 'Liquid Market',
+ 'footer.product5': 'Token Factory',
+ 'footer.resources': 'Resources',
+ 'footer.resource1': 'Docs',
+ 'footer.resource2': 'FAQ & Support',
+ 'footer.resource3': 'Trust & Security',
+ 'footer.resource4': 'Learning Center',
+ 'footer.resource5': 'Community Forum',
+ 'footer.company': 'Company',
+ 'footer.company1': 'About Team',
+ 'footer.company2': 'Careers',
+ 'footer.company3': 'Contact Us',
+ 'footer.company4': 'Press & Media',
+ 'footer.privacy': 'Privacy Policy',
+ 'footer.terms': 'Terms of Service',
+ 'footer.copyright': '© 2025 ASSETX Protocol. All rights reserved.',
+ }
+ };
+
+ return translations[lang];
+}
diff --git a/package.json b/package.json
index 081fbab..a3bbc4d 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,8 @@
"version": "0.1.0",
"private": true,
"scripts": {
- "dev": "next dev -H 0.0.0.0 -p 3002",
+ "dev": "./scripts/dev.sh",
+ "dev:kill": "pkill -f 'next dev' || pkill -f 'next-server' || true",
"build": "next build",
"start": "next start -p 3002",
"lint": "next lint"
diff --git a/public/component-10.svg b/public/component-10.svg
index 07110e8..8cc36ef 100644
--- a/public/component-10.svg
+++ b/public/component-10.svg
@@ -1,4 +1,4 @@
-