x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div class="flex justify-center w-full"> <div data-controller="dropdown" class="elevate-dropdown--global-container"> <span data-action="click->dropdown#toggleMenu" class="elevate-dropdown--trigger"> <span class="elevate-icon elevate-icon--scheme--primary elevate-icon--size--xl"> <svg xmlns="http://www.w3.org/2000/svg" class="fill-current" viewbox="0 0 24 24" stroke-width="1.5" stroke="currentColor" focusable="false" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M6.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM12.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM18.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0z"></path> </svg> </span> </span> <div role="menu" aria-orientation="vertical" aria-labelledby="menu-button" tabindex="-1" data-dropdown-target="menu" data-transition-enter="transition ease-out duration-100" data-transition-enter-from="transform opacity-0 scale-90" data-transition-enter-to="transform opacity-100 scale-100" data-transition-leave="transition ease-in duration-75" data-transition-leave-from="transform opacity-100 scale-100" data-transition-leave-to="transform opacity-0 scale-90" class="elevate-dropdown--menu-container hidden"> <div class="elevate-dropdown--actions-container" role="none"> <a href="#" class="elevate-link--scheme--primary block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">View</a> <a href="#" class="elevate-link--scheme--primary block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Edit</a> <a href="#" class="elevate-link--scheme--primary block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Share</a> <a href="#" class="elevate-link--scheme--primary block px-4 py-2 text-sm text-red-700 hover:bg-gray-100">Delete</a> </div> </div> </div></div>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<div class="flex justify-center w-full"> <%= render(Elevate::DropdownComponent.new) do |component| %> <% component.with_trigger do %> <%= elevate_icon(name: 'EllipsisHorizontal', scheme: :primary, size: :xl) %> <% end %> <% component.with_action do %> <%= elevate_link(url: "#", classes: "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100") { "View" } %> <% end %> <% component.with_action do %> <%= elevate_link(url: "#", classes: "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100") { "Edit" } %> <% end %> <% component.with_action do %> <%= elevate_link(url: "#", classes: "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100") { "Share" } %> <% end %> <% component.with_action do %> <%= elevate_link(url: "#", classes: "block px-4 py-2 text-sm text-red-700 hover:bg-gray-100") { "Delete" } %> <% end %> <% end %></div>No notes provided.
No params configured.