Flowbite::Breadcrumb
Renders a breadcrumb navigation component.
Use Flowbite::Breadcrumb and the child Flowbite::Breadcrumb::Item components to create and indicate a series of page structure and URLs to help the user navigate through the website.
Breadcrumbs consist of the following components:
- Flowbite::Breadcrumb: Container for breadcrumb items.
- Flowbite::Breadcrumb::HomeIcon: Home icon for the first breadcrumb item.
- Flowbite::Breadcrumb::SeparatorIcon: Separator between breadcrumb items.
- Flowbite::Breadcrumb::Item: An individual breadcrumb item.
- Flowbite::Breadcrumb::Item::Current: An individual breadcrumb item without a link, usually used for the current page in the breadcrumb trail.
- Flowbite::Breadcrumb::Item::First: An individual breadcrumb item with a home icon on it.
Usage
<%= render(Flowbite::Breadcrumb.new) do |breadcrumb| %>
<% breadcrumb.with_item do %>
<%= render(Flowbite::Breadcrumb::Item::First.new(href: "/")) { "Root page" } %>
<% end %>
<% breadcrumb.with_item do %>
<%= render(Flowbite::Breadcrumb::Item.new(href: "/projects")) { "Parent page" } %>
<% end %>
<% breadcrumb.with_item do %>
<%= render(Flowbite::Breadcrumb::Item::Current.new) { "Current Page" } %>
<% end %>
<% end %>
API reference
Flowbite
In namespace
Slots
items |
Flowbite::Breadcrumb::Item | The items of the breadcrumb trail. Use {Flowbite::Breadcrumb::Item::First} for the first item to get a home icon, and {Flowbite::Breadcrumb::Item::Current} for the last item to render it without a link. |
|---|
See also
Ruby API documentation forclass Flowbite::Breadcrumb