UNPKG

@quadible/web-sdk

Version:

The web sdk for Quadible's behavioral authentication service.

2 lines (1 loc) 4.54 kB
export declare const spinnerHtml = "\n<style>\n.qdbl-circle {\n margin: 205px auto;\n width: 40px;\n height: 40px;\n position: relative;\n}\n.qdbl-circle .qdbl-child {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n}\n.qdbl-circle.white .qdbl-child:before {\n background-color: white !important;\n}\n.qdbl-circle .qdbl-child:before {\n content: '';\n display: block;\n margin: 0 auto;\n width: 15%;\n height: 15%;\n background-color: #333;\n border-radius: 100%;\n -webkit-animation: qdbl-circleBounceDelay 1.2s infinite ease-in-out both;\n animation: qdbl-circleBounceDelay 1.2s infinite ease-in-out both;\n}\n.qdbl-circle .qdbl-circle2 {\n -webkit-transform: rotate(30deg);\n -ms-transform: rotate(30deg);\n transform: rotate(30deg); }\n.qdbl-circle .qdbl-circle3 {\n -webkit-transform: rotate(60deg);\n -ms-transform: rotate(60deg);\n transform: rotate(60deg); }\n.qdbl-circle .qdbl-circle4 {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg); }\n.qdbl-circle .qdbl-circle5 {\n -webkit-transform: rotate(120deg);\n -ms-transform: rotate(120deg);\n transform: rotate(120deg); }\n.qdbl-circle .qdbl-circle6 {\n -webkit-transform: rotate(150deg);\n -ms-transform: rotate(150deg);\n transform: rotate(150deg); }\n.qdbl-circle .qdbl-circle7 {\n -webkit-transform: rotate(180deg);\n -ms-transform: rotate(180deg);\n transform: rotate(180deg); }\n.qdbl-circle .qdbl-circle8 {\n -webkit-transform: rotate(210deg);\n -ms-transform: rotate(210deg);\n transform: rotate(210deg); }\n.qdbl-circle .qdbl-circle9 {\n -webkit-transform: rotate(240deg);\n -ms-transform: rotate(240deg);\n transform: rotate(240deg); }\n.qdbl-circle .qdbl-circle10 {\n -webkit-transform: rotate(270deg);\n -ms-transform: rotate(270deg);\n transform: rotate(270deg); }\n.qdbl-circle .qdbl-circle11 {\n -webkit-transform: rotate(300deg);\n -ms-transform: rotate(300deg);\n transform: rotate(300deg); }\n.qdbl-circle .qdbl-circle12 {\n -webkit-transform: rotate(330deg);\n -ms-transform: rotate(330deg);\n transform: rotate(330deg); }\n.qdbl-circle .qdbl-circle2:before {\n -webkit-animation-delay: -1.1s;\n animation-delay: -1.1s; }\n.qdbl-circle .qdbl-circle3:before {\n -webkit-animation-delay: -1s;\n animation-delay: -1s; }\n.qdbl-circle .qdbl-circle4:before {\n -webkit-animation-delay: -0.9s;\n animation-delay: -0.9s; }\n.qdbl-circle .qdbl-circle5:before {\n -webkit-animation-delay: -0.8s;\n animation-delay: -0.8s; }\n.qdbl-circle .qdbl-circle6:before {\n -webkit-animation-delay: -0.7s;\n animation-delay: -0.7s; }\n.qdbl-circle .qdbl-circle7:before {\n -webkit-animation-delay: -0.6s;\n animation-delay: -0.6s; }\n.qdbl-circle .qdbl-circle8:before {\n -webkit-animation-delay: -0.5s;\n animation-delay: -0.5s; }\n.qdbl-circle .qdbl-circle9:before {\n -webkit-animation-delay: -0.4s;\n animation-delay: -0.4s; }\n.qdbl-circle .qdbl-circle10:before {\n -webkit-animation-delay: -0.3s;\n animation-delay: -0.3s; }\n.qdbl-circle .qdbl-circle11:before {\n -webkit-animation-delay: -0.2s;\n animation-delay: -0.2s; }\n.qdbl-circle .qdbl-circle12:before {\n -webkit-animation-delay: -0.1s;\n animation-delay: -0.1s; }\n\n@-webkit-keyframes qdbl-circleBounceDelay {\n 0%, 80%, 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n } 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n}\n\n@keyframes qdbl-circleBounceDelay {\n 0%, 80%, 100% {\n -webkit-transform: scale(0);\n transform: scale(0);\n } 40% {\n -webkit-transform: scale(1);\n transform: scale(1);\n }\n}\n</style>\n<div class=\"qdbl-circle\">\n <div class=\"qdbl-circle1 qdbl-child\"></div>\n <div class=\"qdbl-circle2 qdbl-child\"></div>\n <div class=\"qdbl-circle3 qdbl-child\"></div>\n <div class=\"qdbl-circle4 qdbl-child\"></div>\n <div class=\"qdbl-circle5 qdbl-child\"></div>\n <div class=\"qdbl-circle6 qdbl-child\"></div>\n <div class=\"qdbl-circle7 qdbl-child\"></div>\n <div class=\"qdbl-circle8 qdbl-child\"></div>\n <div class=\"qdbl-circle9 qdbl-child\"></div>\n <div class=\"qdbl-circle10 qdbl-child\"></div>\n <div class=\"qdbl-circle11 qdbl-child\"></div>\n <div class=\"qdbl-circle12 qdbl-child\"></div>\n</div>\n";