Loader by vinodjangid07
#e8e8e8
1.loader { 2 width: fit-content; 3 height: fit-content; 4 display: flex; 5 align-items: center; 6 justify-content: center; 7 --book-color: #f1775b; 8 --book-cover-color: #506c86; 9} 10.book { 11 width: 150px; 12 height: 13px; 13 background-color: var(--book-color); 14 border-bottom: 2px solid var(--book-cover-color); 15 display: flex; 16 align-items: flex-start; 17 justify-content: flex-end; 18 position: relative; 19} 20.page { 21 width: 50%; 22 height: 2px; 23 background-color: var(--book-color); 24 animation: paging 0.7s ease-out infinite; 25 transform-origin: left; 26} 27.page2 { 28 width: 50%; 29 height: 2px; 30 background-color: var(--book-color); 31 animation: paging 0.8s ease-out infinite; 32 transform-origin: left; 33 position: absolute; 34} 35@keyframes paging { 36 10% { 37 transform: rotateZ(0deg); 38 } 39 100% { 40 transform: rotateZ(-180deg); 41 } 42} 43
284 views
284 views
MIT License