Shadcn migration - Breadcrumbs

[saurabhburade]

Description

Migrate Breadcrumbs to tailwind.

Related Issue

[netlify]

✅ Deploy Preview for ethereumorg ready!

Name	Link
🔨 Latest commit	f2b38a7
🔍 Latest deploy log	https://app.netlify.com/sites/ethereumorg/deploys/66f1634824d7f7000820a2d2
😎 Deploy Preview	https://deploy-preview-13854--ethereumorg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	7 paths audited Performance: 44 (🔴 down 2 from production) Accessibility: 93 (no change from production) Best Practices: 89 (🔴 down 9 from production) SEO: 92 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[pettinarip]

@saurabhburade thanks for this PR!

Visually it is correct but I think we are missing some semantic value from the previous version. We are missing the ordered list and items that gave the hierarchical order of the links.

For this reason, and because the shadcn component will also add a few more features, I think it is better to install the Breadcrumb component in our /components/ui folder using the cli or copying the files yourself. Once we have that we can use these components in our custom Breadcrumbs component to have the correct structure and recommended semantics.

<Breadcrumb>
  <BreadcrumbList>
    <BreadcrumbItem>
      <BreadcrumbLink href="/">Home</BreadcrumbLink>
    </BreadcrumbItem>
    <BreadcrumbSeparator />
    <BreadcrumbItem>
      <BreadcrumbLink href="/components">Components</BreadcrumbLink>
    </BreadcrumbItem>
    <BreadcrumbSeparator />
    <BreadcrumbItem>
      <BreadcrumbPage>Breadcrumb</BreadcrumbPage>
    </BreadcrumbItem>
  </BreadcrumbList>
</Breadcrumb>

Edit: aria pattern for breadcrumbs https://www.w3.org/WAI/ARIA/apg/patterns/breadcrumb/examples/breadcrumb/

[pettinarip]

@saurabhburade great! just pushed a commit to use the Next link component instead of the native one to get better i18n support for each link.

Approving, thanks for the PR!