"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const styleh_components_1 = require("styleh-components");
/**
 * @todo - should be using fill: white; fill: transparent; when we have as svg
 */


const WaveLoaderStyles = styleh_components_1.styled.todo`.wave-loader-wrapper{position:absolute;left:15px;top:50px;}.wave-loader-panel{position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;height:40px;width:80px;&:after{content:'Loading...';font-size:16px;font-family:'Arial';color:var(--color-black);text-align:center;position:absolute;left:0;right:0;bottom:-32px;margin:auto;}.loader-item{position:relative;float:left;height:40px;width:4px;margin:0 2px;background-color:black;&:nth-child(1){animation:loader-item-1 2s linear infinite;}&:nth-child(2){animation:loader-item-2 2s linear infinite;}&:nth-child(3){animation:loader-item-3 2s linear infinite;}&:nth-child(4){animation:loader-item-4 2s linear infinite;}&:nth-child(5){animation:loader-item-5 2s linear infinite;}&:nth-child(6){animation:loader-item-6 2s linear infinite;}&:nth-child(7){animation:loader-item-7 2s linear infinite;}&:nth-child(8){animation:loader-item-8 2s linear infinite;}&:nth-child(9){animation:loader-item-9 2s linear infinite;}&:nth-child(10){animation:loader-item-10 2s linear infinite;}}}@keyframes loader-item-1{1%{transform:scaleY(1);}11%{transform:scaleY(1.4);}21%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-2{7%{transform:scaleY(1);}17%{transform:scaleY(1.4);}27%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-3{13%{transform:scaleY(1);}23%{transform:scaleY(1.4);}33%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-4{19%{transform:scaleY(1);}29%{transform:scaleY(1.4);}39%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-5{25%{transform:scaleY(1);}35%{transform:scaleY(1.4);}45%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-6{31%{transform:scaleY(1);}41%{transform:scaleY(1.4);}51%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-7{37%{transform:scaleY(1);}47%{transform:scaleY(1.4);}57%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-8{43%{transform:scaleY(1);}53%{transform:scaleY(1.4);}63%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-9{49%{transform:scaleY(1);}59%{transform:scaleY(1.4);}69%{transform:scaleY(1);}100%{transform:scaleY(1);}}@keyframes loader-item-10{55%{transform:scaleY(1);}65%{transform:scaleY(1.4);}75%{transform:scaleY(1);}100%{transform:scaleY(1);}}`;
exports.WaveLoaderStyles = WaveLoaderStyles;
exports.default = WaveLoaderStyles; //# sourceMappingURL=styled.js.map