Loader by doniaskima
#e8e8e8
1/* HTML: <div class="loader"></div> */ 2.loader { 3 display: inline-flex; 4 border: 2px solid #000; 5 --c: no-repeat linear-gradient(#000 0 0) 50%; 6 background: var(--c) calc(50% - 5px)/5px 5px, 7 var(--c) calc(50% + 5px)/5px 5px; 8} 9 10.loader::before, 11.loader::after { 12 content: "12 00 23 40 31 45 60 17 45 32 29 42 50 08 14 07 46 11 03 55"; 13 font-size: 30px; 14 font-family: monospace; 15 font-weight: bold; 16 line-height: 1em; 17 height: 1em; 18 width: 2ch; 19 color: #0000; 20 text-shadow: 0 0 0 #000; 21 overflow: hidden; 22 margin: 5px 10px; 23 animation: l3 1s steps(20) infinite; 24} 25 26.loader::before { 27 animation-duration: 1.5s; 28} 29 30@keyframes l3 { 31 100% { 32 text-shadow: 0 -20em 0 #000 33 } 34}
582 views
582 views
MIT License