x
1
2
3
4
<button name="button" type="button" class="btn" data-controller="interest" data-interest-for-value="save_tooltip">Save</button><div id="save_tooltip" popover="hint" class="popover bg-black text-reversed text-xs pb-1 pi-2" role="tooltip"> Save Changes <kbd class="kbd kbd--tooltip">S</kbd></div>1
2
3
4
5
<%= button_tag "Save", type: "button", class: "btn", data: { controller: "interest", interest_for_value: "save_tooltip" } %><div id="save_tooltip" popover="hint" class="popover bg-black text-reversed text-xs pb-1 pi-2" role="tooltip"> Save Changes <kbd class="kbd kbd--tooltip">S</kbd></div>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
.kbd { align-items: center; background-color: var(--kbd-background, var(--color-secondary)); border-radius: var(--kbd-radius, var(--rounded-md)); color: var(--kbd-color, var(--color-text-subtle)); display: inline-flex; font-family: inherit; font-size: var(--kbd-font-size, var(--text-xs)); font-weight: var(--font-medium); column-gap: var(--size-1); justify-content: center; padding-inline: var(--kbd-padding, var(--size-1)); pointer-events: none; user-select: none;}.kbd--tooltip { --kbd-background: rgb(from var(--color-text-reversed) r g b / .2); --kbd-color: var(--color-text-reversed);}
Java Script is not required or multiple files are needed, check the notes.
No notes provided.