UNPKG

lixin-web

Version:

vue and bootstrap

1,440 lines (1,414 loc) 34.4 kB
.el-transfer-panel .el-transfer-panel__footer:after{ display: inline-block; content: ""; height: 100%; vertical-align: middle; } .el-button-group:before, .el-button-group:after{ display: table; content: ""; } .el-button-group:after{ clear: both; }@charset "UTF-8"; :root{ /* Transition -------------------------- */ /* Colors -------------------------- */ /* Link -------------------------- */ /* Border -------------------------- */ /* Box-shadow -------------------------- */ /* Fill -------------------------- */ /* Font -------------------------- */ /* Size -------------------------- */ /* z-index -------------------------- */ /* Disable base -------------------------- */ /* Icon -------------------------- */ /* Checkbox -------------------------- */ /* Radio -------------------------- */ /* Select -------------------------- */ /* Alert -------------------------- */ /* Message Box -------------------------- */ /* Message -------------------------- */ /* Notification -------------------------- */ /* Input -------------------------- */ /* Cascader -------------------------- */ /* Group -------------------------- */ /* Tab -------------------------- */ /* Button -------------------------- */ /* cascader -------------------------- */ /* Switch -------------------------- */ /* Dialog -------------------------- */ /* Table -------------------------- */ /* Pagination -------------------------- */ /* Popover -------------------------- */ /* Tooltip -------------------------- */ /* Tag -------------------------- */ /* Dropdown -------------------------- */ /* Badge -------------------------- */ /* Card --------------------------*/ /* Slider --------------------------*/ /* Steps --------------------------*/ /* Menu --------------------------*/ /* Rate --------------------------*/ /* DatePicker --------------------------*/ /* Loading --------------------------*/ /* Scrollbar --------------------------*/ /* Carousel --------------------------*/ /* Collapse --------------------------*/ /* Transfer --------------------------*/ } @charset "UTF-8"; :root{ /* Transition -------------------------- */ /* Colors -------------------------- */ /* Link -------------------------- */ /* Border -------------------------- */ /* Box-shadow -------------------------- */ /* Fill -------------------------- */ /* Font -------------------------- */ /* Size -------------------------- */ /* z-index -------------------------- */ /* Disable base -------------------------- */ /* Icon -------------------------- */ /* Checkbox -------------------------- */ /* Radio -------------------------- */ /* Select -------------------------- */ /* Alert -------------------------- */ /* Message Box -------------------------- */ /* Message -------------------------- */ /* Notification -------------------------- */ /* Input -------------------------- */ /* Cascader -------------------------- */ /* Group -------------------------- */ /* Tab -------------------------- */ /* Button -------------------------- */ /* cascader -------------------------- */ /* Switch -------------------------- */ /* Dialog -------------------------- */ /* Table -------------------------- */ /* Pagination -------------------------- */ /* Popover -------------------------- */ /* Tooltip -------------------------- */ /* Tag -------------------------- */ /* Dropdown -------------------------- */ /* Badge -------------------------- */ /* Card --------------------------*/ /* Slider --------------------------*/ /* Steps --------------------------*/ /* Menu --------------------------*/ /* Rate --------------------------*/ /* DatePicker --------------------------*/ /* Loading --------------------------*/ /* Scrollbar --------------------------*/ /* Carousel --------------------------*/ /* Collapse --------------------------*/ /* Transfer --------------------------*/ } .el-input{ position: relative; font-size: 14px; display: inline-block; width: 100%; } .el-input.is-disabled .el-input__inner{ background-color: rgb(238, 242, 246); border-color: rgb(209, 221, 229); color: #bbb; cursor: not-allowed; } .el-input.is-disabled .el-input__inner::-webkit-input-placeholder{ color: #d5d5d5; } .el-input.is-disabled .el-input__inner:-ms-input-placeholder{ color: #d5d5d5; } .el-input.is-disabled .el-input__inner::placeholder{ color: #d5d5d5; } .el-input.is-active .el-input__inner{ outline: none; border-color: #2ba7e7; } .el-input__inner{ -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: #fff; background-image: none; border-radius: 2px; border: 1px solid #d5d5d5; box-sizing: border-box; color: rgb(31, 48, 61); display: inline-block; font-size: inherit; height: 31px; line-height: 1; outline: none; padding: 3px 10px; transition: border-color .2s cubic-bezier(.645,.045,.355,1); width: 100%; } .el-input__inner::-webkit-input-placeholder{ color: #999; } .el-input__inner:-ms-input-placeholder{ color: #999; } .el-input__inner::placeholder{ color: #999; } .el-input__inner:hover{ border-color: rgba(43, 167, 231, 0.5); } .el-input__inner:focus{ outline: none; border-color: #2ba7e7; } .el-input__icon{ position: absolute; width: 35px; height: 100%; right: 0; top: 0; text-align: center; color: #d5d5d5; transition: all .3s; } .el-input__icon:after{ content: ''; height: 100%; width: 0; display: inline-block; vertical-align: middle; } .el-input__icon + .el-input__inner{ padding-right: 35px; } .el-input__icon.is-clickable{} .el-input__icon.is-clickable:hover{ cursor: pointer; color: rgba(43, 167, 231, 0.5); } .el-input__icon.is-clickable:hover + .el-input__inner{ border-color: rgba(43, 167, 231, 0.5); } .el-input--large{ font-size: 16px; } .el-input--large .el-input__inner{ height: 42px; } .el-input--small{ font-size: 13px; } .el-input--small .el-input__inner{ height: 30px; } .el-input--mini{ font-size: 12px; } .el-input--mini .el-input__inner{ height: 22px; } .el-input-group{ line-height: normal; display: inline-table; width: 100%; border-collapse: separate; } .el-input-group > .el-input__inner{ vertical-align: middle; display: table-cell; } .el-input-group__append, .el-input-group__prepend{ background-color: rgb(251, 253, 255); color: rgb(151, 171, 190); vertical-align: middle; display: table-cell; position: relative; border: 1px solid #d5d5d5; border-radius: 2px; padding: 0 10px; width: 1px; white-space: nowrap; } .el-input-group__append .el-select, .el-input-group__append .el-button, .el-input-group__prepend .el-select, .el-input-group__prepend .el-button{ display: block; margin: -10px; } .el-input-group__append button.el-button, .el-input-group__append div.el-select .el-input__inner, .el-input-group__append div.el-select:hover .el-input__inner, .el-input-group__prepend button.el-button, .el-input-group__prepend div.el-select .el-input__inner, .el-input-group__prepend div.el-select:hover .el-input__inner{ border-color: transparent; background-color: transparent; color: inherit; border-top: 0; border-bottom: 0; } .el-input-group__append .el-button, .el-input-group__append .el-input, .el-input-group__prepend .el-button, .el-input-group__prepend .el-input{ font-size: inherit; } .el-input-group__prepend{ border-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } .el-input-group__append{ border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; } .el-input-group--prepend .el-input__inner{ border-top-left-radius: 0; border-bottom-left-radius: 0; } .el-input-group--append .el-input__inner{ border-top-right-radius: 0; border-bottom-right-radius: 0; } .el-textarea{ display: inline-block; width: 100%; vertical-align: bottom; } .el-textarea.is-disabled .el-textarea__inner{ background-color: rgb(238, 242, 246); border-color: rgb(209, 221, 229); color: #bbb; cursor: not-allowed; } .el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder{ color: #d5d5d5; } .el-textarea.is-disabled .el-textarea__inner:-ms-input-placeholder{ color: #d5d5d5; } .el-textarea.is-disabled .el-textarea__inner::placeholder{ color: #d5d5d5; } .el-textarea__inner{ display: block; resize: vertical; padding: 5px 7px; line-height: 1.5; box-sizing: border-box; width: 100%; font-size: 14px; color: rgb(31, 48, 61); background-color: #fff; background-image: none; border: 1px solid #d5d5d5; border-radius: 2px; transition: border-color .2s cubic-bezier(.645,.045,.355,1); } .el-textarea__inner::-webkit-input-placeholder{ color: #999; } .el-textarea__inner:-ms-input-placeholder{ color: #999; } .el-textarea__inner::placeholder{ color: #999; } .el-textarea__inner:hover{ border-color: rgba(43, 167, 231, 0.5); } .el-textarea__inner:focus{ outline: none; border-color: #2ba7e7; } @charset "UTF-8"; :root{ /* Transition -------------------------- */ /* Colors -------------------------- */ /* Link -------------------------- */ /* Border -------------------------- */ /* Box-shadow -------------------------- */ /* Fill -------------------------- */ /* Font -------------------------- */ /* Size -------------------------- */ /* z-index -------------------------- */ /* Disable base -------------------------- */ /* Icon -------------------------- */ /* Checkbox -------------------------- */ /* Radio -------------------------- */ /* Select -------------------------- */ /* Alert -------------------------- */ /* Message Box -------------------------- */ /* Message -------------------------- */ /* Notification -------------------------- */ /* Input -------------------------- */ /* Cascader -------------------------- */ /* Group -------------------------- */ /* Tab -------------------------- */ /* Button -------------------------- */ /* cascader -------------------------- */ /* Switch -------------------------- */ /* Dialog -------------------------- */ /* Table -------------------------- */ /* Pagination -------------------------- */ /* Popover -------------------------- */ /* Tooltip -------------------------- */ /* Tag -------------------------- */ /* Dropdown -------------------------- */ /* Badge -------------------------- */ /* Card --------------------------*/ /* Slider --------------------------*/ /* Steps --------------------------*/ /* Menu --------------------------*/ /* Rate --------------------------*/ /* DatePicker --------------------------*/ /* Loading --------------------------*/ /* Scrollbar --------------------------*/ /* Carousel --------------------------*/ /* Collapse --------------------------*/ /* Transfer --------------------------*/ } .el-button{ display: inline-block; line-height: 1; white-space: nowrap; cursor: pointer; background: #fff; border: 1px solid #d5d5d5; border-color: #c4c4c4; color: rgb(31, 48, 61); -webkit-appearance: none; text-align: center; box-sizing: border-box; outline: none; margin: 0; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; padding: 8px 15px; font-size: 14px; border-radius: 4px; } .el-button + .el-button{ margin-left: 10px; } .el-button:hover, .el-button:focus{ color: #2ba7e7; border-color: #2ba7e7; } .el-button:active{ color: rgb(39, 150, 208); border-color: rgb(39, 150, 208); outline: none; } .el-button::-moz-focus-inner{ border: 0; } .el-button [class*="el-icon-"]{} .el-button [class*="el-icon-"] + span{ margin-left: 5px; } .el-button.is-loading{ position: relative; pointer-events: none; } .el-button.is-loading:before{ pointer-events: none; content: ''; position: absolute; left: -1px; top: -1px; right: -1px; bottom: -1px; border-radius: inherit; background-color: rgba(255,255,255,.35); } .el-button.is-disabled{} .el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus{ color: #d5d5d5; cursor: not-allowed; background-image: none; background-color: rgb(238, 242, 246); border-color: rgb(209, 221, 229); } .el-button.is-disabled.el-button--text{ background-color: transparent; } .el-button.is-disabled.is-plain{} .el-button.is-disabled.is-plain, .el-button.is-disabled.is-plain:hover, .el-button.is-disabled.is-plain:focus{ background-color: #fff; border-color: rgb(209, 221, 229); color: #d5d5d5; } .el-button.is-active{ color: rgb(39, 150, 208); border-color: rgb(39, 150, 208); } .el-button.is-plain{} .el-button.is-plain:hover, .el-button.is-plain:focus{ background: #fff; border-color: #2ba7e7; color: #2ba7e7; } .el-button.is-plain:active{ background: #fff; border-color: rgb(39, 150, 208); color: rgb(39, 150, 208); outline: none; } .el-button--primary{ color: #fff; background-color: #2ba7e7; border-color: #2ba7e7; } .el-button--primary:hover, .el-button--primary:focus{ background: rgb(85, 185, 236); border-color: rgb(85, 185, 236); color: #fff; } .el-button--primary:active{ background: rgb(39, 150, 208); border-color: rgb(39, 150, 208); color: #fff; outline: none; } .el-button--primary.is-active{ background: rgb(39, 150, 208); border-color: rgb(39, 150, 208); color: #fff; } .el-button--primary.is-plain{ background: #fff; border: 1px solid #d5d5d5; color: rgb(31, 48, 61); } .el-button--primary.is-plain:hover, .el-button--primary.is-plain:focus{ background: #fff; border-color: #2ba7e7; color: #2ba7e7; } .el-button--primary.is-plain:active{ background: #fff; border-color: rgb(39, 150, 208); color: rgb(39, 150, 208); outline: none; } .el-button--success{ color: #fff; background-color: #78d640; border-color: #78d640; } .el-button--success:hover, .el-button--success:focus{ background: rgb(147, 222, 102); border-color: rgb(147, 222, 102); color: #fff; } .el-button--success:active{ background: rgb(108, 193, 58); border-color: rgb(108, 193, 58); color: #fff; outline: none; } .el-button--success.is-active{ background: rgb(108, 193, 58); border-color: rgb(108, 193, 58); color: #fff; } .el-button--success.is-plain{ background: #fff; border: 1px solid #d5d5d5; color: rgb(31, 48, 61); } .el-button--success.is-plain:hover, .el-button--success.is-plain:focus{ background: #fff; border-color: #78d640; color: #78d640; } .el-button--success.is-plain:active{ background: #fff; border-color: rgb(108, 193, 58); color: rgb(108, 193, 58); outline: none; } .el-button--warning{ color: #fff; background-color: #64c4c9; border-color: #64c4c9; } .el-button--warning:hover, .el-button--warning:focus{ background: rgb(131, 208, 212); border-color: rgb(131, 208, 212); color: #fff; } .el-button--warning:active{ background: rgb(90, 176, 181); border-color: rgb(90, 176, 181); color: #fff; outline: none; } .el-button--warning.is-active{ background: rgb(90, 176, 181); border-color: rgb(90, 176, 181); color: #fff; } .el-button--warning.is-plain{ background: #fff; border: 1px solid #d5d5d5; color: rgb(31, 48, 61); } .el-button--warning.is-plain:hover, .el-button--warning.is-plain:focus{ background: #fff; border-color: #64c4c9; color: #64c4c9; } .el-button--warning.is-plain:active{ background: #fff; border-color: rgb(90, 176, 181); color: rgb(90, 176, 181); outline: none; } .el-button--danger{ color: #fff; background-color: #fe5307; border-color: #fe5307; } .el-button--danger:hover, .el-button--danger:focus{ background: rgb(254, 117, 57); border-color: rgb(254, 117, 57); color: #fff; } .el-button--danger:active{ background: rgb(229, 75, 6); border-color: rgb(229, 75, 6); color: #fff; outline: none; } .el-button--danger.is-active{ background: rgb(229, 75, 6); border-color: rgb(229, 75, 6); color: #fff; } .el-button--danger.is-plain{ background: #fff; border: 1px solid #d5d5d5; color: rgb(31, 48, 61); } .el-button--danger.is-plain:hover, .el-button--danger.is-plain:focus{ background: #fff; border-color: #fe5307; color: #fe5307; } .el-button--danger.is-plain:active{ background: #fff; border-color: rgb(229, 75, 6); color: rgb(229, 75, 6); outline: none; } .el-button--info{ color: #fff; background-color: #d7a1e9; border-color: #d7a1e9; } .el-button--info:hover, .el-button--info:focus{ background: rgb(223, 180, 237); border-color: rgb(223, 180, 237); color: #fff; } .el-button--info:active{ background: rgb(194, 145, 210); border-color: rgb(194, 145, 210); color: #fff; outline: none; } .el-button--info.is-active{ background: rgb(194, 145, 210); border-color: rgb(194, 145, 210); color: #fff; } .el-button--info.is-plain{ background: #fff; border: 1px solid #d5d5d5; color: rgb(31, 48, 61); } .el-button--info.is-plain:hover, .el-button--info.is-plain:focus{ background: #fff; border-color: #d7a1e9; color: #d7a1e9; } .el-button--info.is-plain:active{ background: #fff; border-color: rgb(194, 145, 210); color: rgb(194, 145, 210); outline: none; } .el-button--large{ padding: 11px 19px; font-size: 16px; border-radius: 4px; } .el-button--small{ padding: 7px 9px; font-size: 12px; border-radius: 4px; } .el-button--mini{ padding: 4px 4px; font-size: 12px; border-radius: 4px; } .el-button--text{ border: none; color: #2ba7e7; background: transparent; padding-left: 0; padding-right: 0; } .el-button--text:hover, .el-button--text:focus{ color: rgb(85, 185, 236); } .el-button--text:active{ color: rgb(39, 150, 208); } .el-button-group{ display: inline-block; vertical-align: middle; } .el-button-group .el-button--primary{} .el-button-group .el-button--primary:first-child{ border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--primary:last-child{ border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--primary:not(:first-child):not(:last-child){ border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--success{} .el-button-group .el-button--success:first-child{ border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--success:last-child{ border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--success:not(:first-child):not(:last-child){ border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--warning{} .el-button-group .el-button--warning:first-child{ border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--warning:last-child{ border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--warning:not(:first-child):not(:last-child){ border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--danger{} .el-button-group .el-button--danger:first-child{ border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--danger:last-child{ border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--danger:not(:first-child):not(:last-child){ border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--info{} .el-button-group .el-button--info:first-child{ border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--info:last-child{ border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--info:not(:first-child):not(:last-child){ border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button{ float: left; position: relative; } .el-button-group .el-button + .el-button{ margin-left: 0; } .el-button-group .el-button:first-child{ border-top-right-radius: 0; border-bottom-right-radius: 0; } .el-button-group .el-button:last-child{ border-top-left-radius: 0; border-bottom-left-radius: 0; } .el-button-group .el-button:not(:first-child):not(:last-child){ border-radius: 0; } .el-button-group .el-button:not(:last-child){ margin-right: -1px; } .el-button-group .el-button:hover, .el-button-group .el-button:focus, .el-button-group .el-button:active{ z-index: 1; } .el-button-group .el-button.is-active{ z-index: 1; } @charset "UTF-8"; :root{ /* Transition -------------------------- */ /* Colors -------------------------- */ /* Link -------------------------- */ /* Border -------------------------- */ /* Box-shadow -------------------------- */ /* Fill -------------------------- */ /* Font -------------------------- */ /* Size -------------------------- */ /* z-index -------------------------- */ /* Disable base -------------------------- */ /* Icon -------------------------- */ /* Checkbox -------------------------- */ /* Radio -------------------------- */ /* Select -------------------------- */ /* Alert -------------------------- */ /* Message Box -------------------------- */ /* Message -------------------------- */ /* Notification -------------------------- */ /* Input -------------------------- */ /* Cascader -------------------------- */ /* Group -------------------------- */ /* Tab -------------------------- */ /* Button -------------------------- */ /* cascader -------------------------- */ /* Switch -------------------------- */ /* Dialog -------------------------- */ /* Table -------------------------- */ /* Pagination -------------------------- */ /* Popover -------------------------- */ /* Tooltip -------------------------- */ /* Tag -------------------------- */ /* Dropdown -------------------------- */ /* Badge -------------------------- */ /* Card --------------------------*/ /* Slider --------------------------*/ /* Steps --------------------------*/ /* Menu --------------------------*/ /* Rate --------------------------*/ /* DatePicker --------------------------*/ /* Loading --------------------------*/ /* Scrollbar --------------------------*/ /* Carousel --------------------------*/ /* Collapse --------------------------*/ /* Transfer --------------------------*/ } .el-checkbox{ color: rgb(31, 48, 61); position: relative; cursor: pointer; display: inline-block; white-space: nowrap; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } .el-checkbox + .el-checkbox{ margin-left: 15px; } .el-checkbox__input{ white-space: nowrap; cursor: pointer; outline: none; display: inline-block; line-height: 1; position: relative; vertical-align: middle; } .el-checkbox__input.is-indeterminate .el-checkbox__inner{ background-color: #2ba7e7; border-color: rgb(1, 166, 249); } .el-checkbox__input.is-indeterminate .el-checkbox__inner::before{ content: ''; position: absolute; display: block; border: 1px solid #fff; margin-top: -1px; left: 3px; right: 3px; top: 50%; } .el-checkbox__input.is-indeterminate .el-checkbox__inner::after{ display: none; } .el-checkbox__input.is-focus .el-checkbox__inner{ border-color: #2ba7e7; } .el-checkbox__input.is-checked .el-checkbox__inner{ background-color: #2ba7e7; border-color: rgb(1, 166, 249); } .el-checkbox__input.is-checked .el-checkbox__inner::after{ transform: rotate(45deg) scaleY(1); } .el-checkbox__input.is-disabled .el-checkbox__inner{ background-color: rgb(238, 242, 246); border-color: rgb(209, 221, 229); cursor: not-allowed; } .el-checkbox__input.is-disabled .el-checkbox__inner::after{ cursor: not-allowed; border-color: rgb(238, 242, 246); } .el-checkbox__input.is-disabled .el-checkbox__inner + .el-checkbox__label{ cursor: not-allowed; } .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner{ background-color: rgb(209, 221, 229); border-color: rgb(209, 221, 229); } .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{ border-color: #fff; } .el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner{ background-color: rgb(209, 221, 229); border-color: rgb(209, 221, 229); } .el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before{ border-color: #fff; } .el-checkbox__input.is-disabled + .el-checkbox__label{ color: #bbb; cursor: not-allowed; } .el-checkbox__inner{ display: inline-block; position: relative; border: 1px solid #d5d5d5; border-radius: 100%; box-sizing: border-box; width: 18px; height: 18px; background-color: #fff; z-index: 1; transition: border-color .25s cubic-bezier(.71,-.46,.29,1.46), background-color .25s cubic-bezier(.71,-.46,.29,1.46); } .el-checkbox__inner:hover{ border-color: #2ba7e7; } .el-checkbox__inner::after{ box-sizing: content-box; content: ""; border: 2px solid #fff; border-left: 0; border-top: 0; height: 8px; left: 5px; position: absolute; top: 1px; transform: rotate(45deg) scaleY(0); width: 4px; transition: transform .15s cubic-bezier(.71,-.46,.88,.6) .05s; transform-origin: center; } .el-checkbox__original{ opacity: 0; outline: none; position: absolute; margin: 0; width: 0; height: 0; left: -999px; } .el-checkbox__label{ font-size: 14px; padding-left: 5px; } .el-checkbox-button{ position: relative; display: inline-block; } .el-checkbox-button.is-checked{} .el-checkbox-button.is-checked .el-checkbox-button__inner{ color: #fff; background-color: #2ba7e7; border-color: #2ba7e7; box-shadow: -1px 0 0 0 #2ba7e7; } .el-checkbox-button.is-disabled{} .el-checkbox-button.is-disabled .el-checkbox-button__inner{ color: #d5d5d5; cursor: not-allowed; background-image: none; background-color: rgb(238, 242, 246); border-color: rgb(209, 221, 229); box-shadow: none; } .el-checkbox-button.is-focus{} .el-checkbox-button.is-focus .el-checkbox-button__inner{ border-color: #2ba7e7; } .el-checkbox-button:first-child .el-checkbox-button__inner{ border-left: 1px solid #d5d5d5; border-radius: 4px 0 0 4px; box-shadow: none !important; } .el-checkbox-button:last-child .el-checkbox-button__inner{ border-radius: 0 4px 4px 0; } .el-checkbox-button__inner{ display: inline-block; line-height: 1; white-space: nowrap; vertical-align: middle; cursor: pointer; background: #fff; border: 1px solid #d5d5d5; border-left: 0; color: rgb(31, 48, 61); -webkit-appearance: none; text-align: center; box-sizing: border-box; outline: none; margin: 0; position: relative; cursor: pointer; transition: all .3s cubic-bezier(.645,.045,.355,1); -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; padding: 8px 15px; font-size: 14px; border-radius: 0; } .el-checkbox-button__inner:hover{ color: #2ba7e7; } .el-checkbox-button__inner [class*="el-icon-"]{ line-height: 0.9; } .el-checkbox-button__inner [class*="el-icon-"] + span{ margin-left: 5px; } .el-checkbox-button__original{ opacity: 0; outline: none; position: absolute; margin: 0; visibility: hidden; left: -999px; } .el-checkbox-button--large{} .el-checkbox-button--large .el-checkbox-button__inner{ padding: 11px 19px; font-size: 16px; border-radius: 0; } .el-checkbox-button--small{} .el-checkbox-button--small .el-checkbox-button__inner{ padding: 7px 9px; font-size: 12px; border-radius: 0; } .el-checkbox-button--mini{} .el-checkbox-button--mini .el-checkbox-button__inner{ padding: 4px 4px; font-size: 12px; border-radius: 0; } .el-transfer{ font-size: 14px; } .el-transfer__buttons{ display: inline-block; vertical-align: middle; padding: 0 10px; } .el-transfer__buttons .el-button { display: block; margin: 0 auto; padding: 8px 12px } .el-transfer__buttons .el-button:first-child{ margin-bottom: 6px; } .el-transfer__buttons .el-button [class*="el-icon-"] + span { margin-left: 0; } .el-transfer-panel{ border: 1px solid rgb(209, 221, 229); background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); display: inline-block; vertical-align: middle; width: 200px; box-sizing: border-box; position: relative; } .el-transfer-panel .el-transfer-panel__header{ height: 36px; line-height: 36px; background: rgb(251, 253, 255); margin: 0; padding-left: 20px; border-bottom: 1px solid rgb(209, 221, 229); box-sizing: border-box; color: rgb(31, 48, 61); } .el-transfer-panel .el-transfer-panel__footer{ height: 36px; background: #fff; margin: 0; padding: 0; border-top: 1px solid rgb(209, 221, 229); position: absolute; bottom: 0; left: 0; width: 100%; z-index: 1; } .el-transfer-panel .el-transfer-panel__footer .el-checkbox{ padding-left: 20px; color: rgb(131, 148, 165); } .el-transfer-panel .el-transfer-panel__empty{ margin: 0; height: 32px; line-height: 32px; padding: 6px 20px 0; color: rgb(131, 148, 165); } .el-transfer-panel .el-checkbox__label{ padding-left: 14px; } .el-transfer-panel .el-checkbox__inner{ width: 14px; height: 14px; border-radius: 3px } .el-transfer-panel .el-checkbox__inner::after{ height: 6px; width: 3px; left: 4px; } .el-transfer-panel__body{ padding-bottom: 36px; height: 246px; } .el-transfer-panel__list{ margin: 0; padding: 6px 0; list-style: none; height: 246px; overflow: auto; box-sizing: border-box; } .el-transfer-panel__list.is-filterable{ height: 214px; } .el-transfer-panel__item{ height: 32px; line-height: 32px; padding-left: 20px; display: block; } .el-transfer-panel__item .el-checkbox__label { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; box-sizing: border-box; padding-left: 28px; } .el-transfer-panel__item .el-checkbox__input { position: absolute; top: 9px; } .el-transfer-panel__item + .el-transfer-panel__item{ margin-left: 0; } .el-transfer-panel__item.el-checkbox{ color: rgb(72, 90, 106); } .el-transfer-panel__item:hover{ background: #eff8f9; } .el-transfer-panel__filter{ margin-top: 10px; text-align: center; padding: 0 10px; width: 100%; box-sizing: border-box; } .el-transfer-panel__filter .el-input__inner { height: 22px; width: 100%; display: inline-block; box-sizing: border-box; } .el-transfer-panel__filter .el-input__icon { right: 10px; } .el-transfer-panel__filter .el-icon-circle-close { cursor: pointer; } :root{ /* Transition -------------------------- */ /* Colors -------------------------- */ /* Link -------------------------- */ /* Border -------------------------- */ /* Box-shadow -------------------------- */ /* Fill -------------------------- */ /* Font -------------------------- */ /* Size -------------------------- */ /* z-index -------------------------- */ /* Disable base -------------------------- */ /* Icon -------------------------- */ /* Checkbox -------------------------- */ /* Radio -------------------------- */ /* Select -------------------------- */ /* Alert -------------------------- */ /* Message Box -------------------------- */ /* Message -------------------------- */ /* Notification -------------------------- */ /* Input -------------------------- */ /* Cascader -------------------------- */ /* Group -------------------------- */ /* Tab -------------------------- */ /* Button -------------------------- */ /* cascader -------------------------- */ /* Switch -------------------------- */ /* Dialog -------------------------- */ /* Table -------------------------- */ /* Pagination -------------------------- */ /* Popover -------------------------- */ /* Tooltip -------------------------- */ /* Tag -------------------------- */ /* Dropdown -------------------------- */ /* Badge -------------------------- */ /* Card --------------------------*/ /* Slider --------------------------*/ /* Steps --------------------------*/ /* Steps --------------------------*/ /* Rate --------------------------*/ /* DatePicker --------------------------*/ /* Loading --------------------------*/ /* Scrollbar --------------------------*/ /* Carousel --------------------------*/ /* Collapse --------------------------*/ }