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.

10 lines (9 loc) 1.58 kB
import { i as a } from "./factory-WDxu11V0.js"; import "./builder-EH76YCFS.js"; 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().class("stretch").part("stretch").children(...Array(5).fill(1).map((i, t) => a().class(`rect${t + 1}`))).build(), o = { css: r, render: e }; export { o as default };