You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
1.4 KiB
48 lines
1.4 KiB
@keyframes ball-spin-loader {
|
|
75% {
|
|
opacity: 0.2; }
|
|
100% {
|
|
opacity: 1; } }
|
|
|
|
.ball-spin-loader {
|
|
position: relative; }
|
|
.ball-spin-loader > span:nth-child(1) {
|
|
top: 45px;
|
|
left: 0;
|
|
animation: ball-spin-loader 2s 0.9s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(2) {
|
|
top: 30.681818px;
|
|
left: 30.681818px;
|
|
animation: ball-spin-loader 2s 1.8s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(3) {
|
|
top: 0;
|
|
left: 45px;
|
|
animation: ball-spin-loader 2s 2.7s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(4) {
|
|
top: -30.681818px;
|
|
left: 30.681818px;
|
|
animation: ball-spin-loader 2s 3.6s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(5) {
|
|
top: -45px;
|
|
left: 0;
|
|
animation: ball-spin-loader 2s 4.5s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(6) {
|
|
top: -30.681818px;
|
|
left: -30.681818px;
|
|
animation: ball-spin-loader 2s 5.4s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(7) {
|
|
top: 0;
|
|
left: -45px;
|
|
animation: ball-spin-loader 2s 6.3s infinite linear; }
|
|
.ball-spin-loader > span:nth-child(8) {
|
|
top: 30.681818px;
|
|
left: -30.681818px;
|
|
animation: ball-spin-loader 2s 7.2s infinite linear; }
|
|
.ball-spin-loader > div {
|
|
animation-fill-mode: both;
|
|
position: absolute;
|
|
width: 15px;
|
|
height: 15px;
|
|
border-radius: 100%;
|
|
background: green; }
|