ldrs
Version:
Tiny HTML and SVG loaders as web components
3 lines (2 loc) • 3.08 kB
JavaScript
import{jsx as a,jsxs as e}from"react/jsx-runtime";import{s as r}from"../style-inject.es-BnTDb6vU.js";var t="Superballs_container__Gv5mm",s="Superballs_inner__VAg6N",i="Superballs_electron__NFkhC";function l({size:r=40,color:l="black",speed:c=1.4}){return a("div",{className:t,style:{"--uib-size":r+"px","--uib-color":l,"--uib-speed":c+"s"},children:e("div",{className:s,children:[a("div",{className:i}),a("div",{className:i})]})})}r('.Superballs_container__Gv5mm{display:inline-flex;flex-shrink:0}.Superballs_container__Gv5mm,.Superballs_inner__VAg6N{align-items:center;height:var(--uib-size);justify-content:center;width:var(--uib-size)}.Superballs_inner__VAg6N{display:flex;position:relative}.Superballs_electron__NFkhC{align-items:center;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.Superballs_electron__NFkhC:before{background-color:var(--uib-color);border-radius:50%;content:"";flex-shrink:0;height:35%;transition:background-color .3s ease;width:35%}.Superballs_electron__NFkhC:first-child{transform:rotate(45deg)}.Superballs_electron__NFkhC:first-child:before{animation:Superballs_orbit__FHUgp var(--uib-speed) linear calc(var(--uib-speed)*-.143) infinite}.Superballs_electron__NFkhC:nth-child(2){transform:rotate(-45deg)}.Superballs_electron__NFkhC:nth-child(2):before{animation:Superballs_orbit__FHUgp var(--uib-speed) linear calc(var(--uib-speed)/-2) infinite}@keyframes Superballs_orbit__FHUgp{0%{opacity:.65;transform:translate(calc(var(--uib-size)*.5)) scale(.73684)}5%{opacity:.58;transform:translate(calc(var(--uib-size)*.4)) scale(.684208)}10%{opacity:.51;transform:translate(calc(var(--uib-size)*.3)) scale(.631576)}15%{opacity:.44;transform:translate(calc(var(--uib-size)*.2)) scale(.578944)}20%{opacity:.37;transform:translate(calc(var(--uib-size)*.1)) scale(.526312)}25%{opacity:.3;transform:translate(0) scale(.47368)}30%{opacity:.37;transform:translate(calc(var(--uib-size)*-.1)) scale(.526312)}35%{opacity:.44;transform:translate(calc(var(--uib-size)*-.2)) scale(.578944)}40%{opacity:.51;transform:translate(calc(var(--uib-size)*-.3)) scale(.631576)}45%{opacity:.58;transform:translate(calc(var(--uib-size)*-.4)) scale(.684208)}50%{opacity:.65;transform:translate(calc(var(--uib-size)*-.5)) scale(.73684)}55%{opacity:.72;transform:translate(calc(var(--uib-size)*-.4)) scale(.789472)}60%{opacity:.79;transform:translate(calc(var(--uib-size)*-.3)) scale(.842104)}65%{opacity:.86;transform:translate(calc(var(--uib-size)*-.2)) scale(.894736)}70%{opacity:.93;transform:translate(calc(var(--uib-size)*-.1)) scale(.947368)}75%{opacity:1;transform:translate(0) scale(1)}80%{opacity:.93;transform:translate(calc(var(--uib-size)*.1)) scale(.947368)}85%{opacity:.86;transform:translate(calc(var(--uib-size)*.2)) scale(.894736)}90%{opacity:.79;transform:translate(calc(var(--uib-size)*.3)) scale(.842104)}95%{opacity:.72;transform:translate(calc(var(--uib-size)*.4)) scale(.789472)}to{opacity:.65;transform:translate(calc(var(--uib-size)*.5)) scale(.73684)}}');export{l as default};
//# sourceMappingURL=Superballs.js.map