+
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
index 34c31ed..e3f39f6 100644
--- a/src/components/layout/Footer.tsx
+++ b/src/components/layout/Footer.tsx
@@ -2,33 +2,7 @@
import { motion } from 'framer-motion';
import { Github, Twitter, Linkedin, Youtube, Bike, ArrowUpRight } from 'lucide-react';
-
-const footerLinks = {
- 产品: [
- { label: '功能', href: '#' },
- { label: '定价', href: '#' },
- { label: '更新日志', href: '#' },
- { label: '路线图', href: '#' },
- ],
- 公司: [
- { label: '关于我们', href: '#' },
- { label: '博客', href: '#' },
- { label: '招聘', href: '#' },
- { label: '联系我们', href: '#' },
- ],
- 资源: [
- { label: '文档', href: '#' },
- { label: 'API 参考', href: '#' },
- { label: '社区', href: '#' },
- { label: '帮助中心', href: '#' },
- ],
- 法律: [
- { label: '隐私政策', href: '#' },
- { label: '服务条款', href: '#' },
- { label: '安全说明', href: '#' },
- { label: 'Cookie 设置', href: '#' },
- ],
-};
+import { useTranslation } from '@/lib/i18n';
const socialLinks = [
{ icon: Github, href: '#', label: 'GitHub' },
@@ -38,6 +12,36 @@ const socialLinks = [
];
export function Footer() {
+ const t = useTranslation();
+ const currentYear = new Date().getFullYear();
+
+ const footerLinks = {
+ [t('footer.categories.product.label')]: [
+ { label: t('footer.categories.product.features'), href: '#' },
+ { label: t('footer.categories.product.pricing'), href: '#' },
+ { label: t('footer.categories.product.changelog'), href: '#' },
+ { label: t('footer.categories.product.roadmap'), href: '#' },
+ ],
+ [t('footer.categories.company.label')]: [
+ { label: t('footer.categories.company.about'), href: '#' },
+ { label: t('footer.categories.company.blog'), href: '#' },
+ { label: t('footer.categories.company.careers'), href: '#' },
+ { label: t('footer.categories.company.contact'), href: '#' },
+ ],
+ [t('footer.categories.resources.label')]: [
+ { label: t('footer.categories.resources.docs'), href: '#' },
+ { label: t('footer.categories.resources.api'), href: '#' },
+ { label: t('footer.categories.resources.community'), href: '#' },
+ { label: t('footer.categories.resources.help'), href: '#' },
+ ],
+ [t('footer.categories.legal.label')]: [
+ { label: t('footer.categories.legal.privacy'), href: '#' },
+ { label: t('footer.categories.legal.terms'), href: '#' },
+ { label: t('footer.categories.legal.security'), href: '#' },
+ { label: t('footer.categories.legal.cookies'), href: '#' },
+ ],
+ };
+
return (
- 为骑行爱好者打造的专业自行车配置平台，让每一辆车都独一无二。
+ {t('footer.description')}
{/* 社交链接 */}
@@ -107,7 +111,10 @@ export function Footer() {
whileHover={{ x: 2 }}
>
{link.label}
-
+
))}
@@ -122,20 +129,24 @@ export function Footer() {
- © 2024 Veloform. All rights reserved.
+ {t('footer.copyright', { year: currentYear })}
- {['隐私政策', '服务条款', 'Cookie 设置'].map((item, index) => (
+ {[
+ { label: t('footer.categories.legal.privacy'), href: '#' },
+ { label: t('footer.categories.legal.terms'), href: '#' },
+ { label: t('footer.categories.legal.cookies'), href: '#' },
+ ].map((item, index) => (
- {item}
+ {item.label}
))}
diff --git a/src/components/layout/Navbar.tsx b/src/components/layout/Navbar.tsx
index a5ddc61..3cc9b50 100644
--- a/src/components/layout/Navbar.tsx
+++ b/src/components/layout/Navbar.tsx
@@ -1,10 +1,13 @@
'use client';
import { useState, useEffect, useRef, useCallback } from 'react';
+import Link from 'next/link';
import { motion, AnimatePresence } from 'framer-motion';
import { Menu, X, User, Moon, Sun, Bike } from 'lucide-react';
import { useTheme } from 'next-themes';
import { cn } from '@/lib/utils';
+import { APP_CONSTANTS } from '@/lib/constants';
+import { useTranslation } from '@/lib/i18n';
interface NavbarProps {
onNavigate: (page: string) => void;
@@ -17,6 +20,7 @@ export function Navbar({ onNavigate }: NavbarProps) {
const [mounted, setMounted] = useState(false);
const menuRef = useRef
(null);
const menuButtonRef = useRef(null);
+ const t = useTranslation();
useEffect(() => {
setMounted(true);
@@ -31,14 +35,17 @@ export function Navbar({ onNavigate }: NavbarProps) {
}, []);
// Keyboard navigation for mobile menu
- const handleMenuKeyDown = useCallback((e: React.KeyboardEvent) => {
- if (!isMobileMenuOpen) return;
+ const handleMenuKeyDown = useCallback(
+ (e: React.KeyboardEvent) => {
+ if (!isMobileMenuOpen) return;
- if (e.key === 'Escape') {
- setIsMobileMenuOpen(false);
- menuButtonRef.current?.focus();
- }
- }, [isMobileMenuOpen]);
+ if (e.key === 'Escape') {
+ setIsMobileMenuOpen(false);
+ menuButtonRef.current?.focus();
+ }
+ },
+ [isMobileMenuOpen]
+ );
// Focus trap in mobile menu
useEffect(() => {
@@ -69,8 +76,10 @@ export function Navbar({ onNavigate }: NavbarProps) {
}, [isMobileMenuOpen]);
const navItems = [
- { label: '配置器', href: 'home' },
- { label: '配置库', href: 'library' },
+ { label: t('nav.home'), href: 'home', path: '/' },
+ { label: t('nav.library'), href: 'library', path: '/library' },
+ { label: t('nav.about'), href: 'about', path: '/about' },
+ { label: t('nav.faq'), href: 'faq', path: '/faq' },
];
const toggleTheme = () => {
@@ -100,7 +109,10 @@ export function Navbar({ onNavigate }: NavbarProps) {
whileTap={{ scale: 0.98 }}
aria-label="返回首页"
>
-
+
@@ -111,24 +123,27 @@ export function Navbar({ onNavigate }: NavbarProps) {
{/* Desktop Navigation - 统一导航链接样式 */}
{navItems.map((item, index) => (
- onNavigate(item.href)}
+ href={item.path}
className={cn(
'relative px-5 py-2.5 rounded-xl text-sm font-medium transition-colors min-h-[44px] min-w-[44px]',
'text-secondary hover:text-foreground',
'hover:bg-surface-tertiary/50',
'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2'
)}
- initial={{ opacity: 0, y: -10 }}
- animate={{ opacity: 1, y: 0 }}
- transition={{ delay: index * 0.1 }}
- whileHover={{ y: -2 }}
- whileTap={{ scale: 0.98 }}
- aria-label={item.label}
>
- {item.label}
-
+
+ {item.label}
+
+
))}
@@ -138,7 +153,7 @@ export function Navbar({ onNavigate }: NavbarProps) {
@@ -150,11 +165,7 @@ export function Navbar({ onNavigate }: NavbarProps) {
transition={{ duration: 0.2 }}
aria-hidden="true"
>
- {theme === 'dark' ? (
-
- ) : (
-
- )}
+ {theme === 'dark' ? : }
)}
@@ -178,7 +189,7 @@ export function Navbar({ onNavigate }: NavbarProps) {
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
-
+
@@ -226,7 +237,7 @@ export function Navbar({ onNavigate }: NavbarProps) {
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
>
-
+
@@ -245,12 +256,14 @@ export function Navbar({ onNavigate }: NavbarProps) {
transition={{ delay: index * 0.1 }}
>
{/* 悬停箭头 */}
@@ -118,11 +129,14 @@ export function Features() {
whileHover={{ x: 0 }}
aria-hidden="true"
>
-