docs/layouts/partials/tooltip.html

16 lines
617 B
HTML

{{- /*
Renders a tooltip component using Floating UI for positioning.
See script at `assets/js/src/tooltip.js` for functionality.
*/ -}}
<div data-tooltip-wrapper>
<div data-tooltip-button class="icon-svg flex items-center text-blue-light dark:text-blue-dark">
{{ partialCached "icon" "help" "help" }}
</div>
<div data-tooltip-body
class="absolute left-0 top-0 hidden max-w-56 rounded bg-gray-light-700 p-2 text-white dark:bg-gray-dark-300"
role="tooltip">
{{ . }}
<div data-tooltip-arrow class="absolute h-2 w-2 rotate-45 bg-gray-light-700 dark:bg-gray-dark-300"></div>
</div>
</div>