Kbd
Source: client/lib/theme/vueda-tailwind/display/index.js
Single keycap chip for shortcut hints; tooltip nesting adjusts contrast.
Vue component: Kbd
| Slot | Default classes | Description |
|---|---|---|
| root | 8 classes | Single keycap chip for shortcut hints; tooltip nesting adjusts contrast. |
root
Single keycap chip for shortcut hints; tooltip nesting adjusts contrast.
Default classes:
text
hairline hairline-border bg-muted text-muted-foreground
pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1
rounded-vueda-checkbox px-1 font-mono text-[length:var(--vueda-text-micro)] leading-[1.25] font-semibold select-none
[&_svg:not([class*='size-'])]:size-3
[[data-slot=tooltip-content]_&]:[--vueda-hairline-color:color-mix(in_oklab,var(--background)_20%,transparent)]
[[data-slot=tooltip-content]_&]:bg-background/20
[[data-slot=tooltip-content]_&]:text-background
dark:[[data-slot=tooltip-content]_&]:bg-background/10Source: client/lib/theme/vueda-tailwind/display/Kbd.theme.js:16