x
1
2
3
4
5
6
7
8
<span class="inline-block" data-controller="ui--tooltip"><span id="ui-tooltip-trigger-ui-tooltip-13813ba9" class="" aria-describedby="ui-tooltip-content-ui-tooltip-13813ba9" data-ui--tooltip-target="trigger" data-action="mouseenter->ui--tooltip#show mouseleave->ui--tooltip#hide focus->ui--tooltip#show blur->ui--tooltip#hide"> <span class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-muted hover:bg-muted/80 cursor-pointer"> <i data-lucide="info" class="inline-block shrink-0 w-4 h-4" aria-hidden="true"></i> </span> </span> <div id="ui-tooltip-content-ui-tooltip-13813ba9" class="z-50 rounded-md bg-foreground px-3 py-1.5 text-sm text-background shadow-lg animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2" role="tooltip" data-ui--tooltip-target="content" hidden="hidden" data-side="top" data-align="center"> More information about this feature <div class="absolute w-2 h-2 bg-foreground rotate-45" data-ui--tooltip-target="arrow"></div> </div></span>1
2
3
4
5
6
7
8
9
10
<%= render(UI::Tooltip.new) do |tooltip| %> <% tooltip.with_trigger do %> <span class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-muted hover:bg-muted/80 cursor-pointer"> <%= render(UI::Icon.new(name: :info, size: :sm)) %> </span> <% end %> <% tooltip.with_content do %> More information about this feature <% end %><% end %>No notes provided.
No params configured.