galaxy/loaders/Shoh2008_lucky-quail-40.html

46 lines
764 B
HTML

<span class="loader"></span>
<style>
/* From Uiverse.io by Shoh2008 - Tags: loader */
.loader {
width: 48px;
height: 48px;
border: 2px solid #FFF;
border-radius: 50%;
display: inline-block;
position: relative;
box-sizing: border-box;
animation: rotation_35 1s linear infinite;
}
.loader::after,
.loader::before {
content: '';
box-sizing: border-box;
position: absolute;
left: 0;
top: 0;
background: greenyellow;
width: 6px;
height: 6px;
transform: translate(150%, 150%);
border-radius: 50%;
}
.loader::before {
left: auto;
top: auto;
right: 0;
bottom: 0;
transform: translate(-150%, -150%);
}
@keyframes rotation_35 {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
</style>