tooltip
A short hint on hover and keyboard focus. Don't put essential information only here.
Example
Rebuilds run every 15 minutes
Laravel
<x-admin::tooltip text="Rebuilds run every 15 minutes"><x-admin::button>Hover or focus me</x-admin::button></x-admin::tooltip>Props
| Prop | Required | Default | Options |
|---|---|---|---|
text | yes |
Other attributes, such as wire:model or data-*, pass through to the element.
Other stacks
React and Vue: import { Tooltip } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.
HTML, for any stack
<span class="adm-tooltip-wrap" data-adm-tooltip><button type="button" class="adm-btn adm-btn--secondary" >Hover or focus me</button><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-oL5LymI3">Rebuilds run every 15 minutes</span></span>