This repository has no description
Something went wrong. Try again.
950 B · 38 lines
CSS
at main
123456789101112131415161718192021222324252627282930313233343536373839.icon-grid { @apply grid grid-cols-4 gap-1 auto-rows-[1fr];
.icon { @apply relative rounded-lg border-fg/30 border-2 cursor-pointer aspect-square flex items-center justify-center;
img, svg { aspect-ratio: 1; background-position: center; width: 75% !important; height: auto !important; --bg-transition: inherit;
filter: opacity(calc(1 - 0.7 * var(--bg-transition))) blur( calc(4px * var(--bg-transition)) ); transition: 0.1s filter; }
.name { @apply absolute top-0 left-0 w-full h-full z-10 p-2 flex items-center justify-center text-center text-fg text-xs break-words; --bg-transition: inherit;
color: color-mix( in oklab, currentcolor calc(var(--bg-transition) * 100%), transparent ); transition: 0.1s color; }
&:has(input[name="icon-select"]:checked) { --bg-transition: 1; } }}