frutjam
Version:
A utility-first CSS UI Library for Tailwind CSS
2 lines (1 loc) • 1.31 kB
JavaScript
export default {".skeleton":{"--color-skeleton":"var(--color-base-soft)","--color-skeleton-shine":"var(--color-base-active)","--radius-skeleton":"calc(var(--border-radius) * 2)","border-radius":"var(--radius-skeleton)","background-color":"var(--color-skeleton)","background-image":"linear-gradient(\n 90deg,\n transparent 0%,\n var(--color-skeleton-shine) 50%,\n transparent 100%\n )","background-size":"200% 100%","animation":"skeleton-shimmer 1.5s ease-in-out infinite","color":"transparent","pointer-events":"none","-webkit-user-select":"none","-moz-user-select":"none","user-select":"none"},".skeleton-circle":{"border-radius":"9999px","aspect-ratio":"1 / 1"},".skeleton-text":{"background-image":"linear-gradient(\n 105deg,\n var(--color-on-base) 0% 40%,\n var(--color-on-base) 50%,\n var(--color-on-base) 60% 100%\n )","@supports (color: color-mix(in lab, red, red))":{"background-image":"linear-gradient(\n 105deg,\n color-mix(in oklch, var(--color-on-base) 20%, transparent) 0% 40%,\n var(--color-on-base) 50%,\n color-mix(in oklch, var(--color-on-base) 20%, transparent) 60% 100%\n )"},"-webkit-background-clip":"text","background-clip":"text"},"@keyframes skeleton-shimmer":{"0%":{"background-position":"200% 0"},"100%":{"background-position":"-200% 0"}}};