feat: 添加面包屑导航组件并优化页面布局

refactor: 重构页面结构和导航逻辑

fix: 修复移动端菜单导航和滚动行为

perf: 优化图片加载性能和资源请求

test: 添加端到端测试和性能测试用例

docs: 更新.gitignore文件

chore: 更新依赖和配置

style: 优化代码格式和类型安全

ci: 调整Playwright测试超时时间

build: 更新Next.js配置和构建选项

src/components/layout/breadcrumb.tsx

@@ -0,0 +1,34 @@
+'use client';
+
+import Link from 'next/link';
+import { ChevronRight, Home } from 'lucide-react';
+
+interface BreadcrumbItem {
+  label: string;
+  href: string;
+}
+
+interface BreadcrumbProps {
+  items: BreadcrumbItem[];
+}
+
+export function Breadcrumb({ items }: BreadcrumbProps) {
+  return (
+    <nav aria-label="breadcrumb" className="flex items-center space-x-2 text-sm text-[#5C5C5C] py-4">
+      <Link href="/" className="flex items-center hover:text-[#C41E3A] transition-colors">
+        <Home className="w-4 h-4" />
+      </Link>
+      {items.map((item, index) => (
+        <div key={index} className="flex items-center">
+          <ChevronRight className="w-4 h-4 text-[#E5E5E5]" />
+          <Link
+            href={item.href}
+            className="ml-2 hover:text-[#C41E3A] transition-colors"
+          >
+            {item.label}
+          </Link>
+        </div>
+      ))}
+    </nav>
+  );
+}

src/components/layout/header.tsx

@@ -37,13 +37,21 @@ export function Header() {
       }
     };
 
+    const handleGlobalKeyDown = (e: KeyboardEvent) => {
+      if (e.key === 'Escape' && isOpen) {
+        setIsOpen(false);
+      }
+    };
+
     window.addEventListener('scroll', handleScroll, { passive: true });
+    window.addEventListener('keydown', handleGlobalKeyDown);
     handleScroll();
 
     return () => {
       window.removeEventListener('scroll', handleScroll);
+      window.removeEventListener('keydown', handleGlobalKeyDown);
     };
-  }, [pathname]);
+  }, [pathname, isOpen]);
 
   const handleKeyDown = useCallback((e: React.KeyboardEvent) => {
     if (e.key === 'Enter' || e.key === ' ') {

src/components/layout/mobile-tab-bar.tsx

@@ -21,7 +21,8 @@ export function MobileTabBar() {
     if (href === '/') {
       return pathname === '/';
     }
-    return pathname.startsWith(href.split('#')[0]);
+    const basePath = href.split('#')[0] || href;
+    return pathname.startsWith(basePath);
   };
 
   return (