@arco-design/web-react
Version:
Arco Design React UI Library.
1 lines • 14.1 kB
CSS
.arco-select .arco-select-view{color:var(--color-text-1);background-color:var(--color-fill-2);border:1px solid transparent}.arco-select:hover .arco-select-view{background-color:var(--color-fill-3);border-color:transparent}.arco-select.arco-select-focused .arco-select-view{color:var(--color-text-1);background-color:var(--color-bg-2);border-color:rgb(var(--primary-6));box-shadow:0 0 0 0 var(--color-primary-light-2)}.arco-select .arco-select-arrow-icon,.arco-select .arco-select-clear-icon,.arco-select .arco-select-expand-icon,.arco-select .arco-select-loading-icon,.arco-select .arco-select-search-icon,.arco-select .arco-select-suffix-icon{color:var(--color-text-2)}.arco-select-no-border .arco-select-view{border:none;background:0 0}.arco-select-error .arco-select-view{background-color:var(--color-danger-light-1);border:1px solid transparent}.arco-select-error:hover .arco-select-view{background-color:var(--color-danger-light-2);border-color:transparent}.arco-select-error.arco-select-focused .arco-select-view{color:var(--color-text-1);background-color:var(--color-bg-2);border-color:rgb(var(--danger-6));box-shadow:0 0 0 0 var(--color-danger-light-2)}.arco-select-no-border .arco-select-view{border:none;background:0 0}.arco-select-warning .arco-select-view{background-color:var(--color-warning-light-1);border:1px solid transparent}.arco-select-warning:hover .arco-select-view{background-color:var(--color-warning-light-2);border-color:transparent}.arco-select-warning.arco-select-focused .arco-select-view{color:var(--color-text-1);background-color:var(--color-bg-2);border-color:rgb(var(--warning-6));box-shadow:0 0 0 0 var(--color-warning-light-2)}.arco-select-no-border .arco-select-view{border:none;background:0 0}.arco-select-disabled .arco-select-view{color:var(--color-text-4);background-color:var(--color-fill-2);border:1px solid transparent}.arco-select-disabled:hover .arco-select-view{background-color:var(--color-fill-2);border-color:transparent}.arco-select-disabled .arco-select-arrow-icon,.arco-select-disabled .arco-select-clear-icon,.arco-select-disabled .arco-select-expand-icon,.arco-select-disabled .arco-select-loading-icon,.arco-select-disabled .arco-select-search-icon,.arco-select-disabled .arco-select-suffix-icon{color:var(--color-text-4)}.arco-select-no-border .arco-select-view{border:none;background:0 0}.arco-select-size-mini.arco-select-multiple .arco-select-view{height:auto;font-size:12px;padding:0 3px;line-height:0}.arco-select-size-mini.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-size-mini.arco-select-multiple .arco-input-tag-has-placeholder input{box-sizing:border-box;padding-left:4px}.arco-select-size-mini.arco-select-multiple .arco-select-suffix{padding-right:4px}.arco-select-size-mini.arco-select-multiple input{font-size:12px}.arco-select-size-mini.arco-select-single .arco-select-view{height:24px;line-height:22px;font-size:12px;padding:0 7px}.arco-select-size-mini.arco-select-single input{font-size:12px}.arco-select-size-mini.arco-select-multiple .arco-select-view-with-prefix{padding-left:7px}.arco-select-size-small.arco-select-multiple .arco-select-view{height:auto;font-size:14px;padding:0 3px;line-height:0}.arco-select-size-small.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-size-small.arco-select-multiple .arco-input-tag-has-placeholder input{box-sizing:border-box;padding-left:8px}.arco-select-size-small.arco-select-multiple .arco-select-suffix{padding-right:8px}.arco-select-size-small.arco-select-multiple input{font-size:14px}.arco-select-size-small.arco-select-single .arco-select-view{height:28px;line-height:26px;font-size:14px;padding:0 11px}.arco-select-size-small.arco-select-single input{font-size:14px}.arco-select-size-small.arco-select-multiple .arco-select-view-with-prefix{padding-left:11px}.arco-select-size-default.arco-select-multiple .arco-select-view{height:auto;font-size:14px;padding:0 3px;line-height:0}.arco-select-size-default.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-size-default.arco-select-multiple .arco-input-tag-has-placeholder input{box-sizing:border-box;padding-left:8px}.arco-select-size-default.arco-select-multiple .arco-select-suffix{padding-right:8px}.arco-select-size-default.arco-select-multiple input{font-size:14px}.arco-select-size-default.arco-select-single .arco-select-view{height:32px;line-height:30px;font-size:14px;padding:0 11px}.arco-select-size-default.arco-select-single input{font-size:14px}.arco-select-size-default.arco-select-multiple .arco-select-view-with-prefix{padding-left:11px}.arco-select-size-large.arco-select-multiple .arco-select-view{height:auto;font-size:14px;padding:0 3px;line-height:0}.arco-select-size-large.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-size-large.arco-select-multiple .arco-input-tag-has-placeholder input{box-sizing:border-box;padding-left:12px}.arco-select-size-large.arco-select-multiple .arco-select-suffix{padding-right:12px}.arco-select-size-large.arco-select-multiple input{font-size:14px}.arco-select-size-large.arco-select-single .arco-select-view{height:36px;line-height:34px;font-size:14px;padding:0 15px}.arco-select-size-large.arco-select-single input{font-size:14px}.arco-select-size-large.arco-select-multiple .arco-select-view-with-prefix{padding-left:15px}.arco-select{display:inline-block;position:relative;box-sizing:border-box;width:100%;cursor:pointer}.arco-select-view{display:flex;position:relative;box-sizing:border-box;width:100%;border-radius:var(--border-radius-small);outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:left;transition:all .1s cubic-bezier(0,0,1,1),padding 0s linear}.arco-select-view input{color:inherit;cursor:inherit}.arco-select-view input::-webkit-input-placeholder{color:var(--color-text-3)}.arco-select-view input::-moz-placeholder{color:var(--color-text-3)}.arco-select-view input::-ms-input-placeholder{color:var(--color-text-3)}.arco-select-view input::placeholder{color:var(--color-text-3)}.arco-select-view input[disabled]{pointer-events:none}.arco-select-multiple,.arco-select-show-search{cursor:text}.arco-select-disabled{cursor:not-allowed}.arco-select-disabled .arco-select-view input::-webkit-input-placeholder{color:var(--color-text-4)}.arco-select-disabled .arco-select-view input::-moz-placeholder{color:var(--color-text-4)}.arco-select-disabled .arco-select-view input::-ms-input-placeholder{color:var(--color-text-4)}.arco-select-disabled .arco-select-view input::placeholder{color:var(--color-text-4)}.arco-select-single .arco-select-view-input{box-sizing:border-box;width:100%;padding:0;border:none;outline:0;background:0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.arco-select-single .arco-select-view-selector{position:relative;display:inline-flex;box-sizing:border-box;width:100%;overflow:hidden}.arco-select-single .arco-select-view-selector .arco-select-view-input{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:1}.arco-select-single .arco-select-view-selector .arco-select-view-value-mirror{opacity:0}.arco-select-single .arco-select-view-value,.arco-select-single .arco-select-view-value-mirror{display:inline-block;box-sizing:border-box;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.arco-select-single .arco-select-view-value-mirror::after,.arco-select-single .arco-select-view-value::after{content:'.';font-size:0;line-height:0;visibility:hidden}.arco-select-single .arco-select-view .arco-select-hidden{opacity:0;position:absolute;z-index:-1}.arco-select-multiple{vertical-align:top}.arco-select-multiple .arco-select-view{padding:0 4px;line-height:0}.arco-select-multiple .arco-select-view-with-prefix{padding-left:12px}.arco-select-multiple .arco-input-tag{flex:1;padding:0;border:none;background:0 0;box-shadow:none;overflow:hidden}.arco-select-multiple .arco-tag{max-width:100%}.arco-select-multiple:not(.arco-select-focused) .arco-input-tag input:not(:first-child)[value='']{opacity:0;position:absolute;z-index:-1}.arco-select-prefix{display:flex;align-items:center;margin-right:12px;white-space:nowrap;color:var(--color-text-2)}.arco-select-suffix{display:flex;align-items:center;margin-left:4px}.arco-select-clear-icon,.arco-select-expand-icon,.arco-select-loading-icon,.arco-select-search-icon,.arco-select-suffix-icon{font-size:12px;transition:all .1s cubic-bezier(0,0,1,1)}.arco-select-arrow-icon{font-size:12px}.arco-select-open .arco-select-arrow-icon svg{transform:rotateZ(180deg)}.arco-select .arco-select-clear-icon{display:none;cursor:pointer}.arco-select .arco-select-clear-icon>svg{position:relative;transition:all .1s cubic-bezier(0,0,1,1)}.arco-select:hover .arco-select-clear-icon{display:block}.arco-select:hover .arco-select-clear-icon~*{display:none}.arco-select-wrapper{display:inline-flex;align-items:stretch;width:100%}.arco-select-wrapper .arco-select{min-width:0}.arco-select-wrapper .arco-select:not(.arco-select-focused):not(:first-child) .arco-select-view{border-top-left-radius:0;border-bottom-left-radius:0}.arco-select-wrapper .arco-select:not(.arco-select-focused):not(:last-child) .arco-select-view{border-top-right-radius:0;border-bottom-right-radius:0}.arco-select-addbefore{display:flex;align-items:center;padding:0 12px;color:var(--color-text-1);background-color:var(--color-fill-2);white-space:nowrap;border:1px solid transparent}.arco-select-addbefore{border-right:1px solid var(--color-border-2);border-top-left-radius:var(--border-radius-small);border-bottom-left-radius:var(--border-radius-small)}.arco-select-popup{top:4px;box-sizing:border-box;padding:4px 0;border:1px solid var(--color-fill-3);border-radius:var(--border-radius-medium);background-color:var(--color-bg-popup);box-shadow:0 4px 10px rgba(0,0,0,.1);overflow:hidden}.arco-select-popup-hidden{display:none}.arco-select-popup .arco-select-popup-inner{width:100%;max-height:200px;list-style:none}.arco-select-popup .arco-select-option{position:relative;box-sizing:border-box;width:100%;padding:0 12px;font-size:14px;text-align:left;cursor:pointer;line-height:36px;border-radius:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--color-text-1);background-color:var(--color-bg-popup)}.arco-select-popup .arco-select-option-selected{color:var(--color-text-1);background-color:var(--color-bg-popup)}.arco-select-popup .arco-select-option-hover{color:var(--color-text-1);background-color:var(--color-fill-2)}.arco-select-popup .arco-select-option-disabled{color:var(--color-text-4);background-color:var(--color-bg-popup)}.arco-select-popup .arco-select-option-disabled{cursor:not-allowed}.arco-select-popup .arco-select-option-selected{font-weight:500}.arco-select-popup .arco-select-option-empty{height:36px}.arco-select-popup .arco-select-option-rtl{text-align:right}.arco-select-option-wrapper{display:flex;align-items:center;padding:0 7px}.arco-select-option-wrapper .arco-select-checkbox{padding:0 5px}.arco-select-option-wrapper .arco-select-checkbox input{display:none}.arco-select-option-wrapper .arco-select-option{flex:1;margin-left:1px;padding:0 4px;border-radius:var(--border-radius-small)}.arco-select-group-title{box-sizing:border-box;width:100%;padding:8px 12px 0 12px;line-height:20px;font-size:12px;color:var(--color-text-3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.arco-select-group-title:first-child{padding-top:4px}.arco-select-highlight{font-weight:500;color:var(--color-text-1)}.arco-select-rtl{direction:rtl}.arco-select-rtl.arco-select-size-mini.arco-select-multiple .arco-select-view-with-prefix{padding-left:0;padding-right:7px}.arco-select-rtl.arco-select-size-mini.arco-select-multiple .arco-select-suffix{padding-right:0;padding-left:4px}.arco-select-rtl.arco-select-size-mini.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-rtl.arco-select-size-mini.arco-select-multiple .arco-input-tag-has-placeholder input{padding-left:0;padding-right:4px}.arco-select-rtl.arco-select-size-small.arco-select-multiple .arco-select-view-with-prefix{padding-left:0;padding-right:11px}.arco-select-rtl.arco-select-size-small.arco-select-multiple .arco-select-suffix{padding-right:0;padding-left:8px}.arco-select-rtl.arco-select-size-small.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-rtl.arco-select-size-small.arco-select-multiple .arco-input-tag-has-placeholder input{padding-left:0;padding-right:8px}.arco-select-rtl.arco-select-size-default.arco-select-multiple .arco-select-view-with-prefix{padding-left:0;padding-right:11px}.arco-select-rtl.arco-select-size-default.arco-select-multiple .arco-select-suffix{padding-right:0;padding-left:8px}.arco-select-rtl.arco-select-size-default.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-rtl.arco-select-size-default.arco-select-multiple .arco-input-tag-has-placeholder input{padding-left:0;padding-right:8px}.arco-select-rtl.arco-select-size-large.arco-select-multiple .arco-select-view-with-prefix{padding-left:0;padding-right:15px}.arco-select-rtl.arco-select-size-large.arco-select-multiple .arco-select-suffix{padding-right:0;padding-left:12px}.arco-select-rtl.arco-select-size-large.arco-select-multiple .arco-input-tag-has-placeholder .arco-input-tag-input-mirror,.arco-select-rtl.arco-select-size-large.arco-select-multiple .arco-input-tag-has-placeholder input{padding-left:0;padding-right:12px}.arco-select-wrapper-rtl .arco-select-addbefore{border-right:unset;border-left:1px solid var(--color-border-2)}.arco-select-rtl .arco-select-view{text-align:right}.arco-select-rtl .arco-select-multiple .arco-select-view-with-prefix{padding-left:0;padding-right:12px}.arco-select-rtl .arco-select-prefix{margin-right:0;margin-left:12px}.arco-select-rtl .arco-select-suffix{margin-left:0;margin-right:4px}