Adding loader for later use

This commit is contained in:
Colin McLeod
2015-08-10 10:50:05 -07:00
parent be5a069b23
commit b533191bc9
3 changed files with 47 additions and 0 deletions

37
app/less/loader.less Normal file
View File

@@ -0,0 +1,37 @@
@keyframes hideshow {
0% { opacity: 0; }
10% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes inner {
0% { opacity: 0; }
10% { opacity: 1; }
100% { opacity: 0; }
}
@animationTime: 750ms;
@outerTriangles: 19;
@animationDelay: @animationTime / @outerTriangles;
.loader {
path {
stroke: #000;
stroke-width: 0;
opacity: 0;
}
}
.l1 { animation: hideshow @animationTime linear infinite; }
.l2 { animation: inner @animationTime linear infinite; }
.mixin-loop (@i) when (@i > 0) {
.d@{i} {
animation-delay: @i * @animationDelay;
}
.mixin-loop(@i - 1);
}
.mixin-loop(@outerTriangles);