Files
flood/client/source/sass/components/_icons.scss
2016-06-17 21:27:54 -07:00

87 lines
1.0 KiB
SCSS

@keyframes loading-indicator-dots-pulse {
0% {
fill-opacity: 0.2;
}
100% {
fill-opacity: 0.8;
}
}
@keyframes spinner-spin {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
.icon {
&--eta {
.icon {
&__ring {
fill-opacity: 1;
}
}
}
&--information {
&__fill {
fill-opacity: 0.05;
}
&__ring {
fill-opacity: 0.6;
}
}
&--limits {
.limits {
&__bars {
&--top {
fill-opacity: 0.4;
}
&--bottom {
fill-opacity: 0.6;
}
}
}
}
&--loading-indicator {
.loading-indicator {
&--dots {
&__dot {
animation: loading-indicator-dots-pulse 0.6s linear alternate infinite;
fill: $white;
&--center {
animation-delay: 0.2s;
}
&--right {
animation-delay: 0.4s;
}
}
}
}
}
&--spinner {
animation: spinner-spin 1.25s linear infinite;
}
}