UNPKG

@open-data-v/ui

Version:

OpenDataV UI基础包

2 lines (1 loc) 25.9 kB
.o-btn{display:inline-block;white-space:nowrap;cursor:pointer;text-align:center;box-sizing:border-box;outline:none;padding:0 20px;border-radius:3px;font-size:14px;transition:.2s;-webkit-user-select:none;user-select:none;height:34px;line-height:34px;border:1px solid #dcdee0}.o-btn:hover{opacity:.8}.o-btn.disabled{cursor:not-allowed;opacity:.5}.o-btn.is-round{border-radius:18px}.o-btn.is-round.large{border-radius:20px}.o-btn.is-round.small{border-radius:16px}.o-btn.is-round.mini{border-radius:14px}.o-btn.is-circle{border-radius:50%;height:36px;padding:0;width:36px}.o-btn.is-circle.large{width:40px;height:40px}.o-btn.is-circle.small{width:32px;height:32px}.o-btn.is-circle.mini{width:28px;height:28px}.o-btn.o-btn-primary{border-color:#2080f0;background-color:#2080f0;color:#fff}.o-btn.o-btn-primary.is-plain{border-color:#afd2fa;background-color:#e9f2fe;color:#2080f0}.o-btn.o-btn-primary.is-plain:hover{border-color:#2080f0;background-color:#2080f0;color:#fff}.o-btn.o-btn-success{border-color:#18a058;background-color:#18a058;color:#fff}.o-btn.o-btn-success.is-plain{border-color:#69e8a5;background-color:#e5fbef;color:#18a058}.o-btn.o-btn-success.is-plain:hover{border-color:#18a058;background-color:#18a058;color:#fff}.o-btn.o-btn-warning{border-color:#f0a020;background-color:#f0a020;color:#fff}.o-btn.o-btn-warning.is-plain{border-color:#f3b450;background-color:#f8d59c;color:#f0a020}.o-btn.o-btn-warning.is-plain:hover{border-color:#f0a020;background-color:#f0a020;color:#fff}.o-btn.o-btn-bordered{border:none}.o-btn.o-btn-danger{border-color:#d03050;background-color:#d03050;color:#fff}.o-btn.o-btn-danger.is-plain{border-color:#ecadb9;background-color:#fbeff2;color:#d03050}.o-btn.o-btn-danger.is-plain:hover{border-color:#d03050;background-color:#d03050;color:#fff}.o-btn.o-btn-text{border:0;padding:0;height:auto;line-height:normal}.o-btn.large{padding:0 20px;border-radius:4px;font-size:14px;height:40px;line-height:40px}.o-btn.small{padding:0 5px;border-radius:3px;font-size:12px;height:32px;line-height:32px}.o-btn.mini{padding:0 15px;border-radius:4px;font-size:12px;height:28px;line-height:28px}.o-collapse .collapse-title{height:50px;line-height:50px;cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center}.o-collapse .collapse-title .arrow{font-size:12px;margin-right:5px;width:20px;display:block;transform:rotate(0) scale(.8);transition:all .3s}.o-collapse .collapse-title .arrow.down{transform:rotate(90deg) scale(.8)}.o-collapse .collapse-content{padding:10px;overflow:hidden;transition:all .3s}.vc-hue--horizontal{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.vc-hue--vertical{background:linear-gradient(to top,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.vc-saturation-circle{cursor:pointer;width:4px;height:4px;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px #0000004d,0 0 1px 2px #0006;border-radius:50%;transform:translate(-2px,-2px)}.o-form-input{height:35px;margin-right:1px;border-radius:3px;@apply w-full dark:bg-zinc-800 bg-white px-2 border border-solid border-gray-300 dark:border-0 relative inline-block;}.o-form-input .suffix-icon,.o-form-input .prefix-icon{position:absolute;right:5px;top:50%;transform:translateY(-50%);height:34px;box-sizing:content-box;display:flex;align-items:center;justify-content:flex-end}.o-form-input .suffix-icon i,.o-form-input .prefix-icon i{@apply m-1;font-size:16px;cursor:pointer;transition:all .3s;width:16px;height:16px;text-align:center;line-height:16px;color:#969799}.o-form-input .suffix-icon .icon-close,.o-form-input .prefix-icon .icon-close{font-size:14px}.o-form-input .prefix-icon{left:3px;right:auto}.o-form-input .icon-close{display:none}.o-form-input:hover .icon-close{display:block}.o-form-input .has-prefix{padding-left:30px}.o-form-input.input-prepend,.o-form-input.input-append{display:flex;justify-content:space-between;align-items:stretch}.o-form-input.input-prepend .prepend,.o-form-input.input-append .prepend,.o-form-input.input-prepend .append,.o-form-input.input-append .append{@apply border border-gray-300 dark:border-0;display:flex;align-items:center;padding:0 5px}.o-form-input.input-prepend .prepend,.o-form-input.input-append .prepend{border-radius:3px 0 0 3px;border-right:none;margin-right:-1px}.o-form-input.input-prepend .append,.o-form-input.input-append .append{border-radius:0 3px 3px 0;border-left:none;margin-left:-1px}.o-input-control{@apply bg-transparent overflow-hidden outline-none box-border w-full h-full;line-height:34px;padding:0 10px;font-size:14px;transition:all .3s}.o-input-control:hover{opacity:.7}.o-input-control:focus,.o-input-control.focus{border-color:#2080f0}.o-input-control::placeholder,.o-input-control.placeholder{color:#969799}.o-input-control.disabled{cursor:not-allowed;opacity:.5}.o-input-control.large{height:40px;line-height:40px}.o-input-control.small{height:32px;line-height:32px}.o-input-control.mini{height:28px;line-height:28px}.o-form-item{margin-bottom:10px;position:relative}.o-form-item .o-form-label{text-align:right;font-size:14px;box-sizing:border-box}.o-form-item .o-form-label.required:before{content:"*";color:red;display:inline-block;vertical-align:middle}.o-form-item .o-form-box{position:relative;@apply flex flex-col items-start;}.o-form-item .o-form-tips{color:red;display:flex}.o-form-item.form-item-mini{line-height:28px}.o-form-item.form-item-mini .o-input-control,.o-form-item.form-item-mini .o-btn{height:28px;line-height:28px}.o-form-item.form-item-small{line-height:32px}.o-form-item.form-item-small .o-input-control,.o-form-item.form-item-small .o-btn{height:32px;line-height:32px}.o-form-item.form-item-medium{line-height:36px}.o-form-item.form-item-medium .o-input-control,.o-form-item.form-item-medium .o-btn{height:36px;line-height:36px}.o-form-item-error .o-input-control{border-color:red}.o-input-number{@apply w-full dark:bg-zinc-800 bg-white px-2 align-middle inline-block border border-solid border-gray-300 dark:border-0 relative;height:34px}.o-input-number .o-input-number-input{@apply w-full h-full align-middle inline-block;}.o-input-number .o-input-number-input input{@apply w-full h-full bg-transparent px-2;}.o-input-number .o-input-number-input input:focus-visible{outline:0;color:#2080f0}.o-input-number .number-control{@apply w-full h-full inline-block;}.o-input-number .number-control a{@apply flex absolute bg-transparent text-center items-center justify-center cursor-pointer;top:1px;bottom:1px;width:20px;right:20px;font-size:14px}.o-input-number .number-control a:last-child{left:auto;right:1px}.o-input-number .number-control a.disabled{@apply cursor-not-allowed;opacity:.5}.o-input-number .number-control a.suffix{right:40px}.o-input-number.disabled .number-control{opacity:.5}.o-input-number.disabled .number-control a{cursor:not-allowed}.o-menu .icon-arrow{font-size:14px;transform:scale(.8);margin-left:5px;display:block;cursor:pointer;transition:all .3s;height:16px;width:16px}.o-menu li.disabled{opacity:.5;cursor:not-allowed}.o-menu li.disabled .o-menu-title{cursor:not-allowed}.o-menu li.is-down>.o-menu-title{color:#2080f0}.o-menu li.is-down>.o-menu-title .icon-arrow{transform:rotate(180deg) scale(.8)}.o-menu li.selected>.o-menu-title{@apply bg-gray-100 dark:bg-gray-700;color:#2080f0}.o-menu .o-menu-title{display:flex;align-items:center;font-size:14px;text-overflow:ellipsis;white-space:nowrap;width:100%;height:50px;cursor:pointer;padding:0 20px;transition:all .3s;justify-content:space-around}.o-menu .o-menu-title .name{flex:2}.o-menu .o-menu-title .icon{display:flex;align-items:center;margin-right:3px;font-size:16px}.o-menu.horizontal>ul{display:flex;line-height:40px;border-bottom:1px solid #dcdee0}.o-menu.horizontal li{position:relative}.o-menu.horizontal li ul{background:#fff;position:absolute;box-shadow:0 0 12px #0000001f;z-index:10;left:101%;top:0}.o-menu.horizontal li ul.layer-1{left:0;top:inherit}.o-menu.horizontal li ul li:after{display:none}.o-menu.horizontal li:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:#2080f0;opacity:0;transition:all .3s}.o-menu.horizontal li:hover>.o-menu-title{color:#2080f0}.o-menu.horizontal li:hover:after{opacity:1}.o-menu.vertical li{line-height:40px}.o-menu.vertical li:hover>.o-menu-title{@apply bg-gray-100 dark:bg-gray-700;}.o-menu.vertical .layer-1 .o-menu-title{padding-left:40px}.o-menu.vertical .layer-2 .o-menu-title{padding-left:60px}.o-menu.vertical .layer-3 .o-menu-title{padding-left:80px}.o-menu.o-collapsed{width:60px}.o-menu.o-collapsed .layer-0>li>.o-menu-title .icon{margin:5px 0}.o-menu.o-collapsed .layer-0>li>.o-menu-title .icon-arrow,.o-menu.o-collapsed .layer-0>li>.o-menu-title .name{display:none}.o-menu.o-collapsed .layer-0>li>.o-menu-title:hover{@apply bg-gray-100 dark:bg-gray-700;}.o-menu.o-collapsed li{position:relative}.o-menu.o-collapsed li ul{position:absolute;left:100%;top:0;box-shadow:0 0 12px #0000001f;z-index:10}.o-menu.o-collapsed .o-menu-title{padding:0 20px!important}.o-menu.dark{background:#444b50;color:#fff}.o-menu.dark.horizontal ul,.o-menu.dark.vertical ul{background:#444b50}.o-menu.dark.vertical li:hover>.o-menu-title{background:#2080f0;color:#fff}.o-menu.dark.vertical li.is-down>.o-menu-title{color:#fff}.o-menu .menu-enter-active{animation:menu-enter .3s forwards}.o-menu .menu-leave-active{animation:menu-exit .3s forwards}@keyframes menu-enter{0%{opacity:0;height:0}to{opacity:1}}@keyframes menu-exit{0%{opacity:1}to{opacity:0;height:0}}.o-dialog{position:absolute;box-shadow:1px 1px 20px #0000004d;border-radius:5px;background:#fff;overflow:hidden;transition:all .3s;top:20vh;min-width:400px;@apply lg:w-1/3 md:w-1/3 xl:w-1/3 sm:w-full;}.o-dialog .o-dialog-close{display:flex;position:absolute;right:10px;top:10px;height:20px;width:20px;align-items:center;justify-content:center;cursor:pointer;z-index:5}.o-dialog .o-dialog-close:hover{opacity:.8}.o-dialog .o-ialog-header{overflow:hidden;font-size:16px;padding-left:15px;position:relative;border-bottom:1px solid #f2f3f5;color:#323233;border-radius:5px 5px 0 0;-webkit-user-select:none;height:44px;line-height:44px}.o-dialog .o-ialog-header.move{cursor:move}.o-dialog .o-dialog-content{@apply w-full;overflow:hidden;overflow-y:auto;box-sizing:border-box;transition:all .3s}.o-dialog .o-dialog-footer{text-align:right;padding:10px 20px 20px}.o-dialog .o-dialog-auto-close{position:absolute;left:10px;top:45px}.o-dialog .o-dialog-alert{display:flex;justify-content:center;align-items:center}.o-dialog .o-dialog-alert i{font-size:30px;margin-right:5px}.o-dialog .o-dialog-alert .icon-success:before{color:green}.o-dialog .o-dialog-alert .icon-failure:before{color:red}.o-dialog .o-dialog-alert .icon-tips:before{color:orange}.o-dialog.dialog-msg{top:8px}.o-dialog.dialog-msg .o-dialog-content{padding:8px}.o-dialog.dialog-msg .o-dialog-content i{font-size:16px}.o-dialog-modal{position:fixed;left:0;top:0;right:0;bottom:0;z-index:100;display:flex;justify-content:center;background:#37373799}.o-dialog-modal.modal{background:none}.o-dialog-modal.center{align-items:center}.o-dialog-modal.center .o-dialog{top:auto}.o-dialog-isAlert{min-width:200px}.o-dialog-isAlert .o-dialog-auto-close{display:none}.fade-enter-active{animation:modal-fade-in .3s!important}.fade-enter-active .o-dialog{animation:dialog-fade-in .3s}.fade-leave-active{animation:modal-fade-out .3s}.fade-leave-active .o-dialog{animation:dialog-fade-out .3s}@keyframes dialog-fade-in{0%{transform:translateY(-20px);opacity:0}}@keyframes dialog-fade-out{to{transform:translateY(-20px);opacity:0}}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-fade-out{0%{opacity:1}to{opacity:0}}.zoom-enter-active{animation:modal-fade-in .3s!important}.zoom-enter-active .o-dialog{animation:dialog-zoom-in .3s}.zoom-leave-active{animation:modal-fade-out .3s}.zoom-leave-active .o-dialog{animation:dialog-zoom-out .3s}@keyframes dialog-zoom-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes dialog-zoom-out{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.slide-enter-active{animation:modal-fade-in .3s!important}.slide-enter-active .o-drawer-top{animation:dialog-slide-top-in .3s}.slide-enter-active .o-drawer-bottom{animation:dialog-slide-bottom-in .3s}.slide-enter-active .o-drawer-left{animation:dialog-slide-left-in .3s}.slide-enter-active .o-drawer-right{animation:dialog-slide-right-in .3s}.slide-leave-active{animation:modal-fade-out .3s}.slide-leave-active .o-drawer-top{animation:dialog-slide-top-out .3s}.slide-leave-active .o-drawer-bottom{animation:dialog-slide-bottom-out .3s}.slide-leave-active .o-drawer-left{animation:dialog-slide-left-out .3s}.slide-leave-active .o-drawer-right{animation:dialog-slide-right-out .3s}@keyframes dialog-slide-top-in{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes dialog-slide-top-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:0}}@keyframes dialog-slide-bottom-in{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes dialog-slide-bottom-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:0}}@keyframes dialog-slide-left-in{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes dialog-slide-left-out{0%{transform:translate(0);opacity:1}to{transform:translate(-100%);opacity:0}}@keyframes dialog-slide-right-in{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes dialog-slide-right-out{0%{transform:translate(0);opacity:1}to{transform:translate(100%);opacity:0}}.o-radio{cursor:pointer;display:inline-block}.o-radio>span{display:flex;align-items:center}.o-radio .radio-inner{margin-right:5px;width:14px;height:14px;border-radius:50%;border:1px solid #dcdee0;display:flex;align-items:center;justify-content:center}.o-radio .radio-inner:after{display:block;width:8px;height:8px;border-radius:50%;content:"";background:#dcdee0;opacity:0;transform:scale(0);transition:all .3s}.o-radio.checked .radio-inner{border-color:#2080f0}.o-radio.checked .radio-inner:after{opacity:1;transform:scale(1);background:#2080f0}.o-radio.disabled{cursor:not-allowed;opacity:.5}.o-radio.disabled .radio-inner{opacity:.5}.o-radio .o-radio{margin-left:10px}.o-radio-group{display:inline-block}.o-tag{border:1px solid #afd2fa;background-color:#e9f2fe;color:#2080f0;display:inline-block;height:28px;padding:0 10px;line-height:26px;font-size:12px;border-radius:4px;box-sizing:border-box;white-space:nowrap}.o-tag .o-tag{margin-left:10px}.o-tag .icon-close{font-size:12px;width:16px;height:16px;display:inline-block;margin-left:10px;transform:scale(.8);vertical-align:middle;line-height:16px;cursor:pointer}.o-tag .icon-close:hover{opacity:.6}.o-tag.tag-success{border:1px solid #69e8a5;background-color:#e5fbef;color:#18a058}.o-tag.tag-warning{border:1px solid #f3b450;background-color:#f8d59c;color:#f0a020}.o-tag.tag-danger{border:1px solid #ecadb9;background-color:#fbeff2;color:#d03050}.o-tag.tag-large{height:32px;line-height:30px}.o-tag.tag-small{height:24px;line-height:22px;padding:0 8px}.o-tag.tag-mini{height:20px;line-height:18px;padding:0 5px}.o-select-down{@apply w-full dark:bg-zinc-800 bg-white border border-solid border-gray-300 dark:border-0 relative;height:35px}.o-select-down .select-control{position:relative}.o-select-down .select-control .group-icon{display:flex;position:absolute;right:0;top:50%;transform:translateY(-50%);cursor:pointer;transition:all .3s;height:20px;text-align:center;line-height:30px;align-items:center;justify-content:center}.o-select-down .select-control .group-icon i{margin-right:6px;font-size:14px;transition:all .3s}.o-select-down .select-control .group-icon .down{transform:translateY(0) rotate(-180deg)}.o-select-down .select-control .group-icon .icon-close{opacity:0}.o-select-down .select-control:hover .icon-close{opacity:1}.o-select-down .select-control>input{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:34px;@apply w-full dark:bg-zinc-800 bg-white px-2;}.o-select-down .select-control>input::placeholder{color:#969799}.o-select-down .select-control>input:focus-visible{outline:0;color:#2080f0}.o-select-down.disabled{cursor:not-allowed}.o-select-down.disabled .icon-close{display:none}.o-select-down.disabled .group-icon i{opacity:.5}.o-select-down.disabled input{cursor:not-allowed}.o-select-down .multiple-text{height:auto;line-height:normal;display:flex;align-items:center;min-height:40px;padding-right:25px}.o-select-down .multiple-text ul{display:flex;flex-wrap:wrap;align-items:center}.o-select-down .multiple-text ul:empty:before{content:attr(placeholder);color:#969799}.o-select-down .multiple-text.large{min-height:40px}.o-select-down .multiple-text.small{min-height:32px}.o-select-down .multiple-text.mini{min-height:28px}.o-select-down .multiple-text li{margin-right:10px}.o-select-down .multiple-text li:last-child{margin-right:0}.o-select-down .multiple-text li i{margin-left:5px;font-size:14px}.o-select-down .multiple-text .input{flex:2}.o-select-down .multiple-text input{width:100%;outline:none;border:0;display:inline-block;height:26px;line-height:26px}.o-select-down.is-down .multiple-text,.o-select-down.is-down .select-control input,.o-select-down.is-down .select-range{border-color:#2080f0;transition:all .3s}.o-select-down .select-range{display:flex;align-items:center;justify-content:space-around;padding-right:25px}.o-select-down .select-range input{height:100%;border:0;outline:none;flex:2;width:100%}.o-select-down .select-range span{padding:0 10px}.o-select-down-pane{@apply w-full dark:bg-zinc-800 bg-white box-border rounded relative top-1;z-index:50;display:inline-block;box-shadow:0 0 12px #0000001f}.o-select-down-pane .down-arrow{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px;filter:drop-shadow(0 2px 12px rgba(0,0,0,.03));left:30px;top:-5px;border-top-width:0;@apply border-b-gray-300 dark:border-b-0;}.o-select-down-pane .down-arrow:before{content:"";position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px;border-top-width:0;@apply border-b-zinc-50 dark:border-b-zinc-500;top:1px;left:-5px}.o-select-down-pane .down-arrow.is-range{left:50%;transform:translate(-50%)}.o-select-down-pane.top{position:relative;top:auto;bottom:208px}.o-select-down-pane.top .down-arrow{top:auto;bottom:-5px;transform:rotate(180deg)}.o-select-down-pane .scroll-pane{@apply overflow-x-hidden w-full;}.o-select-down-pane .scroll-pane::-webkit-scrollbar{width:8px;height:8px;position:relative;z-index:100;@apply bg-zinc-50 dark:bg-zinc-500 opacity-60;}.o-select-down-pane .scroll-pane::-webkit-scrollbar-thumb{@apply bg-zinc-300 opacity-5 dark:bg-zinc-200;background-clip:padding-box;min-height:5px;height:5px;border-radius:5px}.o-select-down-pane .scroll-pane::-webkit-scrollbar-corner{@apply bg-gray-100 opacity-5;}.slide-toggle-enter-active{animation:slideDown .3s;transform-origin:center top}.slide-toggle-leave-active{animation:slideUp .3s;transform-origin:center top}.top .slide-toggle-enter-active,.top .slide-toggle-leave-active{transform-origin:center top}.slide-toggle-top-enter-active{animation:slideDown .3s;transform-origin:center top}.slide-toggle-top-leave-active{animation:slideUp .3s;transform-origin:center top}@keyframes slideDown{0%{opacity:0;transform:scaleY(0) translate(-10px)}}@keyframes slideUp{to{opacity:0;transform:scaleY(0) translate(0)}}.o-select{margin-right:1px;border-radius:3px;@apply w-full dark:bg-zinc-500 bg-zinc-50 box-border rounded;box-sizing:border-box;width:100%;z-index:50}.o-select li{list-style:none;height:34px;line-height:34px;padding:0 10px;margin:0;cursor:pointer;width:100%;display:block;box-sizing:border-box;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-webkit-user-select:none;user-select:none}.o-select li:hover{@apply bg-gray-100 dark:bg-gray-700;}.o-select li.active{@apply bg-gray-100 dark:bg-gray-700;color:#2080f0}.o-select li.active b{color:#fff}.o-select li.disabled{cursor:not-allowed;opacity:.5}.o-select li .b{color:#2080f0;font-weight:400}.o-select .select-empty-options{height:34px;text-align:center;color:#323233;margin:0;padding:0 10px;line-height:34px}.o-slider .o-slider-runway{width:100%;height:6px;margin:16px 0;background-color:#e4e7ed;border-radius:3px;position:relative;cursor:pointer;vertical-align:middle}.o-slider .slider-bar{height:6px;background-color:#18a058;border-radius:3px;position:absolute}.o-slider .slider-control{display:block;height:36px;width:36px;position:absolute;z-index:81;top:-13px;transform:translate(-50%);background-color:transparent;-webkit-user-select:none;user-select:none;line-height:normal}.o-slider .slider-control:after{display:block;content:"";width:16px;height:16px;border:2px solid #18a058;background-color:#fff;border-radius:50%;transition:.2s;-webkit-user-select:none;user-select:none;margin:8px auto}.o-slider .slider-control:hover:after{transform:scale(1.2)}.o-slider .slider-control:hover .slider-tooltip{opacity:1}.o-slider .slider-tooltip{position:absolute;white-space:nowrap;padding:5px 10px;background:#000;color:#fff;border-radius:10px;transform:translate(-50%,-100%);left:50%;box-shadow:0 0 2px #999;opacity:0;transition:all .3s}.o-slider .slider-tooltip:after{content:"";display:block;width:0;height:0;border:5px solid transparent;border-top-color:#000;position:absolute;left:50%;bottom:-10px;transform:translate(-50%)}.o-slider .slider-stop,.o-slider .slider-marks{position:absolute;height:6px;width:6px;border-radius:100%;background-color:#fff;transform:translate(-50%)}.o-slider .slider-marks .slider-marks-text{display:block;white-space:nowrap;position:absolute;transform:translate(-50%);left:50%;bottom:-25px;color:#999}.o-slider.disabled .slider-bar{background:#c0c4cc}.o-slider.disabled .slider-control:after{border-color:#c0c4cc}.o-slider.disabled .slider-control:hover:after{cursor:not-allowed;transform:scale(1)}.o-switch{display:inline-block;box-sizing:border-box;height:22px;min-width:44px;vertical-align:middle;border-radius:20px;background:#ccc;cursor:pointer;transition:all 1s;-webkit-user-select:none;user-select:none;position:relative}.o-switch .o-switch-inner{position:absolute;width:18px;height:18px;left:3px;top:2px;border-radius:50%;background-color:#fff;cursor:pointer;transition:all .5s;display:block}.o-switch .switch-text{text-align:right;display:block;padding:0 5px;font-size:12px;line-height:20px;color:#fff;transition:all .3s}.o-switch.switch-checked{background:#2080f0}.o-switch.switch-checked .o-switch-inner{left:22px}.o-switch.switch-checked .switch-text{text-align:left}.o-switch.disabled{opacity:1;cursor:not-allowed}.o-switch.large{height:24px}.o-switch.large .o-switch-inner{top:1px}.o-switch.small{height:18px;min-width:40px}.o-switch.small .o-switch-inner{height:14px;width:14px}.o-switch.mini{height:16px;min-width:32px}.o-switch.mini.switch-checked .o-switch-inner{left:10px}.o-switch.mini .o-switch-inner{height:12px;width:12px}.o-tabs .tabs-nav{height:40px}.o-tabs .tabs-nav .tabs-tab{@apply transition-all duration-300;}.o-tabs .tabs-nav .tabs-prev,.o-tabs .tabs-nav .tabs-next{@apply block text-center cursor-pointer;width:30px;height:30px;line-height:30px;transition:all .3s}.o-tabs .tabs-nav .tabs-prev.disabled,.o-tabs .tabs-nav .tabs-next.disabled{@apply cursor-not-allowed;color:#999}.o-tabs .tabs-nav .tabs-prev{@apply rotate-90;}.o-tabs .tabs-nav .tabs-next{@apply -rotate-90;}.o-tabs .tabs-nav .tabs-item{line-height:40px;z-index:2}.o-tabs .tabs-nav .tabs-item:after{@apply transition-all duration-300;}.o-tabs .tabs-nav .tabs-item.active{border-bottom-width:2px;border-bottom-color:#2080f0;color:#2080f0}.o-tabs .tabs-nav .tabs-item.active:after{opacity:1;@apply w-full;}.o-tabs .tabs-nav .tabs-item.disabled{cursor:not-allowed;opacity:.5}.o-tabs.bottom .tabs-nav{order:1}.o-tabs.left,.o-tabs.right{@apply flex-row;}.o-tabs.left .tabs-nav,.o-tabs.right .tabs-nav{@apply w-full block text-center h-auto;}.o-tabs.left .tabs-scroll,.o-tabs.right .tabs-scroll{@apply block overflow-x-hidden overflow-y-auto;}.o-tabs.left .tabs-tab,.o-tabs.right .tabs-tab{@apply block;}.o-tabs.left .tabs-content,.o-tabs.right .tabs-content{flex:2}.o-tabs.right .tabs-nav{order:1}.tooltip{position:absolute;z-index:100;padding:8px 12px;line-height:20px;border-radius:5px;box-sizing:border-box;border:0 solid;box-shadow:0 0 12px #0000001f;background-color:#000e1c;text-align:left;color:#fff}.tooltip .arrow{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px;filter:drop-shadow(0 2px 12px rgba(0,0,0,.03));border-top-width:0;background-color:#000e1c}.tooltip .arrow:before{content:"";position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px;border-top-width:0;top:1px;left:-5px}.tooltip.top-left .arrow{left:15px;bottom:-6px;transform:rotate(180deg)}.tooltip.top .arrow{left:50%;bottom:-6px;margin-left:-5px;transform:rotate(180deg)}.tooltip.top-right .arrow{right:15px;bottom:-6px;transform:rotate(180deg)}.tooltip.left .arrow{right:-8px;top:50%;margin-top:-3px;transform:rotate(90deg)}.tooltip.right .arrow{left:-8px;top:50%;transform:rotate(-90deg);margin-top:-3px}.tooltip.bottom-left .arrow{left:15px;top:-6px}.tooltip.bottom .arrow{left:50%;top:-6px;margin-left:-3px}.tooltip.bottom-right .arrow{right:15px;top:-6px}.tooltip-fade-enter-active{animation:tooltip-fade-in .3s}.tooltip-fade-enter-active.top,.tooltip-fade-enter-active.bottom{animation:tooltip-fade-inX .3s}.tooltip-fade-enter-active.left,.tooltip-fade-enter-active.right{animation:tooltip-fade-inY .3s}.tooltip-fade-leave-active{animation:tooltip-fade-out .3s}@keyframes tooltip-fade-in{0%{transform:scale(.8);opacity:0}}@keyframes tooltip-fade-out{to{opacity:0;transform:scale(.8)}}@keyframes tooltip-fade-inX{0%{transform:translate(-50%) scale(.8);opacity:0}}