ldrs
Version:
Minimalist loading animations for React and web components
44 lines (40 loc) • 805 B
CSS
.container_72d37b {
flex-shrink: 0;
display: inline-flex;
align-items: center;
justify-content: center;
height: var(--uib-size);
width: var(--uib-size);
}
.inner_ae9969 {
position: relative;
height: var(--uib-size);
width: var(--uib-size);
}
.inner_ae9969::before,
.inner_ae9969::after {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
border-radius: 50%;
background-color: var(--uib-color);
animation: pulse_3a5385 var(--uib-speed) ease-in-out infinite;
transform: scale(0);
transition: background-color 0.3s ease;
}
.inner_ae9969::after {
animation-delay: calc(var(--uib-speed) / -2);
}
@keyframes pulse_3a5385 {
0%, 100% {
transform: scale(0);
opacity: 1;
}
50% {
transform: scale(1);
opacity: 0.25;
}
}