vue-devui
Version:
DevUI components based on Vite and Vue3
2 lines (1 loc) • 13.3 kB
CSS
@charset "UTF-8";.devui-fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--devui-shadow, rgba(37, 43, 58, .24));opacity:1;z-index:1050}.devui-fixed-overlay--fade-enter-active,.devui-fixed-overlay--fade-leave-active{transition:opacity .1s cubic-bezier(0,0,1,1)}.devui-fixed-overlay--fade-enter-from,.devui-fixed-overlay--fade-leave-to{opacity:0}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));z-index:1000}.devui-flexible-overlay__arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-popover__icon-wrap{width:16px;height:16px;margin-right:8px}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>path{fill:var(--devui-success, #50d4ab)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>circle,.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--success>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>path{fill:var(--devui-warning, #fac20a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--warning>g>polygon{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>g{fill:var(--devui-info, #5e7ce0)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--info>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>path{fill:var(--devui-danger, #f66f6a)}.devui-popover__icon-wrap .devui-popover__icon.devui-popover__icon--error>g>circle{fill:var(--devui-light-text, #ffffff)}.devui-popover__content.devui-flexible-overlay{display:flex;flex-wrap:wrap;align-items:center;white-space:nowrap;padding:4px 12px;line-height:1.5;border-radius:var(--devui-border-radius-feedback, 4px);color:var(--devui-feedback-overlay-text, #dfe1e6);background-color:var(--devui-feedback-overlay-bg, #464d6e);font-size:var(--devui-font-size-sm, 12px)}.devui-popover__content.devui-flexible-overlay.is-icon{flex-wrap:nowrap}.devui-popover--fade-bottom-enter-from,.devui-popover--fade-bottom-leave-to,.devui-popover--fade-top-enter-from,.devui-popover--fade-top-leave-to{opacity:.8;transform:scaleY(.8)}.devui-popover--fade-bottom-enter-to,.devui-popover--fade-bottom-leave-from,.devui-popover--fade-top-enter-to,.devui-popover--fade-top-leave-from{opacity:1;transform:scaleY(1)}.devui-popover--fade-bottom-enter-active,.devui-popover--fade-top-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-bottom-leave-active,.devui-popover--fade-top-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-popover--fade-left-enter-from,.devui-popover--fade-left-leave-to,.devui-popover--fade-right-enter-from,.devui-popover--fade-right-leave-to{opacity:.8;transform:scaleX(.8)}.devui-popover--fade-left-enter-to,.devui-popover--fade-left-leave-from,.devui-popover--fade-right-enter-to,.devui-popover--fade-right-leave-from{opacity:1;transform:scaleX(1)}.devui-popover--fade-left-enter-active,.devui-popover--fade-right-enter-active{transition:transform .1s cubic-bezier(.16,.75,.5,1),opacity .1s cubic-bezier(.16,.75,.5,1)}.devui-popover--fade-left-leave-active,.devui-popover--fade-right-leave-active{transition:transform .1s cubic-bezier(.5,0,.84,.25),opacity .1s cubic-bezier(.5,0,.84,.25)}.devui-form__label{align-self:flex-start}.devui-form__label--vertical{padding-bottom:8px}.devui-form__label--sm{flex:0 0 80px}.devui-form__label--md{flex:0 0 100px}.devui-form__label--lg{flex:0 0 150px}.devui-form__label--start{text-align:left}.devui-form__label--center{text-align:center}.devui-form__label--end{text-align:end}.devui-form__label-span{display:inline-block;vertical-align:middle;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}.devui-form__label--required:before{content:"*";color:red;display:inline-block;margin-right:8px;margin-left:-12px}.devui-form__label--required-right:after{content:"*";color:red;display:inline-block;margin-left:8px}.devui-form__label--required-hide:before,.devui-form__label--required-hide:after{display:none}.devui-form__label-help{position:relative;top:-.1em;display:inline-block;vertical-align:middle;margin-left:4px;cursor:pointer}.devui-form__label-tips-popover .dv-popover__icon-wrap+span{flex:1}.devui-form__control{flex:1 1 auto;position:relative;width:100%}.devui-form__control--horizontal{margin-left:16px}.devui-form__control .devui-star{color:red}.devui-form__control .devui-form__control-container{position:relative}.devui-form__control .devui-form__control-container--horizontal{display:flex;width:100%}.devui-form__control .devui-form__control-container--horizontal .devui-validate-tip{margin:0}.devui-form__control .devui-form__control-container .devui-form__feedback-icon{position:absolute;top:50%;right:0;z-index:1;width:32px;height:16px;text-align:center;visibility:visible;pointer-events:none;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg circle{fill:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--error svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg circle{fill:var(--devui-success, #50d4ab)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--success svg polygon{fill:var(--devui-base-bg, #ffffff)}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg{animation:loading-keyframes 1s infinite linear}.devui-form__control .devui-form__control-container .devui-form__feedback-icon--pending svg path{fill:var(--devui-brand, #5e7ce0)}.devui-form__control .devui-form__control-container--has-feedback{display:flex;align-items:center}.devui-form__control .devui-form__control-container--has-feedback input{padding-right:28px}.devui-form__control .devui-form__control-container--feedback-error{border:1px solid #f66f6a;border-radius:2px}.devui-form__control .devui-form__control-container--feedback-error input{background-color:#ffeeed;border-color:transparent}.devui-form__control .devui-form__control-container--feedback-error input:hover{border-color:transparent}.devui-form__control .devui-form__control-container--feedback-error input:focus{border-color:transparent}.devui-form__control .devui-form__control-container--feedback-error .devui-select-arrow{right:24px}.devui-form__control .devui-form__control-info{line-height:1}.devui-form__control .devui-form__control-info .error-message{display:inline-block;min-height:20px;line-height:1.5;font-size:var(--devui-font-size, 12px);color:var(--devui-danger, #f66f6a)}.devui-form__control .devui-form__control-info .devui-form__control-extra{font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f);min-height:20px;line-height:1.5;text-align:justify}@keyframes loading-keyframes{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.devui-form__item--horizontal{display:flex;align-items:center;margin-bottom:20px}.devui-form__item--vertical{display:flex;flex-direction:column;margin-bottom:20px}.devui-form__item--error{margin-bottom:0}.devui-form-operation .star{color:red}.devui-radio{font-size:var(--devui-font-size, 12px);line-height:1.5;font-weight:400;cursor:pointer;color:var(--devui-text, #252b3a)}.devui-radio__wrapper{display:flex;justify-content:flex-start;align-items:center}.devui-radio.active .devui-radio__material{border-width:4px;border-color:var(--devui-brand, #5e7ce0)}.devui-radio.active.devui-radio--bordered{border-color:var(--devui-primary-hover, #7693f5)}.devui-radio.disabled{cursor:not-allowed}.devui-radio.disabled .devui-radio__label{color:var(--devui-disabled-text, #cfd0d3)}.devui-radio.disabled.devui-radio--bordered{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-radio.disabled .devui-radio__material{border-color:var(--devui-shape-icon-fill, #d7d8da);background-color:var(--devui-shape-icon-fill-disabled, #f5f5f5)}.devui-radio.disabled.active .devui-radio__material{border-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-radio__material{vertical-align:middle;position:relative;display:inline-block;overflow:hidden;height:16px;width:16px;border:1px solid var(--devui-shape-icon-fill, #d7d8da);border-radius:var(--devui-border-radius-full, 100px);transform:translateY(-1px);user-select:none;transition:border var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-radio__label{color:var(--devui-text, #252b3a);margin-left:8px;font-size:var(--devui-font-size, 12px)}.devui-radio__input{opacity:0;z-index:-1;width:0;height:0;display:none;overflow:hidden;pointer-events:none}.devui-radio--glow-style.devui-radio .devui-radio__material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-radio--glow-style.devui-radio:not(.disabled):hover .devui-radio__material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #e9edfa)}.devui-radio--bordered{border:1px solid var(--devui-disabled-line, #dfe1e6);border-radius:var(--devui-border-radius, 2px);padding:0 15px 0 10px}.devui-radio.devui-radio--lg{display:flex;align-items:center}.devui-radio.devui-radio--lg .devui-radio__label{font-size:var(--devui-font-size-lg, 14px)}.devui-radio.devui-radio--lg .devui-radio__material{width:18px;height:18px}.devui-radio.devui-radio--lg .devui-radio__material>svg{width:18px;height:18px}.devui-radio.devui-radio--lg.devui-radio--bordered{height:40px}.devui-radio.devui-radio--md{display:flex;align-items:center}.devui-radio.devui-radio--md .devui-radio__label{font-size:var(--devui-font-size-md, 12px)}.devui-radio.devui-radio--md .devui-radio__material{width:16px;height:16px}.devui-radio.devui-radio--md .devui-radio__material>svg{width:16px;height:16px}.devui-radio.devui-radio--md.devui-radio--bordered{height:32px}.devui-radio.devui-radio--sm{display:flex;align-items:center}.devui-radio.devui-radio--sm .devui-radio__label{font-size:var(--devui-font-size-sm, 12px)}.devui-radio.devui-radio--sm .devui-radio__material{width:14px;height:14px}.devui-radio.devui-radio--sm .devui-radio__material>svg{width:14px;height:14px}.devui-radio.devui-radio--sm.devui-radio--bordered{height:24px}.devui-radio-group{display:inline-flex;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start}.devui-radio-group.is-row{flex-direction:row}.devui-radio-group.is-column{flex-direction:column}.devui-radio-group .devui-radio__wrapper{min-height:28px}.devui-radio-group .devui-radio__wrapper:not(:last-child){padding-right:20px}.devui-radio-button{display:flex;align-items:center;position:relative;padding:var(--devui-btn-padding, 0 20px);height:32px;font-size:var(--devui-font-size-md, 12px);color:var(--devui-text, #252b3a);cursor:pointer;border:1px solid var(--devui-line, #d7d8da);user-select:none}.devui-radio-button.devui-radio-button--lg{font-size:var(--devui-font-size-lg, 14px);padding:var(--devui-btn-lg-padding, 0 24px);height:40px;line-height:40px}.devui-radio-button.devui-radio-button--md{font-size:var(--devui-font-size-md, 12px);padding:var(--devui-btn-padding, 0 20px);height:32px;line-height:32px}.devui-radio-button.devui-radio-button--sm{font-size:var(--devui-font-size-sm, 12px);padding:var(--devui-btn-sm-padding, 0 16px);height:24px;line-height:24px}.devui-radio-button__input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-radio-button.active{color:#fff;background-color:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-radio-button.active.disabled{color:#fff;background-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-radio-button.disabled{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3);background-color:#fff;border-color:var(--devui-disabled-line, #dfe1e6)}.devui-radio-group.is-row .devui-radio-button{border-left:none}.devui-radio-group.is-row .devui-radio-button:first-child{border-top-left-radius:var(--devui-border-radius, 2px);border-bottom-left-radius:var(--devui-border-radius, 2px);border-left:1px solid var(--devui-disabled-line, #dfe1e6)}.devui-radio-group.is-row .devui-radio-button:last-child{border-top-right-radius:var(--devui-border-radius, 2px);border-bottom-right-radius:var(--devui-border-radius, 2px)}.devui-radio-group.is-column .devui-radio-button{width:100%;border-top:none}.devui-radio-group.is-column .devui-radio-button:first-child{border-top-left-radius:var(--devui-border-radius, 2px);border-top-right-radius:var(--devui-border-radius, 2px);border-top:1px solid var(--devui-disabled-line, #dfe1e6)}.devui-radio-group.is-column .devui-radio-button:last-child{border-bottom-left-radius:var(--devui-border-radius, 2px);border-bottom-right-radius:var(--devui-border-radius, 2px)}