"use strict";

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

const styleh_components_1 = require("styleh-components");

const Vector_1 = require("../../../../atoms/Vector");

const CircleBackground = styleh_components_1.styled.circle`stroke:var(--color-dark-grey);stroke-width:3;`;
exports.CircleBackground = CircleBackground;
const CirclePath = styleh_components_1.styled.circle`stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;stroke-linecap:round;@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0;}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px;}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px;}}@keyframes color{100%,0%{stroke:#ccc;}40%{stroke:#ccc;}66%{stroke:#ccc;}80%,90%{stroke:#ccc;}}`;
exports.CirclePath = CirclePath;
const StyledVector = styleh_components_1.styled(Vector_1.Vector)``;
exports.StyledVector = StyledVector;
const CircleLoaderWrapper = styleh_components_1.styled.div`position:relative;width:100px;&:before{content:'';display:block;padding-top:100%;}${StyledVector}{animation:rotate 2s linear infinite;transform-origin:center center;height:100%;width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;@keyframes rotate{100%{transform:rotate(360deg);}}}`;
exports.CircleLoaderWrapper = CircleLoaderWrapper; //# sourceMappingURL=styled.js.map