#212121
1.loader { 2 --size-loader: 50px; 3 --size-orbe: 10px; 4 width: var(--size-loader); 5 height: var(--size-loader); 6 position: relative; 7 transform: rotate(45deg); 8} 9 10.orbe { 11 position: absolute; 12 width: 100%; 13 height: 100%; 14 --delay: calc(var(--index) * 0.1s); 15 animation: orbit7456 ease-in-out 1.5s var(--delay) infinite; 16 opacity: calc(1 - calc(0.2 * var(--index))); 17} 18 19.orbe::after { 20 position: absolute; 21 content: ''; 22 top: 0; 23 left: 0; 24 width: var(--size-orbe); 25 height: var(--size-orbe); 26 background-color: #3ae374; 27 box-shadow: 0px 0px 20px 2px #3ae374; 28 border-radius: 50%; 29} 30 31@keyframes orbit7456 { 32 0% { 33 } 34 35 80% { 36 transform: rotate(360deg); 37 } 38 39 100% { 40 transform: rotate(360deg); 41 } 42}
1.8K views
1.8K views
Comments
MIT License