@vuesax-alpha/nightly/theme-chalk/vs-icon.css

A Component Library for Vue 3

.vs-icon--right{margin-left:5px}.vs-icon--left{margin-right:5px}@keyframes rotating{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.vs-icon{--vs-color:inherit;height:1em;width:1em;line-height:1em;display:inline-flex;justify-content:center;align-items:center;position:relative;fill:currentColor;color:rgba(var(--vs-color));font-size:inherit}.vs-icon.is-loading{animation:rotating 2s linear infinite}.vs-icon svg{height:1em;width:1em}.vs-icon-arrow{pointer-events:none;width:7px;height:7px;transform:rotate(-135deg);transition:var(--vs-transition-ease);transform-origin:center}.vs-icon-arrow::after,.vs-icon-arrow::before{content:"";position:absolute;top:0;display:block;border-radius:2px;width:100%;height:1px;background:rgba(var(--vs-text),1)}.vs-icon-arrow:before{height:100%;width:1px}.vs-icon-arrow:after{width:100%;height:1px}.vs-icon-check{--vs-icheck-height:23px;--vs-icheck-line-radius:5px;display:flex;justify-content:center;align-items:center;height:var(--vs-icheck-height);width:var(--vs-icheck-height);transition:var(--vs-transition-ease);border-radius:inherit}.vs-icon-check .vs-icon-check__check{height:16px;width:16px}.vs-icon-check .vs-icon-check__check path{stroke:#fff;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:0,24.19;stroke-dashoffset:0;visibility:hidden;transition:stroke-dasharray .2s ease-in-out,visibility 20ms .18s}.vs-icon-check.is-active:before{width:8px}.vs-icon-check.is-active:after{width:4px}.vs-icon-check.is-active .vs-icon-check__check path{stroke-dasharray:24.19,24.19;visibility:visible;transition:stroke-dasharray .1s .18s ease-in-out,visibility 20ms .18s}.vs-icon-check.is-active.is-indeterminate .vs-icon-check__line{width:14px;visibility:visible}.vs-icon-check.is-indeterminate .vs-icon-check__line{width:10px;transition:all .2s ease-in-out;left:0;right:auto;width:2.5px;height:2.5px;background-color:#fff;border-radius:10px;visibility:hidden}.vs-icon-close{--vs-iclose-background:var(--vs-color);--vs-iclose-height:30px;width:var(--vs-iclose-height);height:var(--vs-iclose-height);display:flex;align-items:center;justify-content:center;position:relative;transition:var(--vs-transition-ease)}.vs-icon-close::after,.vs-icon-close::before{background:rgba(var(--vs-color),1);content:"";position:absolute;width:16px;height:2px;border-radius:2px;transition:var(--vs-transition-ease)}.vs-icon-close:before{transform:rotate(-45deg)}.vs-icon-close:after{transform:rotate(45deg)}.vs-icon-close-hover--less:hover:after,.vs-icon-close-hover--less:hover:before{width:12px;transform:rotate(180deg)}.vs-icon-loading{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100%;max-width:50px;max-height:50px;border-radius:var(--vs-border-radius-full);z-index:999999;color:rgba(var(--vs-color),1);transition:var(--vs-transition-ease)}.vs-icon-loading__item{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit}.vs-icon-loading__item .path{stroke:currentColor;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;fill:none}.vs-icon-loading__1{animation:rotating .88s ease infinite .11s}.vs-icon-loading__1 .path{stroke-dasharray:60 150}.vs-icon-loading__2{opacity:.6;animation:rotating .88s linear infinite}.vs-icon-loading__2 .path{stroke-dasharray:5 130}.vs-icon-plus{--vs-iplus-background:var(--vs-color);--vs-iplus-height:30px;display:flex;justify-content:center;align-items:center;width:var(--vs-iplus-height);height:var(--vs-iplus-height);position:relative;transition:var(--vs-transition-ease);cursor:pointer}.vs-icon-plus::after,.vs-icon-plus:before{background:rgba(var(--vs-color),1);content:"";position:absolute;width:14px;height:2px;border-radius:2px}.vs-icon-plus:before{transform:rotate(0);transition:var(--vs-transition-ease)}.vs-icon-plus:after{transform:rotate(90deg);transition:all .4s ease}.vs-icon-plus:hover:not(.is-less){transform:rotate(-90deg)}.vs-icon-plus.is-less:hover{transform:scale(.75)}.vs-icon-plus.is-less:after{transform:rotate(180deg)}