Anchor ViewComponents

Pages

No matching results.

x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<nav aria-label="Accessible label" data-testid="breadcrumbs">
  <ol class="flex items-center">
    <li class="flex text-sm items-center text-secondary whitespace-nowrap">
      <a class="underline hover:no-underline focus:no-underline text-secondary hover:text-primary" href="#">Breadcrumb 1</a>
    </li>
    <li class="flex text-sm items-center text-secondary whitespace-nowrap">
      <span aria-hidden="true" class="mx-2">/</span>
      <a class="underline hover:no-underline focus:no-underline text-secondary hover:text-primary" href="#">Breadcrumb 2</a>
    </li>
    <li aria-current="page" class="flex text-sm items-center text-secondary whitespace-nowrap">
      <span aria-hidden="true" class="mx-2">/</span>
      Breadcrumb 3
    </li>
  </ol>
</nav>
1
2
3
4
5
anchor_breadcrumbs(label:) do |c|
  c.with_item(href: "#").with_content("Breadcrumb 1")
  c.with_item(href: "#").with_content("Breadcrumb 2")
  c.with_item_content("Breadcrumb 3")
end

No notes provided.

Param Description Input

A brief description of the purpose of the navigation, omitting the term ‘navigation’, as the screen reader will read both the role and the contents of the label. Defaults to ‘Breadcrumb’.