added breadcrumb to my task page

2024-02-28 16:54:54 +01:00
parent 0a3805ddf8
commit 05a7b3ec12
2 changed files with 43 additions and 7 deletions
@@ -0,0 +1,22 @@
+import React from 'react'
+import { Link } from 'react-router-dom'
+
+export default function CustomBreadcrumb({title, breadcrumb}) {
+  return (
+    <div className="">
+        <h3 className="text-26 font-bold text-dark-gray dark:text-white">{title}</h3>
+        <nav aria-label="breadcrumb" className='text-base text-dark-gray dark:text-white flex items-center'>
+            {breadcrumb.map((value, index) => (
+                <p key={index}>
+                    <Link className={`${value.active ? 'opacity-60' : ''}`} to={value.link}>{value.title}</Link>
+                    {index != breadcrumb.length - 1 ?
+                    <span className='px-1'>/</span>
+                    :
+                    null
+                    }
+                </p>
+            ))}
+        </nav>
+    </div>
+  )
+}