Files
web/packages/design-system/lib/components/LoadingSpinner/loading.module.css
Rasmus Langvad d0546926a9 Merged in fix/3697-prettier-configs (pull request #3396)
fix(SW-3691): Setup one prettier config for whole repo

* Setup prettierrc in root and remove other configs


Approved-by: Joakim Jäderberg
Approved-by: Linus Flood
2026-01-07 12:45:50 +00:00

77 lines
1.3 KiB
CSS

.container {
display: flex;
justify-content: center;
align-items: center;
height: 100px;
}
.fullPage {
min-height: 100dvh;
}
.spinner {
display: inline-block;
position: relative;
width: 40px;
height: 40px;
}
.spinner div {
transform-origin: 20px 20px;
animation: spinnerAnimation 0.8s linear infinite;
}
.spinner div::after {
content: " ";
display: block;
position: absolute;
top: 3px;
left: 7px;
width: 6px;
height: 6px;
border-radius: 100%;
background: var(--Scandic-Brand-Burgundy);
}
.spinner div:nth-child(1) {
transform: rotate(0deg);
animation-delay: -0.7s;
}
.spinner div:nth-child(2) {
transform: rotate(45deg);
animation-delay: -0.6s;
}
.spinner div:nth-child(3) {
transform: rotate(90deg);
animation-delay: -0.5s;
}
.spinner div:nth-child(4) {
transform: rotate(135deg);
animation-delay: -0.4s;
}
.spinner div:nth-child(5) {
transform: rotate(180deg);
animation-delay: -0.3s;
}
.spinner div:nth-child(6) {
transform: rotate(225deg);
animation-delay: -0.2s;
}
.spinner div:nth-child(7) {
transform: rotate(270deg);
animation-delay: -0.1s;
}
.spinner div:nth-child(8) {
transform: rotate(315deg);
animation-delay: 0s;
}
@keyframes spinnerAnimation {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}