x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<nav aria-label="Default with nav element" data-view-component="true" class="UnderlineNav"> <ul data-view-component="true" class="UnderlineNav-body list-style-none"> <li data-view-component="true" class="d-inline-flex"> <a href="#" aria-current="page" data-view-component="true" class="UnderlineNav-item"> Item 1 </a></li> <li data-view-component="true" class="d-inline-flex"> <a href="#" data-view-component="true" class="UnderlineNav-item"> Item 2 </a></li> <li data-view-component="true" class="d-inline-flex"> <a href="#" data-view-component="true" class="UnderlineNav-item"> Item 3 </a></li> </ul> <div data-view-component="true" class="UnderlineNav-actions"> <button type="button" data-view-component="true" class="Button--secondary Button--medium Button"> <span class="Button-content"> <span class="Button-label">Button</span> </span> </button> </div></nav>No notes provided.
1
2
3
4
5
6
7
8
<%= render(Primer::Alpha::UnderlineNav.new(label: label, tag: tag, align: align)) do |component| %> <% Array.new(number_of_panels || 3) do |i| %> <% component.with_tab(href: "#", selected: i.zero?) { "Item #{i + 1}" } %> <% end %> <% component.with_actions do %> <%= render(Primer::Beta::Button.new) { "Button" } %> <% end %><% end %>