UNPKG

ranui

Version:

A framework-agnostic Web Components UI library built on native custom elements, with TypeScript types, light/dark theming, SSR and PWA support.

2 lines (1 loc) 3.39 kB
const r=require("./builder-Cb6jFd2B.cjs");var a=".ran-loading .circle-rotate{margin:var(--loading-circle-rotate-margin, 30px auto 0)}@keyframes spin-right{0%{transform:var(--loading-circle-rotate-keyframes-spin-right-from-transform, rotate(0deg));opacity:var(--loading-circle-rotate-keyframes-spin-right-from-opacity, var(--loading-circle-rotate-margin, .2))}50%{transform:var(--loading-circle-rotate-keyframes-spin-right-50-opacity, rotate(180deg));opacity:var(--loading-circle-rotate-keyframes-spin-right-50-opacity, 1)}to{transform:var(--loading-circle-rotate-keyframes-spin-right-to-opacity, rotate(360deg));opacity:var(--loading-circle-rotate-keyframes-spin-right-to-opacity, .2)}}@keyframes spin-left{0%{transform:var(--loading-circle-rotate-keyframes-spin-left-from-transform, rotate(0deg));opacity:var(--loading-circle-rotate-keyframes-spin-left-from-opacity, .2)}50%{transform:var(--loading-circle-rotate-keyframes-spin-left-50-transform, rotate(-180deg));opacity:var(--loading-circle-rotate-keyframes-spin-left-50-opacity, 1)}to{transform:var(--loading-circle-rotate-keyframes-spin-left-to-transform, rotate(-360deg));opacity:var(--loading-circle-rotate-keyframes-spin-left-to-opacity, .2)}}.ran-loading .circle-rotate-outer{border:var(--loading-circle-rotate-outer-border, 5px solid rgba(0, 183, 229, .9));opacity:var(--loading-circle-rotate-outer-opacity, .9);width:var(--loading-circle-rotate-outer-width, 50px);height:var(--loading-circle-rotate-outer-height, 50px);border-top-color:var(--loading-circle-rotate-outer-border-top-color, transparent);border-bottom-color:var(--loading-circle-rotate-outer-border-bottom-color, transparent);border-radius:var(--loading-circle-rotate-outer-border-radius, 50%);box-shadow:var(--loading-circle-rotate-outer-box-shadow, 0 0 35px rgba(0, 61, 76, .9));animation:var(--loading-circle-rotate-outer-animation, spin-right .5s linear infinite normal);animation-play-state:var(--loading-circle-rotate-outer-animation-play-state, running);animation-delay:var(--loading-circle-rotate-outer-animation-delay, 0);margin:var(--loading-circle-rotate-outer-margin, 0 auto)}.ran-loading .circle-rotate-inner{display:var(--loading-circle-rotate-inner-display, block);width:var(--loading-circle-rotate-inner-width, 30px);height:var(--loading-circle-rotate-inner-height, 30px);border:var(--loading-circle-rotate-inner-border, 5px solid rgba(0, 183, 229, .9));opacity:var(--loading-circle-rotate-inner-opacity, .9);border-radius:var(--loading-circle-rotate-inner-border-radius, 50%);border-left-color:var(--loading-circle-rotate-inner-border-left-color, transparent);border-bottom-color:var(--loading-circle-rotate-inner-border-bottom-color, transparent);box-shadow:var(--loading-circle-rotate-inner-box-shadow, 0 0 35px rgba(0, 61, 76, .9));position:var(--loading-circle-rotate-inner-position, relative);top:var(--loading-circle-rotate-inner-top, -50px);margin:var(--loading-circle-rotate-inner-margin, 0 auto);animation:var(--loading-circle-rotate-inner-animation, spin-left .5s linear infinite normal);animation-play-state:var(--loading-circle-rotate-inner-animation-play-state, running);animation-delay:var(--loading-circle-rotate-inner-animation-delay, 0)}",t=()=>r.Div().class("circle-rotate").part("circle-rotate").children(r.Div().class("circle-rotate-outer"),r.Div().class("circle-rotate-inner")).build(),e={css:a,render:t};exports.default=e;