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) 1.52 kB
const a=require("./builder-Cb6jFd2B.cjs");var r=".ran-loading .stretch{width:var(--loading-stretch-width, 4em);height:var(--loading-stretch-height, 5em);text-align:var(--loading-stretch-text-align, center);display:var(--loading-stretch-display, flex);flex-flow:var(--loading-stretch-flex-flow, row nowrap);justify-content:var(--loading-stretch-justify-content, space-between);align-items:var(--loading-stretch-align-items, center)}@keyframes ran-loading-stretch{0%,40%,to{transform:var(--loading-stretch-keyframes-0, scaleY(.4))}20%{transform:var(--loading-stretch-keyframes-20, scaleY(1))}}.ran-loading .stretch div{background-color:var(--loading-stretch-div-background-color, var(--ran-color-primary, #4096ff));height:var(--loading-stretch-div-height, 100%);width:var(--loading-stretch-div-width, .4em);animation:var(--loading-stretch-div-animation, ran-loading-stretch 1.2s infinite ease-in-out);animation-play-state:var(--loading-stretch-div-animation-play-state, running)}.ran-loading .stretch .rect5{animation-delay:var(--loading-stretch-rect-animation-delay, -.8s)}.ran-loading .stretch .rect4{animation-delay:var(--loading-stretch-rect-animation-delay, -.9s)}.ran-loading .stretch .rect3{animation-delay:var(--loading-stretch-rect-animation-delay, -1s)}.ran-loading .stretch .rect2{animation-delay:var(--loading-stretch-rect-animation-delay, -1.1s)}",e=()=>a.Div().class("stretch").part("stretch").children(...Array(5).fill(1).map((n,t)=>a.Div().class(`rect${t+1}`))).build(),i={css:r,render:e};exports.default=i;