fix: truncate pagination

kopexa-grc · Jan 7, 2025 · 3db91b9 · 3db91b9
1 parent 84bd887
commit 3db91b9
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/src/app/(frontend)/[locale]/(pages)/blog/[slug]/page.tsx b/src/app/(frontend)/[locale]/(pages)/blog/[slug]/page.tsx
@@ -161,14 +161,15 @@ function Breadcrumb({
   items: Array<{ label: string; href: string; current?: boolean }>;
 }) {
   return (
-    <nav aria-label="Breadcrumb" className="mb-6">
-      <ol className="flex flex-wrap items-center gap-2">
+    <nav aria-label="Breadcrumb" className="mb-6 min-w-0">
+      <ol className="flex items-center gap-2">
         {items.map((item, index) => (
-          <li key={item.href} className="flex items-center gap-2">
+          <li key={item.href} className="flex items-center gap-2 min-w-0">
             <Link
               href={item.href}
               className={cn(
-                "text-sm transition-colors hover:text-primary",
+                "text-sm transition-colors hover:text-primary truncate",
+                "max-w-[320px]",
                 item.current ? "font-medium" : "text-muted-foreground"
               )}
               aria-current={item.current ? "page" : undefined}