Card by ahmedgamal-hub
This card was created for One <div> challenge
#212121
1@-webkit-keyframes spinner-border { 2 to { 3 -webkit-transform: rotate(360deg); 4 transform: rotate(360deg); 5 } 6} 7 8@keyframes spinner-border { 9 to { 10 -webkit-transform: rotate(360deg); 11 transform: rotate(360deg); 12 } 13} 14 15.one-div { 16 position: relative; 17 font-size: 20px; 18 color: #fff; 19 text-align: center; 20 display: inline-block; 21 width: 15rem; 22 height: 15rem; 23 vertical-align: text-center; 24} 25 26.one-div::after { 27 content: ''; 28 position: absolute; 29 left: 0; 30 top: -10px; 31 width: 100%; 32 height: 100%; 33 border: 0.25em solid currentColor; 34 border-right-color: #2AE4FF; 35 border-top-color: #2AE4FF; 36 border-bottom-color: #2AE4FF; 37 border-radius: 50%; 38 box-shadow: 0 0 3px #fff, 0 0 10px #fff, 0 0 20px #fff, 0 0 40px #0ba9ca, 39 0 0 110px #ED306F, 0 0 80px #0ba9ca; 40 -webkit-animation: spinner-border 7s linear infinite; 41 animation: spinner-border 7s linear infinite; 42} 43 44
630 views
630 views
MIT License