x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<div> <div class="lui-breadcrumb_list"> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> </div></div><div> <div class="lui-breadcrumb_list"> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> </div></div><div> <div class="lui-breadcrumb_list"> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> </div></div><div> <div class="lui-breadcrumb_list"> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> </div></div><div> <div class="lui-breadcrumb_list"> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> <a class="lui-breadcrumb_list__breadcrumb" data-turbo-action="advance" href="#">Link</a> </div></div>No Usage documentation to display.
1
2
3
4
5
6
7
8
9
<% (1..5).each do |i| %> <div> <%= render(LooposUi::BreadcrumbList.new) do |c| %> <% (1..i).each do %> <%= c.with_breadcrumb(href: "#") {"Link"} %> <% end %> <% end %> </div><% end %>No notes provided.
No params configured.
Breadcrumb List
Description
The 'Breadcrumb List' component shows the breadcrumbs on the current page. You can also enable automatic breadcrumbs on the LoopOsUI initializer.
Slots
Renders Many
Breadcrumb - Singular breadcrumb that will be apart of the breadcrumb list. This breadcrumb will take the following argument:
| Property | Description |
|---|---|
href |
Href of the breadcrumb |
To pass text through the breadcrumb, you need to declare it as content. You can check it on this usage:
<%= render(LooposUi::BreadcrumbList.new) do |c| %> <% (1..i).each do %> <%= c.with_breadcrumb(href: "#") {"Link"} %> <% end %><% end %>