21 lines
800 B
CSS
21 lines
800 B
CSS
/* Skeleton mapping. ui-viz has no Skeleton spec (inventory name only), so these are current HM values. The pulse is the shadcn
|
|
`animate-pulse` (no HM Motion rule exists); reduced-motion users get a still placeholder.
|
|
The default look lives in `@layer components` so a consumer's utility classes (`rounded-full`, `bg-*`) still override it:
|
|
Skeleton shape is meant to be set through `className`. */
|
|
:root, [data-hm-theme] {
|
|
--hm-skeleton-background: var(--hm-sem-palette-warm-neutral-light);
|
|
--hm-skeleton-radius: var(--hm-radius-control-md);
|
|
}
|
|
|
|
@layer components {
|
|
[data-slot="skeleton"] {
|
|
background: var(--hm-skeleton-background);
|
|
border-radius: var(--hm-skeleton-radius);
|
|
}
|
|
}
|
|
@media (prefers-reduced-motion: reduce) {
|
|
[data-slot="skeleton"] {
|
|
animation: none;
|
|
}
|
|
}
|