27 lines
734 B
CSS
27 lines
734 B
CSS
|
@layer components {
|
||
|
|
.spinner {
|
||
|
|
@apply inline-block h-6 w-6 shrink-0 rounded-full;
|
||
|
|
/* currentColor track (not --shadow-color, which the flat theme doesn't
|
||
|
|
define — an undefined var there voids the whole border shorthand) */
|
||
|
|
border: 3px solid color-mix(in srgb, currentColor 20%, transparent);
|
||
|
|
border-top-color: var(--primary);
|
||
|
|
animation: spinner-spin 0.7s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* sizes are standalone (share the element with .spinner, not nested under it)
|
||
|
|
— some call sites use spinner-xs on its own, e.g. ThunkPending */
|
||
|
|
.spinner-sm {
|
||
|
|
@apply h-4 w-4 border-1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.spinner-xs {
|
||
|
|
@apply h-3 w-3 border-1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes spinner-spin {
|
||
|
|
to {
|
||
|
|
transform: rotate(360deg);
|
||
|
|
}
|
||
|
|
}
|