File size: 845 Bytes
65d68f5 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | .reactbits-spotlight-card {
--spotlight-x: 50%;
--spotlight-y: 50%;
--spotlight-visible: 0;
position: relative;
isolation: isolate;
overflow: hidden;
}
.reactbits-spotlight-card__glow {
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
border-radius: inherit;
background: radial-gradient(
300px circle at var(--spotlight-x) var(--spotlight-y),
var(--reactbits-spotlight-color),
transparent 62%
);
opacity: var(--spotlight-visible);
transition: opacity 240ms ease-out;
}
.reactbits-spotlight-card:focus-within > .reactbits-spotlight-card__glow {
opacity: 1;
}
.reactbits-spotlight-card > :not(.reactbits-spotlight-card__glow) {
position: relative;
z-index: 1;
}
@media (hover: none), (prefers-reduced-motion: reduce) {
.reactbits-spotlight-card__glow {
display: none;
}
}
|