大改变

components/layout/Breadcrumb.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import Image from "next/image";
+import Link from "next/link";
+
+interface BreadcrumbItem {
+  label: string;
+  href?: string;
+}
+
+interface BreadcrumbProps {
+  items: BreadcrumbItem[];
+}
+
+export default function Breadcrumb({ items }: BreadcrumbProps) {
+  return (
+    <nav className="flex items-center gap-[3px] h-5">
+      {items.map((item, index) => {
+        const isLast = index === items.length - 1;
+        const content = (
+          <span
+            className={`text-sm font-medium leading-[150%] ${
+              isLast
+                ? "text-text-primary dark:text-white font-bold"
+                : "text-text-tertiary dark:text-gray-400 hover:text-text-secondary dark:hover:text-gray-300 transition-colors cursor-pointer"
+            }`}
+          >
+            {item.label}
+          </span>
+        );
+
+        return (
+          <div key={index} className="flex items-center gap-[3px]">
+            {!isLast && item.href ? (
+              <Link href={item.href}>{content}</Link>
+            ) : (
+              content
+            )}
+            {!isLast && (
+              <Image
+                src="/icon-chevron-right.svg"
+                alt="›"
+                width={14}
+                height={14}
+                className="flex-shrink-0 dark:invert"
+              />
+            )}
+          </div>
+        );
+      })}
+    </nav>
+  );
+}