@digdir/designsystemet-css
Version:
CSS for Designsystemet
1 lines • 1.21 kB
CSS
.ds-spinner{--dsc-spinner-background:var(--ds-color-surface-tinted);--dsc-spinner-stroke:var(--ds-color-border-default);--dsc-spinner-animation-duration:2s;animation:ds-spinner-rotate-animation linear infinite var(--dsc-spinner-animation-duration);box-sizing:border-box;font-size:var(--ds-size-11);height:1em;width:1em}.ds-spinner[data-size="2xs"]{font-size:.75rem}.ds-spinner[data-size=xs]{font-size:1.25rem}.ds-spinner[data-size=sm]{font-size:2rem}.ds-spinner[data-size=md]{font-size:2.75rem}.ds-spinner[data-size=lg]{font-size:3.75rem}.ds-spinner[data-size=xl]{font-size:5.5rem}.ds-spinner__background{stroke:var(--dsc-spinner-background)}.ds-spinner__circle{animation:ds-spinner-stroke-animation ease-in-out infinite var(--dsc-spinner-animation-duration);stroke-dasharray:1px,200px;stroke:var(--dsc-spinner-stroke);transform-origin:center}@media (prefers-reduced-motion:reduce){.ds-spinner{animation-duration:6s}}@keyframes ds-spinner-rotate-animation{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes ds-spinner-stroke-animation{0%{stroke-dasharray:1px,200px;stroke-dashoffset:0}50%{stroke-dasharray:100px,200px;stroke-dashoffset:-15px}to{stroke-dasharray:1px,200px;stroke-dashoffset:-120px}}