Fortodo Work
Staffing
.container-loader {
font-size: 1em;
line-height: 1.6;
align-items: center;
display: flex;
justify-content: center;
height: 100%;
flex-direction: column;
}
.loader {
width: 60px;
height: 60px;
font-size: 10px;
}
.loader > div {
height: 100%;
width: 8px;
display: inline-block;
float: left;
margin-left: 2px;
-webkit-animation: delay 0.8s infinite ease-in-out;
animation: delay 0.8s infinite ease-in-out;
}
.loader .bar1 {
background-color: '{{color1}}';
}
.loader .bar2 {
background-color: '{{color2}}';
-webkit-animation-delay: -0.7s;
animation-delay: -0.7s;
}
.loader .bar3 {
background-color: '{{color3}}';
-webkit-animation-delay: -0.6s;
animation-delay: -0.6s;
}
.loader .bar4 {
background-color: '{{color4}}';
-webkit-animation-delay: -0.5s;
animation-delay: -0.5s;
}
.loader .bar5 {
background-color: '{{color5}}';
-webkit-animation-delay: -0.4s;
animation-delay: -0.4s;
}
.loader .bar6 {
background-color: '{{color6}}';
-webkit-animation-delay: -0.3s;
animation-delay: -0.3s;
}
@-webkit-keyframes delay {
0%, 40%, 100% {
-webkit-transform: scaleY(0.05);
}
20% {
-webkit-transform: scaleY(1);
}
}
@keyframes delay {
0%, 40%, 100% {
transform: scaleY(0.05);
-webkit-transform: scaleY(0.05);
}
20% {
transform: scaleY(1);
-webkit-transform: scaleY(1);
}
}
loading