fix: パンくずリストのコンポーネントのスタイルを修正

Author: 3w36zj6

website/src/components/ui/common/Breadcrumbs.tsx

@@ -8,28 +8,28 @@ export type BreadcrumbsProps = {
 export const Breadcrumbs = ({ path }: BreadcrumbsProps) => {
   return (
     <nav class="flex justify-between px-3.5 py-1 border border-neutral-200/60 rounded-md">
-      <ol class="inline-flex items-center mb-3 space-x-1 text-xs text-neutral-500 [&_.active-breadcrumb]:text-neutral-600 [&_.active-breadcrumb]:font-medium sm:mb-0">
+      <ol class="inline-flex items-center mb-3 space-x-1 text-sm text-gray-600 sm:mb-0">
         <li class="flex items-center h-full">
-          <a href="/docs/" class="py-1 hover:text-neutral-900">
+          <a href="/docs/" class="py-1 hover:text-gray-800 transition-colors">
             <div class="w-4 h-4">
               <HomeIcon />
             </div>
           </a>
         </li>
         {path.map((item, idx) => (
           <>
-            <div class="w-4 h-4 text-gray-400/70">
+            <div class="w-4 h-4 text-gray-400">
               <ChevronRightIcon />
             </div>
             <li>
               {idx === path.length - 1 ? (
-                <a class="inline-flex items-center py-1 font-semibold text-neutral-700 rounded cursor-default focus:outline-none">
+                <span class="inline-flex items-center py-1 font-semibold text-gray-800 cursor-default">
                   {item.title}
-                </a>
+                </span>
               ) : (
                 <a
                   href={item.route}
-                  class="inline-flex items-center py-1 font-normal hover:text-neutral-900 focus:outline-none"
+                  class="inline-flex items-center py-1 hover:text-gray-800 transition-colors focus:outline-none"
                 >
                   {item.title}
                 </a>