Loader by csozidev
#212121
1/* 2 I DID NOT MAKE THIS! THIS IS JUST A REPOST FROM: 3 codepen.io/AlexWarnes/pen/jXYYKL 4 My website: english.csozi.hu*/ 5 6.configure-border-1 { 7 width: 50px; 8 height: 50px; 9 padding: 3px; 10 position: absolute; 11 display: flex; 12 justify-content: center; 13 align-items: center; 14 background: #fb5b53; 15 animation: configure-clockwise 3s ease-in-out 0s infinite alternate; 16} 17 18.configure-border-2 { 19 width: 50px; 20 height: 50px; 21 padding: 3px; 22 left: -50px; 23 display: flex; 24 justify-content: center; 25 align-items: center; 26 background: rgb(63,249,220); 27 transform: rotate(45deg); 28 animation: configure-xclockwise 3s ease-in-out 0s infinite alternate; 29} 30 31.configure-core { 32 width: 100%; 33 height: 100%; 34 background-color: #1d2630; 35} 36 37@keyframes configure-clockwise { 38 0% { 39 transform: rotate(0); 40 } 41 42 25% { 43 transform: rotate(90deg); 44 } 45 46 50% { 47 transform: rotate(180deg); 48 } 49 50 75% { 51 transform: rotate(270deg); 52 } 53 54 100% { 55 transform: rotate(360deg); 56 } 57} 58 59@keyframes configure-xclockwise { 60 0% { 61 transform: rotate(45deg); 62 } 63 64 25% { 65 transform: rotate(-45deg); 66 } 67 68 50% { 69 transform: rotate(-135deg); 70 } 71 72 75% { 73 transform: rotate(-225deg); 74 } 75 76 100% { 77 transform: rotate(-315deg); 78 } 79}
750 views
750 views
MIT License