3d11cfb50a
Feature/sas mypages * feat: Add SAS partner page under my pages * fix: feature toggle SAS Partner page in my pages * add translations for SAS account page * use 'flex-start' instead of 'start' * fix: flatten css * fix: don't use <SectionContainer /> on linkedAccounts page
44 lines
896 B
CSS
44 lines
896 B
CSS
.loading {
|
|
--animationDuration: 0.8s;
|
|
--delayPerItem: calc(var(--animationDuration) / 8);
|
|
|
|
& circle {
|
|
animation: fadeInOut var(--animationDuration) infinite linear both;
|
|
transform-origin: center;
|
|
|
|
&:nth-child(2) {
|
|
animation-delay: calc(var(--delayPerItem) * -7);
|
|
}
|
|
&:nth-child(3) {
|
|
animation-delay: calc(var(--delayPerItem) * -6);
|
|
}
|
|
&:nth-child(4) {
|
|
animation-delay: calc(var(--delayPerItem) * -5);
|
|
}
|
|
&:nth-child(5) {
|
|
animation-delay: calc(var(--delayPerItem) * -4);
|
|
}
|
|
&:nth-child(6) {
|
|
animation-delay: calc(var(--delayPerItem) * -3);
|
|
}
|
|
&:nth-child(7) {
|
|
animation-delay: calc(var(--delayPerItem) * -2);
|
|
}
|
|
&:nth-child(8) {
|
|
animation-delay: calc(var(--delayPerItem) * -1);
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInOut {
|
|
0%,
|
|
20%,
|
|
80%,
|
|
100% {
|
|
opacity: 0.3;
|
|
}
|
|
50% {
|
|
opacity: 1;
|
|
}
|
|
}
|