Sha256: 3967bc082ff6f249055c9c255e28100c8a8ba710b50f0b82d160fceac2facd3b
Contents?: true
Size: 1.53 KB
Versions: 24
Compression:
Stored size: 1.53 KB
Contents
// Table of Contents
// ==================================================
// Keyframes
// Spinner
// Backdrop
// Keyframes
// ==================================================
@-webkit-keyframes spinner-wiggle {
0% { @include transform(rotate(0deg) scale(1)); }
50% { @include transform(rotate(180deg) scale(0.5)); }
100% { @include transform(rotate(360deg) scale(1)); }
}
@keyframes spinner-wiggle {
0% { @include transform(rotate(0deg) scale(1)); }
50% { @include transform(rotate(180deg) scale(0.5)); }
100% { @include transform(rotate(360deg) scale(1)); }
}
// Spinner
// ==================================================
.spinner {
height: 50px;
position: relative;
width: 50px;
&::before,
&::after {
@include animation(spinner-wiggle 1.4s ease infinite);
border: solid 8px color(transparent);
border-radius: 50%;
content: '';
height: 50px;
position: absolute;
width: 50px;
}
&::before {
border-bottom-color: color(secondary);
border-top-color: color(primary);
}
&::after {
@include animation-delay(0.7s);
border-left-color: color(tertiary);
border-right-color: color(quaditiary);
}
}
// Backdrop
// ==================================================
.spinner-backdrop {
background: color-transparentize(slate, 0.15);
bottom: 0;
height: 100%;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: 2040;
&.white { background: color-transparentize(white, 0.15); }
> .spinner {
left: calc(50% - 25px);
position: fixed;
top: calc(50% - 25px);
}
}
Version data entries
24 entries across 24 versions & 1 rubygems