vexip-ui/css/spin.css

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

.vxp-spin-vars{--vxp-spin-z-index:var(--vxp-z-index-masker);--vxp-spin-mask-bg-color:var(--vxp-bg-color-base);--vxp-spin-mask-opacity:40%;--vxp-spin-icon-color:var(--vxp-color-primary-base);--vxp-spin-tip-color:var(--vxp-color-primary-base);--vxp-spin-tip-font-size:var(--vxp-font-size-secondary)}.vxp-spin{font-family:var(--vxp-font-family-base);font-size:var(--vxp-font-size-base);font-variant-numeric:tabular-nums;line-height:var(--vxp-line-height-base);color:var(--vxp-content-color-base);position:relative}.vxp-spin,.vxp-spin *,.vxp-spin ::after,.vxp-spin ::before{box-sizing:border-box}.vxp-spin--inherit{font-family:inherit;font-size:inherit;font-variant-numeric:inherit;line-height:inherit}.vxp-spin--inner,.vxp-spin__loading{position:absolute;inset:0;z-index:var(--vxp-spin-z-index);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.vxp-spin--inner>*,.vxp-spin__loading>*{pointer-events:auto}.vxp-spin__mask{position:absolute;inset:0;background-color:var(--vxp-spin-mask-bg-color);opacity:var(--vxp-spin-mask-opacity)}.vxp-spin__icon{position:relative;color:var(--vxp-spin-icon-color)}.vxp-spin__tip{position:relative;padding-top:3px;font-size:var(--vxp-spin-tip-font-size);color:var(--vxp-spin-tip-color);-webkit-user-select:none;-moz-user-select:none;user-select:none}