#e8e8e8
1.loader { 2 display: flex; 3 flex-direction: column; 4 align-items: center; 5 justify-content: center; 6} 7 8.heading { 9 color: black; 10 letter-spacing: 0.2em; 11 margin-bottom: 1em; 12} 13 14.loading { 15 display: flex; 16 width: 5em; 17 align-items: center; 18 justify-content: center; 19} 20 21.load { 22 width: 23px; 23 height: 3px; 24 background-color: limegreen; 25 animation: 1s move_5011 infinite; 26 border-radius: 5px; 27 margin: 0.1em; 28} 29 30.load:nth-child(1) { 31 animation-delay: 0.2s; 32} 33 34.load:nth-child(2) { 35 animation-delay: 0.4s; 36} 37 38.load:nth-child(3) { 39 animation-delay: 0.6s; 40} 41 42@keyframes move_5011 { 43 0% { 44 width: 0.2em; 45 } 46 47 25% { 48 width: 0.7em; 49 } 50 51 50% { 52 width: 1.5em; 53 } 54 55 100% { 56 width: 0.2em; 57 } 58}
1K views
1K views
Comments
MIT License