Loading animation would show in an unready state due to animation-delay
on components. Updated to a negative delay to ensure elements were in
correct positions right away upon show.
animation-timing-function: cubic-bezier(.62, .28, .23, .99);
margin-inline-end: 4px;
background-color: var(--color-page);
- animation-delay: 0.3s;
+ animation-delay: -300ms;
}
> div:first-child {
left: -($loadingSize+$-xs);
background-color: var(--color-book);
- animation-delay: 0s;
+ animation-delay: -600ms;
}
> div:last-of-type {
left: $loadingSize+$-xs;
background-color: var(--color-chapter);
- animation-delay: 0.6s;
+ animation-delay: 0ms;
}
> span {
margin-inline-start: $-s;