mirror of
https://github.com/turboderp-org/exui.git
synced 2026-03-15 00:07:27 +00:00
53 lines
943 B
CSS
53 lines
943 B
CSS
|
|
.spinner {
|
|
display: inline-block;
|
|
position: relative;
|
|
width: 62px;
|
|
height: 24px;
|
|
}
|
|
|
|
.spinner div {
|
|
position: absolute;
|
|
top: 6px;
|
|
width: 13px;
|
|
height: 13px;
|
|
border-radius: 50%;
|
|
background: var(--textcolor-head);
|
|
animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
|
}
|
|
|
|
.spinner div:nth-child(1) {
|
|
left: 4px;
|
|
animation: spinner1 0.6s infinite;
|
|
}
|
|
|
|
.spinner div:nth-child(2) {
|
|
left: 4px;
|
|
animation: spinner2 0.6s infinite;
|
|
}
|
|
|
|
.spinner div:nth-child(3) {
|
|
left: 24px;
|
|
animation: spinner2 0.6s infinite;
|
|
}
|
|
|
|
.spinner div:nth-child(4) {
|
|
left: 44px;
|
|
animation: spinner3 0.6s infinite;
|
|
}
|
|
|
|
@keyframes spinner1 {
|
|
0% { transform: scale(0); }
|
|
100% { transform: scale(1); }
|
|
}
|
|
|
|
@keyframes spinner3 {
|
|
0% { transform: scale(1); }
|
|
100% { transform: scale(0); }
|
|
}
|
|
|
|
@keyframes spinner2 {
|
|
0% { transform: translate(0, 0); }
|
|
100% { transform: translate(20px, 0); }
|
|
}
|