diff --git a/src/assets/message_Success.png b/src/assets/message_Success.png new file mode 100644 index 0000000..1501b93 Binary files /dev/null and b/src/assets/message_Success.png differ diff --git a/src/assets/message_Warning.png b/src/assets/message_Warning.png new file mode 100644 index 0000000..cb788df Binary files /dev/null and b/src/assets/message_Warning.png differ diff --git a/src/assets/message_error.png b/src/assets/message_error.png new file mode 100644 index 0000000..915ca8c Binary files /dev/null and b/src/assets/message_error.png differ diff --git a/src/components/Footer.vue b/src/components/Footer.vue index 1898e67..e88aed8 100644 --- a/src/components/Footer.vue +++ b/src/components/Footer.vue @@ -10,10 +10,10 @@ display: flex; align-items: center; justify-content: center; - color: #626573 + color: #626573; a{ text-decoration: none; - color: #006AFF; + color: #006AFF !important; } } \ No newline at end of file diff --git a/src/components/GuipMessage/GuipMessage.vue b/src/components/GuipMessage/GuipMessage.vue new file mode 100644 index 0000000..256bead --- /dev/null +++ b/src/components/GuipMessage/GuipMessage.vue @@ -0,0 +1,170 @@ + + + + + \ No newline at end of file diff --git a/src/components/GuipMessage/index.js b/src/components/GuipMessage/index.js new file mode 100644 index 0000000..3df7a0d --- /dev/null +++ b/src/components/GuipMessage/index.js @@ -0,0 +1,94 @@ +import Vue from 'vue' +import GuipMessage from './GuipMessage.vue' + +// 默认图标配置 +const defaultIcons = { + success: 'icon-success', // 替换为你的图标类名 + info: 'icon-info', + warning: 'icon-warning', + error: 'icon-error' +} + +// 默认图片配置 +const defaultImages = { + success: require('@/assets/message_Success.png'), + info: require('@/assets/message_Warning.png'), + warning: require('@/assets/message_Warning.png'), + error: require('@/assets/message_error.png') +} +const MessageConstructor = Vue.extend(GuipMessage) + +// let messageInstance = null +let messageQueue = [] + +function showMessage(options) { + if (typeof options === 'string') { + options = { + message: options + } + } + + // 合并默认配置 + const config = { + type: 'info', + duration: 3000, + position: 'top-center', + showImage: true, + ...options + } + + // 设置图标或图片 + if (config.showImage) { + config.imageUrl = options.imageUrl || defaultImages[config.type] + } else { + config.iconClass = options.iconClass || defaultIcons[config.type] + } + + // 创建实例 + const instance = new MessageConstructor({ + propsData: config + }) + + // 挂载到DOM + instance.$mount() + document.body.appendChild(instance.$el) + + // 添加到队列 + messageQueue.push(instance) + + // 返回关闭方法 + return { + close: () => instance.close() + } +} + +function install(Vue, options = {}) { + // 合并默认配置 + if (options.icons) { + Object.assign(defaultIcons, options.icons) + } + if (options.images) { + Object.assign(defaultImages, options.images) + } + + // 添加全局方法 + Vue.prototype.$Message = showMessage + Vue.prototype.$Message.closeAll = () => { + messageQueue.forEach(instance => instance.close()) + messageQueue = [] + } + + // 添加快捷方法 + const types = ['success', 'info', 'warning', 'error'] + types.forEach(type => { + Vue.prototype.$Message[type] = (message, options = {}) => { + return showMessage({ + message, + type, + ...options + }) + } + }) +} + +export default { install } \ No newline at end of file diff --git a/src/main.js b/src/main.js index d2936cd..8c8b650 100755 --- a/src/main.js +++ b/src/main.js @@ -9,12 +9,14 @@ import './style/theme/index.css' import './style/theme/common.scss' import 'core-js/stable'; import 'regenerator-runtime/runtime'; -import LoadingService from './services/loading' +import LoadingService from './services/loading'; import { directive as clickaway } from 'vue-clickaway'; -Vue.prototype.$loadingFn = LoadingService -Vue.config.productionTip = false +import GuipMessage from '@/components/GuipMessage/index'; +Vue.prototype.$loadingFn = LoadingService; +Vue.config.productionTip = false; Vue.prototype.$http = request; Vue.use(ElementUI); +Vue.use(GuipMessage) Vue.directive('clickaway', clickaway); new Vue({ diff --git a/src/style/theme/common.scss b/src/style/theme/common.scss index dcea642..27132cb 100644 --- a/src/style/theme/common.scss +++ b/src/style/theme/common.scss @@ -279,6 +279,7 @@ body { background: #FFFFFF; border: 1px solid #006AFF; &:hover{ + color: #006AFF; background: #F2F7FF; border: 1px solid #006AFF; } @@ -308,11 +309,12 @@ body { border: 1px solid #DFE2E6; &:hover{ background: #FFFFFF; + color: #006AFF; border: 1px solid #006AFF; } } .el-button--medium.is-disabled .el-button--ignore.is-disabled{ - background: #F2F3F5; + background: #F2F3F5 ; border: 1px solid #F2F3F5; color: #626573; } diff --git a/src/style/theme/index.css b/src/style/theme/index.css index f8cdf3e..5c92b63 100644 --- a/src/style/theme/index.css +++ b/src/style/theme/index.css @@ -3794,12 +3794,12 @@ padding: 12px 20px } -.el-button:focus, +/* .el-button:focus, .el-button:hover { color: #006aff; border-color: #b3d2ff; background-color: #e6f0ff -} +} */ .el-button:active { color: #005fe6; @@ -8298,4513 +8298,4591 @@ transform: translate(0, .5px) } -.el-button { - display: inline-block; - line-height: 1; - white-space: nowrap; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-color: #dfe2e6; + + +.el-checkbox { color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - -webkit-transition: .1s; - transition: .1s; font-weight: 500; - -moz-user-select: none; + font-size: 14px; + position: relative; + cursor: pointer; + display: inline-block; + white-space: nowrap; -webkit-user-select: none; + -moz-user-select: none; -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 4px + user-select: none; + margin-right: 30px } -.el-button+.el-button { - margin-left: 10px +.el-checkbox.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: normal; + height: 40px } -.el-button.is-round { - padding: 12px 20px +.el-checkbox.is-bordered.is-checked { + border-color: #006aff } -.el-button:focus, -.el-button:hover { - color: #006aff; - border-color: #b3d2ff; - background-color: #e6f0ff +.el-checkbox.is-bordered.is-disabled { + border-color: #ebeef5; + cursor: not-allowed } -.el-button:active { - color: #005fe6; - border-color: #005fe6; - outline: 0 +.el-checkbox.is-bordered+.el-checkbox.is-bordered { + margin-left: 10px } -.el-button::-moz-focus-inner { - border: 0 +.el-checkbox.is-bordered.el-checkbox--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px } -.el-button [class*=el-icon-]+span { - margin-left: 5px +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { + line-height: 17px; + font-size: 14px } -.el-button.is-plain:focus, -.el-button.is-plain:hover { - background: #fff; - border-color: #006aff; - color: #006aff +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { + height: 14px; + width: 14px } -.el-button.is-plain:active { - background: #fff; - border-color: #005fe6; - color: #005fe6; - outline: 0 +.el-checkbox.is-bordered.el-checkbox--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px } -.el-button.is-active { - color: #005fe6; - border-color: #005fe6 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { + line-height: 15px; + font-size: 12px } -.el-button.is-disabled, -.el-button.is-disabled:focus, -.el-button.is-disabled:hover { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { + height: 12px; + width: 12px } -.el-button.is-disabled.el-button--text { - background-color: transparent +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-button.is-disabled.is-plain, -.el-button.is-disabled.is-plain:focus, -.el-button.is-disabled.is-plain:hover { - background-color: #fff; - border-color: #ebeef5; - color: #babdc2 +.el-checkbox.is-bordered.el-checkbox--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px } -.el-button.is-loading { - position: relative; - pointer-events: none +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { + line-height: 12px; + font-size: 12px } -.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-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { + height: 12px; + width: 12px } -.el-button.is-round { - border-radius: 20px; - padding: 12px 23px +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-button.is-circle { - border-radius: 50%; - padding: 12px +.el-checkbox__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-button--primary { - color: #fff; - background-color: #006aff; - border-color: #006aff +.el-checkbox__input.is-disabled .el-checkbox__inner { + background-color: #edf2fc; + border-color: #dfe2e6; + cursor: not-allowed } -.el-button--primary:focus, -.el-button--primary:hover { - background: #38f; - border-color: #38f; - color: #fff +.el-checkbox__input.is-disabled .el-checkbox__inner::after { + cursor: not-allowed; + border-color: #babdc2 } -.el-button--primary:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { + cursor: not-allowed } -.el-button--primary.is-active { - background: #005fe6; - border-color: #005fe6; - color: #fff +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-button--primary.is-disabled, -.el-button--primary.is-disabled:active, -.el-button--primary.is-disabled:focus, -.el-button--primary.is-disabled:hover { - color: #fff; - background-color: #80b5ff; - border-color: #80b5ff +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { + border-color: #babdc2 } -.el-button--primary.is-plain { - color: #006aff; - background: #e6f0ff; - border-color: #99c3ff +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-button--primary.is-plain:focus, -.el-button--primary.is-plain:hover { - background: #006aff; - border-color: #006aff; - color: #fff +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { + background-color: #babdc2; + border-color: #babdc2 } -.el-button--primary.is-plain:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-checkbox__input.is-disabled+span.el-checkbox__label { + color: #babdc2; + cursor: not-allowed } -.el-button--primary.is-plain.is-disabled, -.el-button--primary.is-plain.is-disabled:active, -.el-button--primary.is-plain.is-disabled:focus, -.el-button--primary.is-plain.is-disabled:hover { - color: #66a6ff; - background-color: #e6f0ff; - border-color: #cce1ff +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-button--success { - color: #fff; - background-color: #0daf49; - border-color: #0daf49 +.el-checkbox__input.is-checked .el-checkbox__inner::after { + -webkit-transform: rotate(45deg) scaleY(1); + transform: rotate(45deg) scaleY(1) } -.el-button--success:focus, -.el-button--success:hover { - background: #3dbf6d; - border-color: #3dbf6d; - color: #fff +.el-checkbox__input.is-checked+.el-checkbox__label { + color: #006aff } -.el-button--success:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-checkbox__input.is-focus .el-checkbox__inner { + border-color: #006aff } -.el-button--success.is-active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-button--success.is-disabled, -.el-button--success.is-disabled:active, -.el-button--success.is-disabled:focus, -.el-button--success.is-disabled:hover { - color: #fff; - background-color: #86d7a4; - border-color: #86d7a4 +.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { + content: ''; + position: absolute; + display: block; + background-color: #fff; + height: 2px; + -webkit-transform: scale(.5); + transform: scale(.5); + left: 0; + right: 0; + top: 5px } -.el-button--success.is-plain { - color: #0daf49; - background: #e7f7ed; - border-color: #9edfb6 +.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { + display: none } -.el-button--success.is-plain:focus, -.el-button--success.is-plain:hover { - background: #0daf49; - border-color: #0daf49; - color: #fff +.el-checkbox__inner { + display: inline-block; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 2px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 14px; + height: 14px; + background-color: #fff; + z-index: 1; + -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); + transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) } -.el-button--success.is-plain:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-checkbox__inner:hover { + border-color: #006aff } -.el-button--success.is-plain.is-disabled, -.el-button--success.is-plain.is-disabled:active, -.el-button--success.is-plain.is-disabled:focus, -.el-button--success.is-plain.is-disabled:hover { - color: #6ecf92; - background-color: #e7f7ed; - border-color: #cfefdb +.el-checkbox__inner::after { + -webkit-box-sizing: content-box; + box-sizing: content-box; + content: ""; + border: 1px solid #fff; + border-left: 0; + border-top: 0; + height: 7px; + left: 4px; + position: absolute; + top: 1px; + -webkit-transform: rotate(45deg) scaleY(0); + transform: rotate(45deg) scaleY(0); + width: 3px; + -webkit-transition: -webkit-transform .15s ease-in .05s; + transition: -webkit-transform .15s ease-in .05s; + transition: transform .15s ease-in .05s; + transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; + -webkit-transform-origin: center; + transform-origin: center } -.el-button--warning { - color: #fff; - background-color: #f08614; - border-color: #f08614 +.el-checkbox__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1 } -.el-button--warning:focus, -.el-button--warning:hover { - background: #f39e43; - border-color: #f39e43; - color: #fff +.el-checkbox__label { + display: inline-block; + padding-left: 10px; + line-height: 19px; + font-size: 14px } -.el-button--warning:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-checkbox:last-of-type { + margin-right: 0 } -.el-button--warning.is-active { - background: #d87912; - border-color: #d87912; - color: #fff +.el-checkbox-button { + position: relative; + display: inline-block } -.el-button--warning.is-disabled, -.el-button--warning.is-disabled:active, -.el-button--warning.is-disabled:focus, -.el-button--warning.is-disabled:hover { - color: #fff; - background-color: #f8c38a; - border-color: #f8c38a +.el-checkbox-button__inner { + display: inline-block; + line-height: 1; + font-weight: 500; + white-space: nowrap; + vertical-align: middle; + cursor: pointer; + background: #fff; + border: 1px solid #dfe2e6; + border-left: 0; + color: #606266; + -webkit-appearance: none; + text-align: center; + -webkit-box-sizing: border-box; + box-sizing: border-box; + outline: 0; + margin: 0; + position: relative; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 0 } -.el-button--warning.is-plain { - color: #f08614; - background: #fef3e8; - border-color: #f9cfa1 +.el-checkbox-button__inner.is-round { + padding: 12px 20px } -.el-button--warning.is-plain:focus, -.el-button--warning.is-plain:hover { - background: #f08614; - border-color: #f08614; - color: #fff +.el-checkbox-button__inner:hover { + color: #006aff } -.el-button--warning.is-plain:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-checkbox-button__inner [class*=el-icon-] { + line-height: .9 } -.el-button--warning.is-plain.is-disabled, -.el-button--warning.is-plain.is-disabled:active, -.el-button--warning.is-plain.is-disabled:focus, -.el-button--warning.is-plain.is-disabled:hover { - color: #f6b672; - background-color: #fef3e8; - border-color: #fce7d0 +.el-checkbox-button__inner [class*=el-icon-]+span { + margin-left: 5px } -.el-button--danger { - color: #fff; - background-color: #ff4d4f; - border-color: #ff4d4f +.el-checkbox-button__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + z-index: -1 } -.el-button--danger:focus, -.el-button--danger:hover { - background: #ff7172; - border-color: #ff7172; - color: #fff +.el-checkbox-button.is-checked .el-checkbox-button__inner { + color: #fff; + background-color: #006aff; + border-color: #006aff; + -webkit-box-shadow: -1px 0 0 0 #66a6ff; + box-shadow: -1px 0 0 0 #66a6ff } -.el-button--danger:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { + border-left-color: #006aff } -.el-button--danger.is-active { - background: #e64547; - border-color: #e64547; - color: #fff +.el-checkbox-button.is-disabled .el-checkbox-button__inner { + color: #babdc2; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; + -webkit-box-shadow: none; + box-shadow: none } -.el-button--danger.is-disabled, -.el-button--danger.is-disabled:active, -.el-button--danger.is-disabled:focus, -.el-button--danger.is-disabled:hover { - color: #fff; - background-color: #ffa6a7; - border-color: #ffa6a7 +.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { + border-left-color: #ebeef5 } -.el-button--danger.is-plain { - color: #ff4d4f; - background: #ffeded; - border-color: #ffb8b9 +.el-checkbox-button:first-child .el-checkbox-button__inner { + border-left: 1px solid #dfe2e6; + border-radius: 4px 0 0 4px; + -webkit-box-shadow: none !important; + box-shadow: none !important } -.el-button--danger.is-plain:focus, -.el-button--danger.is-plain:hover { - background: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-checkbox-button.is-focus .el-checkbox-button__inner { + border-color: #006aff } -.el-button--danger.is-plain:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-checkbox-button:last-child .el-checkbox-button__inner { + border-radius: 0 4px 4px 0 } -.el-button--danger.is-plain.is-disabled, -.el-button--danger.is-plain.is-disabled:active, -.el-button--danger.is-plain.is-disabled:focus, -.el-button--danger.is-plain.is-disabled:hover { - color: #ff9495; - background-color: #ffeded; - border-color: #ffdbdc +.el-checkbox-button--medium .el-checkbox-button__inner { + padding: 10px 20px; + font-size: 14px; + border-radius: 0 } -.el-button--info { - color: #fff; - background-color: #909399; - border-color: #909399 +.el-checkbox-button--medium .el-checkbox-button__inner.is-round { + padding: 10px 20px } -.el-button--info:focus, -.el-button--info:hover { - background: #a6a9ad; - border-color: #a6a9ad; - color: #fff +.el-checkbox-button--small .el-checkbox-button__inner { + padding: 9px 15px; + font-size: 12px; + border-radius: 0 } -.el-button--info:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-checkbox-button--small .el-checkbox-button__inner.is-round { + padding: 9px 15px } -.el-button--info.is-active { - background: #82848a; - border-color: #82848a; - color: #fff +.el-checkbox-button--mini .el-checkbox-button__inner { + padding: 7px 15px; + font-size: 12px; + border-radius: 0 } -.el-button--info.is-disabled, -.el-button--info.is-disabled:active, -.el-button--info.is-disabled:focus, -.el-button--info.is-disabled:hover { - color: #fff; - background-color: #c8c9cc; - border-color: #c8c9cc +.el-checkbox-button--mini .el-checkbox-button__inner.is-round { + padding: 7px 15px } -.el-button--info.is-plain { - color: #909399; - background: #f4f4f5; - border-color: #d3d4d6 +.el-checkbox-group { + font-size: 0 } -.el-button--info.is-plain:focus, -.el-button--info.is-plain:hover { - background: #909399; - border-color: #909399; - color: #fff +.el-tag { + background-color: #e6f0ff; + border-color: #cce1ff; + color: #006aff; + display: inline-block; + height: 32px; + padding: 0 10px; + line-height: 30px; + font-size: 12px; + color: #006aff; + border-width: 1px; + border-style: solid; + border-radius: 4px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + white-space: nowrap } -.el-button--info.is-plain:active { - background: #82848a; - border-color: #82848a; +.el-tag.is-hit { + border-color: #006aff +} + +.el-tag .el-tag__close { + color: #006aff +} + +.el-tag .el-tag__close:hover { color: #fff; - outline: 0 + background-color: #006aff } -.el-button--info.is-plain.is-disabled, -.el-button--info.is-plain.is-disabled:active, -.el-button--info.is-plain.is-disabled:focus, -.el-button--info.is-plain.is-disabled:hover { - color: #bcbec2; +.el-tag.el-tag--info { background-color: #f4f4f5; - border-color: #e9e9eb + border-color: #e9e9eb; + color: #909399 } -.el-button--medium { - padding: 10px 20px; - font-size: 14px; - border-radius: 4px +.el-tag.el-tag--info.is-hit { + border-color: #909399 } -.el-button--medium.is-round { - padding: 10px 20px +.el-tag.el-tag--info .el-tag__close { + color: #909399 } -.el-button--medium.is-circle { - padding: 10px +.el-tag.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-button--small { - padding: 9px 15px; - font-size: 12px; - border-radius: 3px +.el-tag.el-tag--success { + background-color: #e7f7ed; + border-color: #cfefdb; + color: #0daf49 } -.el-button--small.is-round { - padding: 9px 15px +.el-tag.el-tag--success.is-hit { + border-color: #0daf49 } -.el-button--small.is-circle { - padding: 9px +.el-tag.el-tag--success .el-tag__close { + color: #0daf49 } -.el-button--mini { - padding: 7px 15px; - font-size: 12px; - border-radius: 3px +.el-tag.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-button--mini.is-round { - padding: 7px 15px +.el-tag.el-tag--warning { + background-color: #fef3e8; + border-color: #fce7d0; + color: #f08614 } -.el-button--mini.is-circle { - padding: 7px +.el-tag.el-tag--warning.is-hit { + border-color: #f08614 } -.el-button--text { - border-color: transparent; - color: #006aff; - background: 0 0; - padding-left: 0; - padding-right: 0 +.el-tag.el-tag--warning .el-tag__close { + color: #f08614 } -.el-button--text:focus, -.el-button--text:hover { - color: #38f; - border-color: transparent; - background-color: transparent +.el-tag.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-button--text:active { - color: #005fe6; - border-color: transparent; - background-color: transparent +.el-tag.el-tag--danger { + background-color: #ffeded; + border-color: #ffdbdc; + color: #ff4d4f } -.el-button--text.is-disabled, -.el-button--text.is-disabled:focus, -.el-button--text.is-disabled:hover { - border-color: transparent +.el-tag.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-button-group { - display: inline-block; - vertical-align: middle +.el-tag.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-button-group::after, -.el-button-group::before { - display: table; - content: "" +.el-tag.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-button-group::after { - clear: both +.el-tag .el-icon-close { + border-radius: 50%; + text-align: center; + position: relative; + cursor: pointer; + font-size: 12px; + height: 16px; + width: 16px; + line-height: 16px; + vertical-align: middle; + top: -1px; + right: -5px } -.el-button-group>.el-button { - float: left; - position: relative +.el-tag .el-icon-close::before { + display: block } -.el-button-group>.el-button+.el-button { - margin-left: 0 +.el-tag--dark { + background-color: #006aff; + border-color: #006aff; + color: #fff } -.el-button-group>.el-button.is-disabled { - z-index: 1 +.el-tag--dark.is-hit { + border-color: #006aff } -.el-button-group>.el-button:first-child { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-tag--dark .el-tag__close { + color: #fff } -.el-button-group>.el-button:last-child { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-tag--dark .el-tag__close:hover { + color: #fff; + background-color: #38f } -.el-button-group>.el-button:first-child:last-child { - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - border-top-left-radius: 4px; - border-bottom-left-radius: 4px +.el-tag--dark.el-tag--info { + background-color: #909399; + border-color: #909399; + color: #fff } -.el-button-group>.el-button:first-child:last-child.is-round { - border-radius: 20px +.el-tag--dark.el-tag--info.is-hit { + border-color: #909399 } -.el-button-group>.el-button:first-child:last-child.is-circle { - border-radius: 50% +.el-tag--dark.el-tag--info .el-tag__close { + color: #fff } -.el-button-group>.el-button:not(:first-child):not(:last-child) { - border-radius: 0 +.el-tag--dark.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #a6a9ad } -.el-button-group>.el-button:not(:last-child) { - margin-right: -1px +.el-tag--dark.el-tag--success { + background-color: #0daf49; + border-color: #0daf49; + color: #fff } -.el-button-group>.el-button:not(.is-disabled):active, -.el-button-group>.el-button:not(.is-disabled):focus, -.el-button-group>.el-button:not(.is-disabled):hover { - z-index: 1 +.el-tag--dark.el-tag--success.is-hit { + border-color: #0daf49 } -.el-button-group>.el-button.is-active { - z-index: 1 +.el-tag--dark.el-tag--success .el-tag__close { + color: #fff } -.el-button-group>.el-dropdown>.el-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-color: rgba(255, 255, 255, .5) -} - -.el-button-group .el-button--primary:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #3dbf6d } -.el-button-group .el-button--primary:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--warning { + background-color: #f08614; + border-color: #f08614; + color: #fff } -.el-button-group .el-button--primary:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--warning.is-hit { + border-color: #f08614 } -.el-button-group .el-button--success:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--warning .el-tag__close { + color: #fff } -.el-button-group .el-button--success:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f39e43 } -.el-button-group .el-button--success:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--danger { + background-color: #ff4d4f; + border-color: #ff4d4f; + color: #fff } -.el-button-group .el-button--warning:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-button-group .el-button--warning:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--danger .el-tag__close { + color: #fff } -.el-button-group .el-button--warning:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tag--dark.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff7172 } -.el-button-group .el-button--danger:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tag--plain { + background-color: #fff; + border-color: #99c3ff; + color: #006aff } -.el-button-group .el-button--danger:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tag--plain.is-hit { + border-color: #006aff } -.el-button-group .el-button--danger:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tag--plain .el-tag__close { + color: #006aff } -.el-button-group .el-button--info:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tag--plain .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-button-group .el-button--info:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tag--plain.el-tag--info { + background-color: #fff; + border-color: #d3d4d6; + color: #909399 } -.el-button-group .el-button--info:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tag--plain.el-tag--info.is-hit { + border-color: #909399 } -.el-checkbox { - color: #606266; - font-weight: 500; - font-size: 14px; - position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - margin-right: 30px +.el-tag--plain.el-tag--info .el-tag__close { + color: #909399 } -.el-checkbox.is-bordered { - padding: 9px 20px 9px 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - line-height: normal; - height: 40px +.el-tag--plain.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-checkbox.is-bordered.is-checked { - border-color: #006aff +.el-tag--plain.el-tag--success { + background-color: #fff; + border-color: #9edfb6; + color: #0daf49 } -.el-checkbox.is-bordered.is-disabled { - border-color: #ebeef5; - cursor: not-allowed +.el-tag--plain.el-tag--success.is-hit { + border-color: #0daf49 } -.el-checkbox.is-bordered+.el-checkbox.is-bordered { - margin-left: 10px +.el-tag--plain.el-tag--success .el-tag__close { + color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--medium { - padding: 7px 20px 7px 10px; - border-radius: 4px; - height: 36px +.el-tag--plain.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { - line-height: 17px; - font-size: 14px +.el-tag--plain.el-tag--warning { + background-color: #fff; + border-color: #f9cfa1; + color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { - height: 14px; - width: 14px +.el-tag--plain.el-tag--warning.is-hit { + border-color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--small { - padding: 5px 15px 5px 10px; - border-radius: 3px; - height: 32px +.el-tag--plain.el-tag--warning .el-tag__close { + color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { - line-height: 15px; - font-size: 12px +.el-tag--plain.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { - height: 12px; - width: 12px +.el-tag--plain.el-tag--danger { + background-color: #fff; + border-color: #ffb8b9; + color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-tag--plain.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--mini { - padding: 3px 15px 3px 10px; - border-radius: 3px; - height: 28px +.el-tag--plain.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { - line-height: 12px; - font-size: 12px +.el-tag--plain.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { - height: 12px; - width: 12px +.el-tag--medium { + height: 28px; + line-height: 26px } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-tag--medium .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-checkbox__input { - white-space: nowrap; - cursor: pointer; - outline: 0; - display: inline-block; - line-height: 1; - position: relative; - vertical-align: middle +.el-tag--small { + height: 24px; + padding: 0 8px; + line-height: 22px } -.el-checkbox__input.is-disabled .el-checkbox__inner { - background-color: #edf2fc; - border-color: #dfe2e6; - cursor: not-allowed +.el-tag--small .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-checkbox__input.is-disabled .el-checkbox__inner::after { - cursor: not-allowed; - border-color: #babdc2 +.el-tag--mini { + height: 20px; + padding: 0 5px; + line-height: 19px } -.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { - cursor: not-allowed +.el-tag--mini .el-icon-close { + margin-left: -3px; + -webkit-transform: scale(.7); + transform: scale(.7) } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-tooltip:focus:hover, +.el-tooltip:focus:not(.focusing) { + outline-width: 0 } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { - border-color: #babdc2 +.el-tooltip__popper { + position: absolute; + border-radius: 4px; + padding: 10px; + z-index: 2000; + font-size: 12px; + line-height: 1.2; + min-width: 10px; + word-wrap: break-word } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-tooltip__popper .popper__arrow, +.el-tooltip__popper .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { - background-color: #babdc2; - border-color: #babdc2 +.el-tooltip__popper .popper__arrow { + border-width: 6px } -.el-checkbox__input.is-disabled+span.el-checkbox__label { - color: #babdc2; - cursor: not-allowed -} - -.el-checkbox__input.is-checked .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-tooltip__popper .popper__arrow::after { + content: " "; + border-width: 5px } -.el-checkbox__input.is-checked .el-checkbox__inner::after { - -webkit-transform: rotate(45deg) scaleY(1); - transform: rotate(45deg) scaleY(1) +.el-tooltip__popper[x-placement^=top] { + margin-bottom: 12px } -.el-checkbox__input.is-checked+.el-checkbox__label { - color: #006aff +.el-tooltip__popper[x-placement^=top] .popper__arrow { + bottom: -6px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-checkbox__input.is-focus .el-checkbox__inner { - border-color: #006aff +.el-tooltip__popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -5px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-checkbox__input.is-indeterminate .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-tooltip__popper[x-placement^=bottom] { + margin-top: 12px } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { - content: ''; - position: absolute; - display: block; - background-color: #fff; - height: 2px; - -webkit-transform: scale(.5); - transform: scale(.5); - left: 0; - right: 0; - top: 5px +.el-tooltip__popper[x-placement^=bottom] .popper__arrow { + top: -6px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { - display: none +.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -5px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.el-checkbox__inner { - display: inline-block; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 2px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 14px; - height: 14px; - background-color: #fff; - z-index: 1; - -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); - transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) +.el-tooltip__popper[x-placement^=right] { + margin-left: 12px } -.el-checkbox__inner:hover { - border-color: #006aff +.el-tooltip__popper[x-placement^=right] .popper__arrow { + left: -6px; + border-right-color: #1e2226; + border-left-width: 0 } -.el-checkbox__inner::after { - -webkit-box-sizing: content-box; - box-sizing: content-box; - content: ""; - border: 1px solid #fff; - border-left: 0; - border-top: 0; - height: 7px; - left: 4px; - position: absolute; - top: 1px; - -webkit-transform: rotate(45deg) scaleY(0); - transform: rotate(45deg) scaleY(0); - width: 3px; - -webkit-transition: -webkit-transform .15s ease-in .05s; - transition: -webkit-transform .15s ease-in .05s; - transition: transform .15s ease-in .05s; - transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; - -webkit-transform-origin: center; - transform-origin: center +.el-tooltip__popper[x-placement^=right] .popper__arrow::after { + bottom: -5px; + left: 1px; + border-right-color: #1e2226; + border-left-width: 0 } -.el-checkbox__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - width: 0; - height: 0; - z-index: -1 +.el-tooltip__popper[x-placement^=left] { + margin-right: 12px } -.el-checkbox__label { - display: inline-block; - padding-left: 10px; - line-height: 19px; - font-size: 14px +.el-tooltip__popper[x-placement^=left] .popper__arrow { + right: -6px; + border-right-width: 0; + border-left-color: #1e2226 } -.el-checkbox:last-of-type { - margin-right: 0 +.el-tooltip__popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -5px; + margin-left: -5px; + border-right-width: 0; + border-left-color: #1e2226 } -.el-checkbox-button { - position: relative; - display: inline-block +.el-tooltip__popper.is-dark { + background: #1e2226; + color: #fff } -.el-checkbox-button__inner { - display: inline-block; - line-height: 1; - font-weight: 500; - white-space: nowrap; - vertical-align: middle; - cursor: pointer; +.el-tooltip__popper.is-light { background: #fff; - border: 1px solid #dfe2e6; - border-left: 0; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - position: relative; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 0 + border: 1px solid #1e2226 } -.el-checkbox-button__inner.is-round { - padding: 12px 20px +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { + border-top-color: #1e2226 } -.el-checkbox-button__inner:hover { - color: #006aff +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { + border-top-color: #fff } -.el-checkbox-button__inner [class*=el-icon-] { - line-height: .9 +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { + border-bottom-color: #1e2226 } -.el-checkbox-button__inner [class*=el-icon-]+span { - margin-left: 5px +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { + border-bottom-color: #fff } -.el-checkbox-button__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - z-index: -1 +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { + border-left-color: #1e2226 } -.el-checkbox-button.is-checked .el-checkbox-button__inner { - color: #fff; - background-color: #006aff; - border-color: #006aff; - -webkit-box-shadow: -1px 0 0 0 #66a6ff; - box-shadow: -1px 0 0 0 #66a6ff +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { + border-left-color: #fff } -.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { - border-left-color: #006aff +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { + border-right-color: #1e2226 } -.el-checkbox-button.is-disabled .el-checkbox-button__inner { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5; - -webkit-box-shadow: none; - box-shadow: none +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { + border-right-color: #fff } -.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { - border-left-color: #ebeef5 +.el-table { + position: relative; + overflow: hidden; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + width: 100%; + max-width: 100%; + background-color: #fff; + font-size: 14px; + color: #606266 } -.el-checkbox-button:first-child .el-checkbox-button__inner { - border-left: 1px solid #dfe2e6; - border-radius: 4px 0 0 4px; - -webkit-box-shadow: none !important; - box-shadow: none !important +.el-table__empty-block { + min-height: 60px; + text-align: center; + width: 100%; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-checkbox-button.is-focus .el-checkbox-button__inner { - border-color: #006aff +.el-table__empty-text { + line-height: 60px; + width: 50%; + color: #1e2226 } -.el-checkbox-button:last-child .el-checkbox-button__inner { - border-radius: 0 4px 4px 0 +.el-table__expand-column .cell { + padding: 0; + text-align: center } -.el-checkbox-button--medium .el-checkbox-button__inner { - padding: 10px 20px; - font-size: 14px; - border-radius: 0 -} - -.el-checkbox-button--medium .el-checkbox-button__inner.is-round { - padding: 10px 20px +.el-table__expand-icon { + position: relative; + cursor: pointer; + color: #666; + font-size: 12px; + -webkit-transition: -webkit-transform .2s ease-in-out; + transition: -webkit-transform .2s ease-in-out; + transition: transform .2s ease-in-out; + transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out; + height: 20px } -.el-checkbox-button--small .el-checkbox-button__inner { - padding: 9px 15px; - font-size: 12px; - border-radius: 0 +.el-table__expand-icon--expanded { + -webkit-transform: rotate(90deg); + transform: rotate(90deg) } -.el-checkbox-button--small .el-checkbox-button__inner.is-round { - padding: 9px 15px +.el-table__expand-icon>.el-icon { + position: absolute; + left: 50%; + top: 50%; + margin-left: -5px; + margin-top: -5px } -.el-checkbox-button--mini .el-checkbox-button__inner { - padding: 7px 15px; - font-size: 12px; - border-radius: 0 +.el-table__expanded-cell { + background-color: #fff } -.el-checkbox-button--mini .el-checkbox-button__inner.is-round { - padding: 7px 15px +.el-table__expanded-cell[class*=cell] { + padding: 20px 50px } -.el-checkbox-group { - font-size: 0 +.el-table__expanded-cell:hover { + background-color: transparent !important } -.el-tag { - background-color: #e6f0ff; - border-color: #cce1ff; - color: #006aff; +.el-table__placeholder { display: inline-block; - height: 32px; - padding: 0 10px; - line-height: 30px; - font-size: 12px; - color: #006aff; - border-width: 1px; - border-style: solid; - border-radius: 4px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - white-space: nowrap + width: 20px } -.el-tag.is-hit { - border-color: #006aff +.el-table__append-wrapper { + overflow: hidden } -.el-tag .el-tag__close { - color: #006aff +.el-table--fit { + border-right: 0; + border-bottom: 0 } -.el-tag .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-table--fit .el-table__cell.gutter { + border-right-width: 1px } -.el-tag.el-tag--info { - background-color: #f4f4f5; - border-color: #e9e9eb; - color: #909399 +.el-table--scrollable-x .el-table__body-wrapper { + overflow-x: auto } -.el-tag.el-tag--info.is-hit { - border-color: #909399 +.el-table--scrollable-y .el-table__body-wrapper { + overflow-y: auto } -.el-tag.el-tag--info .el-tag__close { - color: #909399 +.el-table thead { + color: #1e2226; + font-weight: 500 } -.el-tag.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-table thead.is-group th.el-table__cell { + background: #f5f7fa } -.el-tag.el-tag--success { - background-color: #e7f7ed; - border-color: #cfefdb; - color: #0daf49 +.el-table .el-table__cell { + padding: 12px 0; + min-width: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; + text-overflow: ellipsis; + vertical-align: middle; + position: relative; + text-align: left } -.el-tag.el-tag--success.is-hit { - border-color: #0daf49 +.el-table .el-table__cell.is-center { + text-align: center } -.el-tag.el-tag--success .el-tag__close { - color: #0daf49 +.el-table .el-table__cell.is-right { + text-align: right } -.el-tag.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-table .el-table__cell.gutter { + width: 15px; + border-right-width: 0; + border-bottom-width: 0; + padding: 0 } -.el-tag.el-tag--warning { - background-color: #fef3e8; - border-color: #fce7d0; - color: #f08614 +.el-table .el-table__cell.is-hidden>* { + visibility: hidden } -.el-tag.el-tag--warning.is-hit { - border-color: #f08614 +.el-table--medium .el-table__cell { + padding: 10px 0 } -.el-tag.el-tag--warning .el-tag__close { - color: #f08614 +.el-table--small { + font-size: 12px } -.el-tag.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-table--small .el-table__cell { + padding: 8px 0 } -.el-tag.el-tag--danger { - background-color: #ffeded; - border-color: #ffdbdc; - color: #ff4d4f +.el-table--mini { + font-size: 12px } -.el-tag.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-table--mini .el-table__cell { + padding: 6px 0 } -.el-tag.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-table tr { + background-color: #fff } -.el-tag.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-table tr input[type=checkbox] { + margin: 0 } -.el-tag .el-icon-close { - border-radius: 50%; - text-align: center; - position: relative; - cursor: pointer; - font-size: 12px; - height: 16px; - width: 16px; - line-height: 16px; - vertical-align: middle; - top: -1px; - right: -5px +.el-table td.el-table__cell, +.el-table th.el-table__cell.is-leaf { + border-bottom: 1px solid #ebeef5 } -.el-tag .el-icon-close::before { - display: block +.el-table th.el-table__cell.is-sortable { + cursor: pointer } -.el-tag--dark { - background-color: #006aff; - border-color: #006aff; - color: #fff +.el-table th.el-table__cell { + overflow: hidden; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + background-color: #fff } -.el-tag--dark.is-hit { - border-color: #006aff +.el-table th.el-table__cell>.cell { + display: inline-block; + -webkit-box-sizing: border-box; + box-sizing: border-box; + position: relative; + vertical-align: middle; + padding-left: 10px; + padding-right: 10px; + width: 100% } -.el-tag--dark .el-tag__close { - color: #fff +.el-table th.el-table__cell>.cell.highlight { + color: #006aff } -.el-tag--dark .el-tag__close:hover { - color: #fff; - background-color: #38f +.el-table th.el-table__cell.required>div::before { + display: inline-block; + content: ""; + width: 8px; + height: 8px; + border-radius: 50%; + background: #ff4d51; + margin-right: 5px; + vertical-align: middle } -.el-tag--dark.el-tag--info { - background-color: #909399; - border-color: #909399; - color: #fff +.el-table td.el-table__cell div { + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-tag--dark.el-tag--info.is-hit { - border-color: #909399 +.el-table td.el-table__cell.gutter { + width: 0 } -.el-tag--dark.el-tag--info .el-tag__close { - color: #fff +.el-table .cell { + -webkit-box-sizing: border-box; + box-sizing: border-box; + overflow: hidden; + text-overflow: ellipsis; + white-space: normal; + word-break: break-all; + line-height: 18px; + padding-left: 10px; + padding-right: 10px } -.el-tag--dark.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #a6a9ad +.el-table .cell.el-tooltip { + white-space: nowrap; + min-width: 50px } -.el-tag--dark.el-tag--success { - background-color: #0daf49; - border-color: #0daf49; - color: #fff +.el-table--border, +.el-table--group { + border: 1px solid #ebeef5 } -.el-tag--dark.el-tag--success.is-hit { - border-color: #0daf49 +.el-table--border::after, +.el-table--group::after, +.el-table::before { + content: ''; + position: absolute; + background-color: #ebeef5; + z-index: 1 } -.el-tag--dark.el-tag--success .el-tag__close { - color: #fff +.el-table--border::after, +.el-table--group::after { + top: 0; + right: 0; + width: 1px; + height: 100% } -.el-tag--dark.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #3dbf6d +.el-table::before { + left: 0; + bottom: 0; + width: 100%; + height: 1px } -.el-tag--dark.el-tag--warning { - background-color: #f08614; - border-color: #f08614; - color: #fff +.el-table--border { + border-right: none; + border-bottom: none } -.el-tag--dark.el-tag--warning.is-hit { - border-color: #f08614 +.el-table--border.el-loading-parent--relative { + border-color: transparent } -.el-tag--dark.el-tag--warning .el-tag__close { - color: #fff +.el-table--border .el-table__cell { + border-right: 1px solid #ebeef5 } -.el-tag--dark.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f39e43 +.el-table--border .el-table__cell:first-child .cell { + padding-left: 10px } -.el-tag--dark.el-tag--danger { - background-color: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-table--border th.el-table__cell.gutter:last-of-type { + border-bottom: 1px solid #ebeef5; + border-bottom-width: 1px } -.el-tag--dark.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-table--border th.el-table__cell { + border-bottom: 1px solid #ebeef5 } -.el-tag--dark.el-tag--danger .el-tag__close { - color: #fff +.el-table--hidden { + visibility: hidden } -.el-tag--dark.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff7172 +.el-table__fixed, +.el-table__fixed-right { + position: absolute; + top: 0; + left: 0; + overflow-x: hidden; + overflow-y: hidden; + -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12); + box-shadow: 0 0 10px rgba(0, 0, 0, .12) } -.el-tag--plain { - background-color: #fff; - border-color: #99c3ff; - color: #006aff +.el-table__fixed-right::before, +.el-table__fixed::before { + content: ''; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 1px; + background-color: #ebeef5; + z-index: 4 } -.el-tag--plain.is-hit { - border-color: #006aff +.el-table__fixed-right-patch { + position: absolute; + top: -1px; + right: 0; + background-color: #fff; + border-bottom: 1px solid #ebeef5 } -.el-tag--plain .el-tag__close { - color: #006aff +.el-table__fixed-right { + top: 0; + left: auto; + right: 0 } -.el-tag--plain .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-table__fixed-right .el-table__fixed-body-wrapper, +.el-table__fixed-right .el-table__fixed-footer-wrapper, +.el-table__fixed-right .el-table__fixed-header-wrapper { + left: auto; + right: 0 } -.el-tag--plain.el-tag--info { - background-color: #fff; - border-color: #d3d4d6; - color: #909399 +.el-table__fixed-header-wrapper { + position: absolute; + left: 0; + top: 0; + z-index: 3 } -.el-tag--plain.el-tag--info.is-hit { - border-color: #909399 +.el-table__fixed-footer-wrapper { + position: absolute; + left: 0; + bottom: 0; + z-index: 3 } -.el-tag--plain.el-tag--info .el-tag__close { - color: #909399 +.el-table__fixed-footer-wrapper tbody td.el-table__cell { + border-top: 1px solid #ebeef5; + background-color: #f5f7fa; + color: #606266 } -.el-tag--plain.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-table__fixed-body-wrapper { + position: absolute; + left: 0; + top: 37px; + overflow: hidden; + z-index: 3 } -.el-tag--plain.el-tag--success { - background-color: #fff; - border-color: #9edfb6; - color: #0daf49 +.el-table__body-wrapper, +.el-table__footer-wrapper, +.el-table__header-wrapper { + width: 100% } -.el-tag--plain.el-tag--success.is-hit { - border-color: #0daf49 +.el-table__footer-wrapper { + margin-top: -1px } -.el-tag--plain.el-tag--success .el-tag__close { - color: #0daf49 +.el-table__footer-wrapper td.el-table__cell { + border-top: 1px solid #ebeef5 } -.el-tag--plain.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-table__body, +.el-table__footer, +.el-table__header { + table-layout: fixed; + border-collapse: separate } -.el-tag--plain.el-tag--warning { - background-color: #fff; - border-color: #f9cfa1; - color: #f08614 +.el-table__footer-wrapper, +.el-table__header-wrapper { + overflow: hidden } -.el-tag--plain.el-tag--warning.is-hit { - border-color: #f08614 +.el-table__footer-wrapper tbody td.el-table__cell, +.el-table__header-wrapper tbody td.el-table__cell { + background-color: #f5f7fa; + color: #606266 } -.el-tag--plain.el-tag--warning .el-tag__close { - color: #f08614 +.el-table__body-wrapper { + overflow: hidden; + position: relative } -.el-tag--plain.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-table__body-wrapper.is-scrolling-none~.el-table__fixed, +.el-table__body-wrapper.is-scrolling-none~.el-table__fixed-right { + -webkit-box-shadow: none; + box-shadow: none } -.el-tag--plain.el-tag--danger { - background-color: #fff; - border-color: #ffb8b9; - color: #ff4d4f +.el-table__body-wrapper.is-scrolling-left~.el-table__fixed { + -webkit-box-shadow: none; + box-shadow: none } -.el-tag--plain.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-table__body-wrapper.is-scrolling-right~.el-table__fixed-right { + -webkit-box-shadow: none; + box-shadow: none } -.el-tag--plain.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-table__body-wrapper .el-table--border.is-scrolling-right~.el-table__fixed-right { + border-left: 1px solid #ebeef5 } -.el-tag--plain.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed { + border-right: 1px solid #ebeef5 } -.el-tag--medium { - height: 28px; - line-height: 26px +.el-table .caret-wrapper { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + height: 34px; + width: 24px; + vertical-align: middle; + cursor: pointer; + overflow: initial; + position: relative } -.el-tag--medium .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-table .sort-caret { + width: 0; + height: 0; + border: solid 5px transparent; + position: absolute; + left: 7px } -.el-tag--small { - height: 24px; - padding: 0 8px; - line-height: 22px +.el-table .sort-caret.ascending { + border-bottom-color: #babdc2; + top: 5px } -.el-tag--small .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-table .sort-caret.descending { + border-top-color: #babdc2; + bottom: 7px } -.el-tag--mini { - height: 20px; - padding: 0 5px; - line-height: 19px +.el-table .ascending .sort-caret.ascending { + border-bottom-color: #006aff } -.el-tag--mini .el-icon-close { - margin-left: -3px; - -webkit-transform: scale(.7); - transform: scale(.7) -} - -.el-tooltip:focus:hover, -.el-tooltip:focus:not(.focusing) { - outline-width: 0 +.el-table .descending .sort-caret.descending { + border-top-color: #006aff } -.el-tooltip__popper { +.el-table .hidden-columns { + visibility: hidden; position: absolute; - border-radius: 4px; - padding: 10px; - z-index: 2000; - font-size: 12px; - line-height: 1.2; - min-width: 10px; - word-wrap: break-word + z-index: -1 } -.el-tooltip__popper .popper__arrow, -.el-tooltip__popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell { + background: #fafafa } -.el-tooltip__popper .popper__arrow { - border-width: 6px +.el-table--striped .el-table__body tr.el-table__row--striped.current-row td.el-table__cell { + background-color: #e6f0ff } -.el-tooltip__popper .popper__arrow::after { - content: " "; - border-width: 5px +.el-table__body tr.hover-row.current-row>td.el-table__cell, +.el-table__body tr.hover-row.el-table__row--striped.current-row>td.el-table__cell, +.el-table__body tr.hover-row.el-table__row--striped>td.el-table__cell, +.el-table__body tr.hover-row>td.el-table__cell { + background-color: #f5f7fa } -.el-tooltip__popper[x-placement^=top] { - margin-bottom: 12px +.el-table__body tr.current-row>td.el-table__cell { + background-color: #e6f0ff } -.el-tooltip__popper[x-placement^=top] .popper__arrow { - bottom: -6px; - border-top-color: #1e2226; - border-bottom-width: 0 +.el-table__column-resize-proxy { + position: absolute; + left: 200px; + top: 0; + bottom: 0; + width: 0; + border-left: 1px solid #ebeef5; + z-index: 10 } -.el-tooltip__popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -5px; - border-top-color: #1e2226; - border-bottom-width: 0 +.el-table__column-filter-trigger { + display: inline-block; + line-height: 34px; + cursor: pointer } -.el-tooltip__popper[x-placement^=bottom] { - margin-top: 12px +.el-table__column-filter-trigger i { + color: #909399; + font-size: 12px; + -webkit-transform: scale(.75); + transform: scale(.75) } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow { - top: -6px; - border-top-width: 0; - border-bottom-color: #1e2226 +.el-table--enable-row-transition .el-table__body td.el-table__cell { + -webkit-transition: background-color .25s ease; + transition: background-color .25s ease } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -5px; - border-top-width: 0; - border-bottom-color: #1e2226 +.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell { + background-color: #f5f7fa } -.el-tooltip__popper[x-placement^=right] { - margin-left: 12px +.el-table--fluid-height .el-table__fixed, +.el-table--fluid-height .el-table__fixed-right { + bottom: 0; + overflow: hidden } -.el-tooltip__popper[x-placement^=right] .popper__arrow { - left: -6px; - border-right-color: #1e2226; - border-left-width: 0 +.el-table [class*=el-table__row--level] .el-table__expand-icon { + display: inline-block; + width: 20px; + line-height: 20px; + height: 20px; + text-align: center; + margin-right: 3px } -.el-tooltip__popper[x-placement^=right] .popper__arrow::after { - bottom: -5px; - left: 1px; - border-right-color: #1e2226; - border-left-width: 0 +.el-checkbox { + color: #606266; + font-weight: 500; + font-size: 14px; + position: relative; + cursor: pointer; + display: inline-block; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + margin-right: 30px } -.el-tooltip__popper[x-placement^=left] { - margin-right: 12px +.el-checkbox.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: normal; + height: 40px } -.el-tooltip__popper[x-placement^=left] .popper__arrow { - right: -6px; - border-right-width: 0; - border-left-color: #1e2226 +.el-checkbox.is-bordered.is-checked { + border-color: #006aff } -.el-tooltip__popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -5px; - margin-left: -5px; - border-right-width: 0; - border-left-color: #1e2226 +.el-checkbox.is-bordered.is-disabled { + border-color: #ebeef5; + cursor: not-allowed } -.el-tooltip__popper.is-dark { - background: #1e2226; - color: #fff +.el-checkbox.is-bordered+.el-checkbox.is-bordered { + margin-left: 10px } -.el-tooltip__popper.is-light { - background: #fff; - border: 1px solid #1e2226 +.el-checkbox.is-bordered.el-checkbox--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { - border-top-color: #1e2226 +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { + line-height: 17px; + font-size: 14px } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { - border-top-color: #fff +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { + height: 14px; + width: 14px } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { - border-bottom-color: #1e2226 +.el-checkbox.is-bordered.el-checkbox--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { - border-bottom-color: #fff +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { + line-height: 15px; + font-size: 12px } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { - border-left-color: #1e2226 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { + height: 12px; + width: 12px } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { - border-left-color: #fff +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { - border-right-color: #1e2226 +.el-checkbox.is-bordered.el-checkbox--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { - border-right-color: #fff +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { + line-height: 12px; + font-size: 12px } -.el-table { - position: relative; - overflow: hidden; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - width: 100%; - max-width: 100%; - background-color: #fff; - font-size: 14px; - color: #606266 +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { + height: 12px; + width: 12px } -.el-table__empty-block { - min-height: 60px; - text-align: center; - width: 100%; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-table__empty-text { - line-height: 60px; - width: 50%; - color: #1e2226 +.el-checkbox__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-table__expand-column .cell { - padding: 0; - text-align: center +.el-checkbox__input.is-disabled .el-checkbox__inner { + background-color: #edf2fc; + border-color: #dfe2e6; + cursor: not-allowed } -.el-table__expand-icon { - position: relative; - cursor: pointer; - color: #666; - font-size: 12px; - -webkit-transition: -webkit-transform .2s ease-in-out; - transition: -webkit-transform .2s ease-in-out; - transition: transform .2s ease-in-out; - transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out; - height: 20px +.el-checkbox__input.is-disabled .el-checkbox__inner::after { + cursor: not-allowed; + border-color: #babdc2 } -.el-table__expand-icon--expanded { - -webkit-transform: rotate(90deg); - transform: rotate(90deg) +.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { + cursor: not-allowed } -.el-table__expand-icon>.el-icon { - position: absolute; - left: 50%; - top: 50%; - margin-left: -5px; - margin-top: -5px +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-table__expanded-cell { - background-color: #fff +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { + border-color: #babdc2 } -.el-table__expanded-cell[class*=cell] { - padding: 20px 50px +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-table__expanded-cell:hover { - background-color: transparent !important +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { + background-color: #babdc2; + border-color: #babdc2 } -.el-table__placeholder { - display: inline-block; - width: 20px +.el-checkbox__input.is-disabled+span.el-checkbox__label { + color: #babdc2; + cursor: not-allowed } -.el-table__append-wrapper { - overflow: hidden +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-table--fit { - border-right: 0; - border-bottom: 0 +.el-checkbox__input.is-checked .el-checkbox__inner::after { + -webkit-transform: rotate(45deg) scaleY(1); + transform: rotate(45deg) scaleY(1) } -.el-table--fit .el-table__cell.gutter { - border-right-width: 1px +.el-checkbox__input.is-checked+.el-checkbox__label { + color: #006aff } -.el-table--scrollable-x .el-table__body-wrapper { - overflow-x: auto +.el-checkbox__input.is-focus .el-checkbox__inner { + border-color: #006aff } -.el-table--scrollable-y .el-table__body-wrapper { - overflow-y: auto +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-table thead { - color: #1e2226; - font-weight: 500 +.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { + content: ''; + position: absolute; + display: block; + background-color: #fff; + height: 2px; + -webkit-transform: scale(.5); + transform: scale(.5); + left: 0; + right: 0; + top: 5px } -.el-table thead.is-group th.el-table__cell { - background: #f5f7fa +.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { + display: none } -.el-table .el-table__cell { - padding: 12px 0; - min-width: 0; +.el-checkbox__inner { + display: inline-block; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 2px; -webkit-box-sizing: border-box; box-sizing: border-box; - text-overflow: ellipsis; - vertical-align: middle; - position: relative; - text-align: left + width: 14px; + height: 14px; + background-color: #fff; + z-index: 1; + -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); + transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) } -.el-table .el-table__cell.is-center { - text-align: center +.el-checkbox__inner:hover { + border-color: #006aff } -.el-table .el-table__cell.is-right { - text-align: right +.el-checkbox__inner::after { + -webkit-box-sizing: content-box; + box-sizing: content-box; + content: ""; + border: 1px solid #fff; + border-left: 0; + border-top: 0; + height: 7px; + left: 4px; + position: absolute; + top: 1px; + -webkit-transform: rotate(45deg) scaleY(0); + transform: rotate(45deg) scaleY(0); + width: 3px; + -webkit-transition: -webkit-transform .15s ease-in .05s; + transition: -webkit-transform .15s ease-in .05s; + transition: transform .15s ease-in .05s; + transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; + -webkit-transform-origin: center; + transform-origin: center } -.el-table .el-table__cell.gutter { - width: 15px; - border-right-width: 0; - border-bottom-width: 0; - padding: 0 +.el-checkbox__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1 } -.el-table .el-table__cell.is-hidden>* { - visibility: hidden +.el-checkbox__label { + display: inline-block; + padding-left: 10px; + line-height: 19px; + font-size: 14px } -.el-table--medium .el-table__cell { - padding: 10px 0 +.el-checkbox:last-of-type { + margin-right: 0 } -.el-table--small { - font-size: 12px +.el-checkbox-button { + position: relative; + display: inline-block } -.el-table--small .el-table__cell { - padding: 8px 0 +.el-checkbox-button__inner { + display: inline-block; + line-height: 1; + font-weight: 500; + white-space: nowrap; + vertical-align: middle; + cursor: pointer; + background: #fff; + border: 1px solid #dfe2e6; + border-left: 0; + color: #606266; + -webkit-appearance: none; + text-align: center; + -webkit-box-sizing: border-box; + box-sizing: border-box; + outline: 0; + margin: 0; + position: relative; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 0 } -.el-table--mini { - font-size: 12px +.el-checkbox-button__inner.is-round { + padding: 12px 20px } -.el-table--mini .el-table__cell { - padding: 6px 0 +.el-checkbox-button__inner:hover { + color: #006aff } -.el-table tr { - background-color: #fff +.el-checkbox-button__inner [class*=el-icon-] { + line-height: .9 } -.el-table tr input[type=checkbox] { - margin: 0 +.el-checkbox-button__inner [class*=el-icon-]+span { + margin-left: 5px } -.el-table td.el-table__cell, -.el-table th.el-table__cell.is-leaf { - border-bottom: 1px solid #ebeef5 +.el-checkbox-button__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + z-index: -1 } -.el-table th.el-table__cell.is-sortable { - cursor: pointer +.el-checkbox-button.is-checked .el-checkbox-button__inner { + color: #fff; + background-color: #006aff; + border-color: #006aff; + -webkit-box-shadow: -1px 0 0 0 #66a6ff; + box-shadow: -1px 0 0 0 #66a6ff } -.el-table th.el-table__cell { - overflow: hidden; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - background-color: #fff +.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { + border-left-color: #006aff } -.el-table th.el-table__cell>.cell { - display: inline-block; - -webkit-box-sizing: border-box; - box-sizing: border-box; - position: relative; - vertical-align: middle; - padding-left: 10px; - padding-right: 10px; - width: 100% +.el-checkbox-button.is-disabled .el-checkbox-button__inner { + color: #babdc2; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; + -webkit-box-shadow: none; + box-shadow: none } -.el-table th.el-table__cell>.cell.highlight { - color: #006aff +.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { + border-left-color: #ebeef5 } -.el-table th.el-table__cell.required>div::before { - display: inline-block; - content: ""; - width: 8px; - height: 8px; - border-radius: 50%; - background: #ff4d51; - margin-right: 5px; - vertical-align: middle +.el-checkbox-button:first-child .el-checkbox-button__inner { + border-left: 1px solid #dfe2e6; + border-radius: 4px 0 0 4px; + -webkit-box-shadow: none !important; + box-shadow: none !important } -.el-table td.el-table__cell div { - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-checkbox-button.is-focus .el-checkbox-button__inner { + border-color: #006aff } -.el-table td.el-table__cell.gutter { - width: 0 +.el-checkbox-button:last-child .el-checkbox-button__inner { + border-radius: 0 4px 4px 0 } -.el-table .cell { - -webkit-box-sizing: border-box; - box-sizing: border-box; - overflow: hidden; - text-overflow: ellipsis; - white-space: normal; - word-break: break-all; - line-height: 18px; - padding-left: 10px; - padding-right: 10px +.el-checkbox-button--medium .el-checkbox-button__inner { + padding: 10px 20px; + font-size: 14px; + border-radius: 0 } -.el-table .cell.el-tooltip { - white-space: nowrap; - min-width: 50px +.el-checkbox-button--medium .el-checkbox-button__inner.is-round { + padding: 10px 20px } -.el-table--border, -.el-table--group { - border: 1px solid #ebeef5 +.el-checkbox-button--small .el-checkbox-button__inner { + padding: 9px 15px; + font-size: 12px; + border-radius: 0 } -.el-table--border::after, -.el-table--group::after, -.el-table::before { - content: ''; - position: absolute; - background-color: #ebeef5; - z-index: 1 +.el-checkbox-button--small .el-checkbox-button__inner.is-round { + padding: 9px 15px } -.el-table--border::after, -.el-table--group::after { - top: 0; - right: 0; - width: 1px; - height: 100% +.el-checkbox-button--mini .el-checkbox-button__inner { + padding: 7px 15px; + font-size: 12px; + border-radius: 0 } -.el-table::before { - left: 0; - bottom: 0; - width: 100%; - height: 1px +.el-checkbox-button--mini .el-checkbox-button__inner.is-round { + padding: 7px 15px } -.el-table--border { - border-right: none; - border-bottom: none +.el-checkbox-group { + font-size: 0 } -.el-table--border.el-loading-parent--relative { - border-color: transparent +.el-tag { + background-color: #e6f0ff; + border-color: #cce1ff; + color: #006aff; + display: inline-block; + height: 32px; + padding: 0 10px; + line-height: 30px; + font-size: 12px; + color: #006aff; + border-width: 1px; + border-style: solid; + border-radius: 4px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + white-space: nowrap } -.el-table--border .el-table__cell { - border-right: 1px solid #ebeef5 +.el-tag.is-hit { + border-color: #006aff } -.el-table--border .el-table__cell:first-child .cell { - padding-left: 10px +.el-tag .el-tag__close { + color: #006aff } -.el-table--border th.el-table__cell.gutter:last-of-type { - border-bottom: 1px solid #ebeef5; - border-bottom-width: 1px +.el-tag .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-table--border th.el-table__cell { - border-bottom: 1px solid #ebeef5 +.el-tag.el-tag--info { + background-color: #f4f4f5; + border-color: #e9e9eb; + color: #909399 } -.el-table--hidden { - visibility: hidden +.el-tag.el-tag--info.is-hit { + border-color: #909399 } -.el-table__fixed, -.el-table__fixed-right { - position: absolute; - top: 0; - left: 0; - overflow-x: hidden; - overflow-y: hidden; - -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12); - box-shadow: 0 0 10px rgba(0, 0, 0, .12) +.el-tag.el-tag--info .el-tag__close { + color: #909399 } -.el-table__fixed-right::before, -.el-table__fixed::before { - content: ''; - position: absolute; - left: 0; - bottom: 0; - width: 100%; - height: 1px; - background-color: #ebeef5; - z-index: 4 +.el-tag.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-table__fixed-right-patch { - position: absolute; - top: -1px; - right: 0; - background-color: #fff; - border-bottom: 1px solid #ebeef5 +.el-tag.el-tag--success { + background-color: #e7f7ed; + border-color: #cfefdb; + color: #0daf49 } -.el-table__fixed-right { - top: 0; - left: auto; - right: 0 +.el-tag.el-tag--success.is-hit { + border-color: #0daf49 } -.el-table__fixed-right .el-table__fixed-body-wrapper, -.el-table__fixed-right .el-table__fixed-footer-wrapper, -.el-table__fixed-right .el-table__fixed-header-wrapper { - left: auto; - right: 0 +.el-tag.el-tag--success .el-tag__close { + color: #0daf49 } -.el-table__fixed-header-wrapper { - position: absolute; - left: 0; - top: 0; - z-index: 3 +.el-tag.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-table__fixed-footer-wrapper { - position: absolute; - left: 0; - bottom: 0; - z-index: 3 +.el-tag.el-tag--warning { + background-color: #fef3e8; + border-color: #fce7d0; + color: #f08614 } -.el-table__fixed-footer-wrapper tbody td.el-table__cell { - border-top: 1px solid #ebeef5; - background-color: #f5f7fa; - color: #606266 +.el-tag.el-tag--warning.is-hit { + border-color: #f08614 } -.el-table__fixed-body-wrapper { - position: absolute; - left: 0; - top: 37px; - overflow: hidden; - z-index: 3 +.el-tag.el-tag--warning .el-tag__close { + color: #f08614 } -.el-table__body-wrapper, -.el-table__footer-wrapper, -.el-table__header-wrapper { - width: 100% +.el-tag.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-table__footer-wrapper { - margin-top: -1px +.el-tag.el-tag--danger { + background-color: #ffeded; + border-color: #ffdbdc; + color: #ff4d4f } -.el-table__footer-wrapper td.el-table__cell { - border-top: 1px solid #ebeef5 +.el-tag.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-table__body, -.el-table__footer, -.el-table__header { - table-layout: fixed; - border-collapse: separate +.el-tag.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-table__footer-wrapper, -.el-table__header-wrapper { - overflow: hidden +.el-tag.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-table__footer-wrapper tbody td.el-table__cell, -.el-table__header-wrapper tbody td.el-table__cell { - background-color: #f5f7fa; - color: #606266 +.el-tag .el-icon-close { + border-radius: 50%; + text-align: center; + position: relative; + cursor: pointer; + font-size: 12px; + height: 16px; + width: 16px; + line-height: 16px; + vertical-align: middle; + top: -1px; + right: -5px } -.el-table__body-wrapper { - overflow: hidden; - position: relative +.el-tag .el-icon-close::before { + display: block } -.el-table__body-wrapper.is-scrolling-none~.el-table__fixed, -.el-table__body-wrapper.is-scrolling-none~.el-table__fixed-right { - -webkit-box-shadow: none; - box-shadow: none +.el-tag--dark { + background-color: #006aff; + border-color: #006aff; + color: #fff } -.el-table__body-wrapper.is-scrolling-left~.el-table__fixed { - -webkit-box-shadow: none; - box-shadow: none +.el-tag--dark.is-hit { + border-color: #006aff } -.el-table__body-wrapper.is-scrolling-right~.el-table__fixed-right { - -webkit-box-shadow: none; - box-shadow: none +.el-tag--dark .el-tag__close { + color: #fff } -.el-table__body-wrapper .el-table--border.is-scrolling-right~.el-table__fixed-right { - border-left: 1px solid #ebeef5 +.el-tag--dark .el-tag__close:hover { + color: #fff; + background-color: #38f } -.el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed { - border-right: 1px solid #ebeef5 +.el-tag--dark.el-tag--info { + background-color: #909399; + border-color: #909399; + color: #fff } -.el-table .caret-wrapper { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 34px; - width: 24px; - vertical-align: middle; - cursor: pointer; - overflow: initial; - position: relative +.el-tag--dark.el-tag--info.is-hit { + border-color: #909399 } -.el-table .sort-caret { - width: 0; - height: 0; - border: solid 5px transparent; - position: absolute; - left: 7px +.el-tag--dark.el-tag--info .el-tag__close { + color: #fff } -.el-table .sort-caret.ascending { - border-bottom-color: #babdc2; - top: 5px +.el-tag--dark.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #a6a9ad } -.el-table .sort-caret.descending { - border-top-color: #babdc2; - bottom: 7px +.el-tag--dark.el-tag--success { + background-color: #0daf49; + border-color: #0daf49; + color: #fff } -.el-table .ascending .sort-caret.ascending { - border-bottom-color: #006aff +.el-tag--dark.el-tag--success.is-hit { + border-color: #0daf49 } -.el-table .descending .sort-caret.descending { - border-top-color: #006aff +.el-tag--dark.el-tag--success .el-tag__close { + color: #fff } -.el-table .hidden-columns { - visibility: hidden; - position: absolute; - z-index: -1 +.el-tag--dark.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #3dbf6d } -.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell { - background: #fafafa +.el-tag--dark.el-tag--warning { + background-color: #f08614; + border-color: #f08614; + color: #fff } -.el-table--striped .el-table__body tr.el-table__row--striped.current-row td.el-table__cell { - background-color: #e6f0ff +.el-tag--dark.el-tag--warning.is-hit { + border-color: #f08614 } -.el-table__body tr.hover-row.current-row>td.el-table__cell, -.el-table__body tr.hover-row.el-table__row--striped.current-row>td.el-table__cell, -.el-table__body tr.hover-row.el-table__row--striped>td.el-table__cell, -.el-table__body tr.hover-row>td.el-table__cell { - background-color: #f5f7fa +.el-tag--dark.el-tag--warning .el-tag__close { + color: #fff } -.el-table__body tr.current-row>td.el-table__cell { - background-color: #e6f0ff +.el-tag--dark.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f39e43 } -.el-table__column-resize-proxy { - position: absolute; - left: 200px; - top: 0; - bottom: 0; - width: 0; - border-left: 1px solid #ebeef5; - z-index: 10 +.el-tag--dark.el-tag--danger { + background-color: #ff4d4f; + border-color: #ff4d4f; + color: #fff } -.el-table__column-filter-trigger { - display: inline-block; - line-height: 34px; - cursor: pointer +.el-tag--dark.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-table__column-filter-trigger i { - color: #909399; - font-size: 12px; - -webkit-transform: scale(.75); - transform: scale(.75) +.el-tag--dark.el-tag--danger .el-tag__close { + color: #fff } -.el-table--enable-row-transition .el-table__body td.el-table__cell { - -webkit-transition: background-color .25s ease; - transition: background-color .25s ease +.el-tag--dark.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff7172 } -.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell { - background-color: #f5f7fa +.el-tag--plain { + background-color: #fff; + border-color: #99c3ff; + color: #006aff } -.el-table--fluid-height .el-table__fixed, -.el-table--fluid-height .el-table__fixed-right { - bottom: 0; - overflow: hidden +.el-tag--plain.is-hit { + border-color: #006aff } -.el-table [class*=el-table__row--level] .el-table__expand-icon { - display: inline-block; - width: 20px; - line-height: 20px; - height: 20px; - text-align: center; - margin-right: 3px +.el-tag--plain .el-tag__close { + color: #006aff } -.el-checkbox { - color: #606266; - font-weight: 500; - font-size: 14px; - position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - margin-right: 30px +.el-tag--plain .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-checkbox.is-bordered { - padding: 9px 20px 9px 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - line-height: normal; - height: 40px +.el-tag--plain.el-tag--info { + background-color: #fff; + border-color: #d3d4d6; + color: #909399 } -.el-checkbox.is-bordered.is-checked { - border-color: #006aff +.el-tag--plain.el-tag--info.is-hit { + border-color: #909399 } -.el-checkbox.is-bordered.is-disabled { - border-color: #ebeef5; - cursor: not-allowed +.el-tag--plain.el-tag--info .el-tag__close { + color: #909399 } -.el-checkbox.is-bordered+.el-checkbox.is-bordered { - margin-left: 10px +.el-tag--plain.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-checkbox.is-bordered.el-checkbox--medium { - padding: 7px 20px 7px 10px; - border-radius: 4px; - height: 36px +.el-tag--plain.el-tag--success { + background-color: #fff; + border-color: #9edfb6; + color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { - line-height: 17px; - font-size: 14px +.el-tag--plain.el-tag--success.is-hit { + border-color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { - height: 14px; - width: 14px +.el-tag--plain.el-tag--success .el-tag__close { + color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--small { - padding: 5px 15px 5px 10px; - border-radius: 3px; - height: 32px +.el-tag--plain.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { - line-height: 15px; - font-size: 12px +.el-tag--plain.el-tag--warning { + background-color: #fff; + border-color: #f9cfa1; + color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { - height: 12px; - width: 12px +.el-tag--plain.el-tag--warning.is-hit { + border-color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-tag--plain.el-tag--warning .el-tag__close { + color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--mini { - padding: 3px 15px 3px 10px; - border-radius: 3px; - height: 28px +.el-tag--plain.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { - line-height: 12px; - font-size: 12px +.el-tag--plain.el-tag--danger { + background-color: #fff; + border-color: #ffb8b9; + color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { - height: 12px; - width: 12px +.el-tag--plain.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-tag--plain.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-checkbox__input { - white-space: nowrap; - cursor: pointer; - outline: 0; - display: inline-block; - line-height: 1; - position: relative; - vertical-align: middle +.el-tag--plain.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-checkbox__input.is-disabled .el-checkbox__inner { - background-color: #edf2fc; - border-color: #dfe2e6; - cursor: not-allowed +.el-tag--medium { + height: 28px; + line-height: 26px } -.el-checkbox__input.is-disabled .el-checkbox__inner::after { - cursor: not-allowed; - border-color: #babdc2 +.el-tag--medium .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { - cursor: not-allowed +.el-tag--small { + height: 24px; + padding: 0 8px; + line-height: 22px } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-tag--small .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { - border-color: #babdc2 +.el-tag--mini { + height: 20px; + padding: 0 5px; + line-height: 19px } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-tag--mini .el-icon-close { + margin-left: -3px; + -webkit-transform: scale(.7); + transform: scale(.7) } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { - background-color: #babdc2; - border-color: #babdc2 +.el-table-column--selection .cell { + padding-left: 14px; + padding-right: 14px } -.el-checkbox__input.is-disabled+span.el-checkbox__label { - color: #babdc2; - cursor: not-allowed +.el-table-filter { + border: solid 1px #ebeef5; + border-radius: 2px; + background-color: #fff; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 2px 0 } -.el-checkbox__input.is-checked .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-table-filter__list { + padding: 5px 0; + margin: 0; + list-style: none; + min-width: 100px } -.el-checkbox__input.is-checked .el-checkbox__inner::after { - -webkit-transform: rotate(45deg) scaleY(1); - transform: rotate(45deg) scaleY(1) +.el-table-filter__list-item { + line-height: 36px; + padding: 0 10px; + cursor: pointer; + font-size: 14px } -.el-checkbox__input.is-checked+.el-checkbox__label { - color: #006aff +.el-table-filter__list-item:hover { + background-color: #e6f0ff; + color: #38f } -.el-checkbox__input.is-focus .el-checkbox__inner { - border-color: #006aff +.el-table-filter__list-item.is-active { + background-color: #006aff; + color: #fff } -.el-checkbox__input.is-indeterminate .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-table-filter__content { + min-width: 100px } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { - content: ''; - position: absolute; - display: block; - background-color: #fff; - height: 2px; - -webkit-transform: scale(.5); - transform: scale(.5); - left: 0; - right: 0; - top: 5px +.el-table-filter__bottom { + border-top: 1px solid #ebeef5; + padding: 8px } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { - display: none +.el-table-filter__bottom button { + background: 0 0; + border: none; + color: #606266; + cursor: pointer; + font-size: 13px; + padding: 0 3px } -.el-checkbox__inner { - display: inline-block; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 2px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 14px; - height: 14px; - background-color: #fff; - z-index: 1; - -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); - transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) +.el-table-filter__bottom button:hover { + color: #006aff } -.el-checkbox__inner:hover { - border-color: #006aff +.el-table-filter__bottom button:focus { + outline: 0 } -.el-checkbox__inner::after { - -webkit-box-sizing: content-box; - box-sizing: content-box; - content: ""; - border: 1px solid #fff; - border-left: 0; - border-top: 0; - height: 7px; - left: 4px; - position: absolute; - top: 1px; - -webkit-transform: rotate(45deg) scaleY(0); - transform: rotate(45deg) scaleY(0); - width: 3px; - -webkit-transition: -webkit-transform .15s ease-in .05s; - transition: -webkit-transform .15s ease-in .05s; - transition: transform .15s ease-in .05s; - transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; - -webkit-transform-origin: center; - transform-origin: center +.el-table-filter__bottom button.is-disabled { + color: #babdc2; + cursor: not-allowed } -.el-checkbox__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - width: 0; - height: 0; - z-index: -1 +.el-table-filter__wrap { + max-height: 280px } -.el-checkbox__label { - display: inline-block; - padding-left: 10px; - line-height: 19px; - font-size: 14px +.el-table-filter__checkbox-group { + padding: 10px } -.el-checkbox:last-of-type { - margin-right: 0 +.el-table-filter__checkbox-group label.el-checkbox { + display: block; + margin-right: 5px; + margin-bottom: 8px; + margin-left: 5px } -.el-checkbox-button { - position: relative; - display: inline-block +.el-table-filter__checkbox-group .el-checkbox:last-child { + margin-bottom: 0 } -.el-checkbox-button__inner { - display: inline-block; - line-height: 1; - font-weight: 500; - white-space: nowrap; - vertical-align: middle; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-left: 0; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - position: relative; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - -moz-user-select: none; +.el-date-table { + font-size: 12px; -webkit-user-select: none; + -moz-user-select: none; -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 0 -} - -.el-checkbox-button__inner.is-round { - padding: 12px 20px + user-select: none } -.el-checkbox-button__inner:hover { - color: #006aff +.el-date-table.is-week-mode .el-date-table__row:hover div { + background-color: #f2f6fc } -.el-checkbox-button__inner [class*=el-icon-] { - line-height: .9 +.el-date-table.is-week-mode .el-date-table__row:hover td.available:hover { + color: #606266 } -.el-checkbox-button__inner [class*=el-icon-]+span { - margin-left: 5px +.el-date-table.is-week-mode .el-date-table__row:hover td:first-child div { + margin-left: 5px; + border-top-left-radius: 15px; + border-bottom-left-radius: 15px } -.el-checkbox-button__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - z-index: -1 +.el-date-table.is-week-mode .el-date-table__row:hover td:last-child div { + margin-right: 5px; + border-top-right-radius: 15px; + border-bottom-right-radius: 15px } -.el-checkbox-button.is-checked .el-checkbox-button__inner { - color: #fff; - background-color: #006aff; - border-color: #006aff; - -webkit-box-shadow: -1px 0 0 0 #66a6ff; - box-shadow: -1px 0 0 0 #66a6ff +.el-date-table.is-week-mode .el-date-table__row.current div { + background-color: #f2f6fc } -.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { - border-left-color: #006aff +.el-date-table td { + width: 32px; + height: 30px; + padding: 4px 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; + text-align: center; + cursor: pointer; + position: relative } -.el-checkbox-button.is-disabled .el-checkbox-button__inner { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5; - -webkit-box-shadow: none; - box-shadow: none +.el-date-table td div { + height: 30px; + padding: 3px 0; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { - border-left-color: #ebeef5 +.el-date-table td span { + width: 24px; + height: 24px; + display: block; + margin: 0 auto; + line-height: 24px; + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + border-radius: 50% } -.el-checkbox-button:first-child .el-checkbox-button__inner { - border-left: 1px solid #dfe2e6; - border-radius: 4px 0 0 4px; - -webkit-box-shadow: none !important; - box-shadow: none !important +.el-date-table td.next-month, +.el-date-table td.prev-month { + color: #babdc2 } -.el-checkbox-button.is-focus .el-checkbox-button__inner { - border-color: #006aff +.el-date-table td.today { + position: relative } -.el-checkbox-button:last-child .el-checkbox-button__inner { - border-radius: 0 4px 4px 0 +.el-date-table td.today span { + color: #006aff; + font-weight: 700 } -.el-checkbox-button--medium .el-checkbox-button__inner { - padding: 10px 20px; - font-size: 14px; - border-radius: 0 +.el-date-table td.today.end-date span, +.el-date-table td.today.start-date span { + color: #fff } -.el-checkbox-button--medium .el-checkbox-button__inner.is-round { - padding: 10px 20px +.el-date-table td.available:hover { + color: #006aff } -.el-checkbox-button--small .el-checkbox-button__inner { - padding: 9px 15px; - font-size: 12px; - border-radius: 0 +.el-date-table td.in-range div { + background-color: #f2f6fc } -.el-checkbox-button--small .el-checkbox-button__inner.is-round { - padding: 9px 15px +.el-date-table td.in-range div:hover { + background-color: #f2f6fc } -.el-checkbox-button--mini .el-checkbox-button__inner { - padding: 7px 15px; - font-size: 12px; - border-radius: 0 +.el-date-table td.current:not(.disabled) span { + color: #fff; + background-color: #006aff } -.el-checkbox-button--mini .el-checkbox-button__inner.is-round { - padding: 7px 15px +.el-date-table td.end-date div, +.el-date-table td.start-date div { + color: #fff } -.el-checkbox-group { - font-size: 0 +.el-date-table td.end-date span, +.el-date-table td.start-date span { + background-color: #006aff } -.el-tag { - background-color: #e6f0ff; - border-color: #cce1ff; - color: #006aff; - display: inline-block; - height: 32px; - padding: 0 10px; - line-height: 30px; - font-size: 12px; - color: #006aff; - border-width: 1px; - border-style: solid; - border-radius: 4px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - white-space: nowrap +.el-date-table td.start-date div { + margin-left: 5px; + border-top-left-radius: 15px; + border-bottom-left-radius: 15px } -.el-tag.is-hit { - border-color: #006aff +.el-date-table td.end-date div { + margin-right: 5px; + border-top-right-radius: 15px; + border-bottom-right-radius: 15px } -.el-tag .el-tag__close { - color: #006aff +.el-date-table td.disabled div { + background-color: #f5f7fa; + opacity: 1; + cursor: not-allowed; + color: #babdc2 } -.el-tag .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-date-table td.selected div { + margin-left: 5px; + margin-right: 5px; + background-color: #f2f6fc; + border-radius: 15px } -.el-tag.el-tag--info { - background-color: #f4f4f5; - border-color: #e9e9eb; - color: #909399 +.el-date-table td.selected div:hover { + background-color: #f2f6fc } -.el-tag.el-tag--info.is-hit { - border-color: #909399 +.el-date-table td.selected span { + background-color: #006aff; + color: #fff; + border-radius: 15px } -.el-tag.el-tag--info .el-tag__close { - color: #909399 +.el-date-table td.week { + font-size: 80%; + color: #606266 } -.el-tag.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-date-table th { + padding: 5px; + color: #606266; + font-weight: 400; + border-bottom: solid 1px #ebeef5 } -.el-tag.el-tag--success { - background-color: #e7f7ed; - border-color: #cfefdb; - color: #0daf49 +.el-month-table { + font-size: 12px; + margin: -1px; + border-collapse: collapse } -.el-tag.el-tag--success.is-hit { - border-color: #0daf49 +.el-month-table td { + text-align: center; + padding: 8px 0; + cursor: pointer } -.el-tag.el-tag--success .el-tag__close { - color: #0daf49 +.el-month-table td div { + height: 48px; + padding: 6px 0; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-tag.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-month-table td.today .cell { + color: #006aff; + font-weight: 700 } -.el-tag.el-tag--warning { - background-color: #fef3e8; - border-color: #fce7d0; - color: #f08614 +.el-month-table td.today.end-date .cell, +.el-month-table td.today.start-date .cell { + color: #fff } -.el-tag.el-tag--warning.is-hit { - border-color: #f08614 +.el-month-table td.disabled .cell { + background-color: #f5f7fa; + cursor: not-allowed; + color: #babdc2 } -.el-tag.el-tag--warning .el-tag__close { - color: #f08614 +.el-month-table td.disabled .cell:hover { + color: #babdc2 } -.el-tag.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-month-table td .cell { + width: 60px; + height: 36px; + display: block; + line-height: 36px; + color: #606266; + margin: 0 auto; + border-radius: 18px } -.el-tag.el-tag--danger { - background-color: #ffeded; - border-color: #ffdbdc; - color: #ff4d4f +.el-month-table td .cell:hover { + color: #006aff } -.el-tag.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-month-table td.in-range div { + background-color: #f2f6fc } -.el-tag.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-month-table td.in-range div:hover { + background-color: #f2f6fc } -.el-tag.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-month-table td.end-date div, +.el-month-table td.start-date div { + color: #fff } -.el-tag .el-icon-close { - border-radius: 50%; - text-align: center; - position: relative; - cursor: pointer; - font-size: 12px; - height: 16px; - width: 16px; - line-height: 16px; - vertical-align: middle; - top: -1px; - right: -5px +.el-month-table td.end-date .cell, +.el-month-table td.start-date .cell { + color: #fff; + background-color: #006aff } -.el-tag .el-icon-close::before { - display: block +.el-month-table td.start-date div { + border-top-left-radius: 24px; + border-bottom-left-radius: 24px } -.el-tag--dark { - background-color: #006aff; - border-color: #006aff; - color: #fff -} - -.el-tag--dark.is-hit { - border-color: #006aff +.el-month-table td.end-date div { + border-top-right-radius: 24px; + border-bottom-right-radius: 24px } -.el-tag--dark .el-tag__close { - color: #fff +.el-month-table td.current:not(.disabled) .cell { + color: #006aff } -.el-tag--dark .el-tag__close:hover { - color: #fff; - background-color: #38f +.el-year-table { + font-size: 12px; + margin: -1px; + border-collapse: collapse } -.el-tag--dark.el-tag--info { - background-color: #909399; - border-color: #909399; - color: #fff +.el-year-table .el-icon { + color: #1e2226 } -.el-tag--dark.el-tag--info.is-hit { - border-color: #909399 +.el-year-table td { + text-align: center; + padding: 20px 3px; + cursor: pointer } -.el-tag--dark.el-tag--info .el-tag__close { - color: #fff +.el-year-table td.today .cell { + color: #006aff; + font-weight: 700 } -.el-tag--dark.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #a6a9ad +.el-year-table td.disabled .cell { + background-color: #f5f7fa; + cursor: not-allowed; + color: #babdc2 } -.el-tag--dark.el-tag--success { - background-color: #0daf49; - border-color: #0daf49; - color: #fff +.el-year-table td.disabled .cell:hover { + color: #babdc2 } -.el-tag--dark.el-tag--success.is-hit { - border-color: #0daf49 +.el-year-table td .cell { + width: 48px; + height: 32px; + display: block; + line-height: 32px; + color: #606266; + margin: 0 auto } -.el-tag--dark.el-tag--success .el-tag__close { - color: #fff +.el-year-table td .cell:hover { + color: #006aff } -.el-tag--dark.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #3dbf6d +.el-year-table td.current:not(.disabled) .cell { + color: #006aff } -.el-tag--dark.el-tag--warning { - background-color: #f08614; - border-color: #f08614; - color: #fff +.el-time-spinner.has-seconds .el-time-spinner__wrapper { + width: 33.3% } -.el-tag--dark.el-tag--warning.is-hit { - border-color: #f08614 +.el-time-spinner__wrapper { + max-height: 190px; + overflow: auto; + display: inline-block; + width: 50%; + vertical-align: top; + position: relative } -.el-tag--dark.el-tag--warning .el-tag__close { - color: #fff +.el-time-spinner__wrapper .el-scrollbar__wrap:not(.el-scrollbar__wrap--hidden-default) { + padding-bottom: 15px } -.el-tag--dark.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f39e43 +.el-time-spinner__wrapper.is-arrow { + -webkit-box-sizing: border-box; + box-sizing: border-box; + text-align: center; + overflow: hidden } -.el-tag--dark.el-tag--danger { - background-color: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-time-spinner__wrapper.is-arrow .el-time-spinner__list { + -webkit-transform: translateY(-32px); + transform: translateY(-32px) } -.el-tag--dark.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-time-spinner__wrapper.is-arrow .el-time-spinner__item:hover:not(.disabled):not(.active) { + background: #fff; + cursor: default } -.el-tag--dark.el-tag--danger .el-tag__close { - color: #fff +.el-time-spinner__arrow { + font-size: 12px; + color: #1e2226; + position: absolute; + left: 0; + width: 100%; + z-index: 1; + text-align: center; + height: 30px; + line-height: 30px; + cursor: pointer } -.el-tag--dark.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff7172 +.el-time-spinner__arrow:hover { + color: #006aff } -.el-tag--plain { - background-color: #fff; - border-color: #99c3ff; - color: #006aff +.el-time-spinner__arrow.el-icon-arrow-up { + top: 10px } -.el-tag--plain.is-hit { - border-color: #006aff +.el-time-spinner__arrow.el-icon-arrow-down { + bottom: 10px } -.el-tag--plain .el-tag__close { - color: #006aff +.el-time-spinner__input.el-input { + width: 70% } -.el-tag--plain .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-time-spinner__input.el-input .el-input__inner { + padding: 0; + text-align: center } -.el-tag--plain.el-tag--info { - background-color: #fff; - border-color: #d3d4d6; - color: #909399 +.el-time-spinner__list { + padding: 0; + margin: 0; + list-style: none; + text-align: center } -.el-tag--plain.el-tag--info.is-hit { - border-color: #909399 +.el-time-spinner__list::after, +.el-time-spinner__list::before { + content: ''; + display: block; + width: 100%; + height: 80px } -.el-tag--plain.el-tag--info .el-tag__close { - color: #909399 +.el-time-spinner__item { + height: 32px; + line-height: 32px; + font-size: 12px; + color: #606266 } -.el-tag--plain.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-time-spinner__item:hover:not(.disabled):not(.active) { + background: #f5f7fa; + cursor: pointer } -.el-tag--plain.el-tag--success { - background-color: #fff; - border-color: #9edfb6; - color: #0daf49 +.el-time-spinner__item.active:not(.disabled) { + color: #1e2226; + font-weight: 700 } -.el-tag--plain.el-tag--success.is-hit { - border-color: #0daf49 +.el-time-spinner__item.disabled { + color: #babdc2; + cursor: not-allowed } -.el-tag--plain.el-tag--success .el-tag__close { - color: #0daf49 +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-tag--plain.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.fade-in-linear-enter, +.fade-in-linear-leave, +.fade-in-linear-leave-active { + opacity: 0 } -.el-tag--plain.el-tag--warning { - background-color: #fff; - border-color: #f9cfa1; - color: #f08614 +.el-fade-in-linear-enter-active, +.el-fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-tag--plain.el-tag--warning.is-hit { - border-color: #f08614 +.el-fade-in-linear-enter, +.el-fade-in-linear-leave, +.el-fade-in-linear-leave-active { + opacity: 0 } -.el-tag--plain.el-tag--warning .el-tag__close { - color: #f08614 +.el-fade-in-enter-active, +.el-fade-in-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-tag--plain.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-fade-in-enter, +.el-fade-in-leave-active { + opacity: 0 } -.el-tag--plain.el-tag--danger { - background-color: #fff; - border-color: #ffb8b9; - color: #ff4d4f +.el-zoom-in-center-enter-active, +.el-zoom-in-center-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-tag--plain.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-zoom-in-center-enter, +.el-zoom-in-center-leave-active { + opacity: 0; + -webkit-transform: scaleX(0); + transform: scaleX(0) } -.el-tag--plain.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-zoom-in-top-enter-active, +.el-zoom-in-top-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center top; + transform-origin: center top } -.el-tag--plain.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-zoom-in-top-enter, +.el-zoom-in-top-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-tag--medium { - height: 28px; - line-height: 26px +.el-zoom-in-bottom-enter-active, +.el-zoom-in-bottom-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center bottom; + transform-origin: center bottom } -.el-tag--medium .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-zoom-in-bottom-enter, +.el-zoom-in-bottom-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-tag--small { - height: 24px; - padding: 0 8px; - line-height: 22px +.el-zoom-in-left-enter-active, +.el-zoom-in-left-leave-active { + opacity: 1; + -webkit-transform: scale(1, 1); + transform: scale(1, 1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: top left; + transform-origin: top left } -.el-tag--small .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-zoom-in-left-enter, +.el-zoom-in-left-leave-active { + opacity: 0; + -webkit-transform: scale(.45, .45); + transform: scale(.45, .45) } -.el-tag--mini { - height: 20px; - padding: 0 5px; - line-height: 19px +.collapse-transition { + -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; + transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out } -.el-tag--mini .el-icon-close { - margin-left: -3px; - -webkit-transform: scale(.7); - transform: scale(.7) +.horizontal-collapse-transition { + -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; + transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out } -.el-table-column--selection .cell { - padding-left: 14px; - padding-right: 14px +.el-list-enter-active, +.el-list-leave-active { + -webkit-transition: all 1s; + transition: all 1s } -.el-table-filter { - border: solid 1px #ebeef5; - border-radius: 2px; - background-color: #fff; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - -webkit-box-sizing: border-box; - box-sizing: border-box; - margin: 2px 0 +.el-list-enter, +.el-list-leave-active { + opacity: 0; + -webkit-transform: translateY(-30px); + transform: translateY(-30px) } -.el-table-filter__list { - padding: 5px 0; - margin: 0; - list-style: none; - min-width: 100px +.el-opacity-transition { + -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); + transition: opacity .3s cubic-bezier(.55, 0, .1, 1) } -.el-table-filter__list-item { - line-height: 36px; - padding: 0 10px; - cursor: pointer; - font-size: 14px +.el-date-editor { + position: relative; + display: inline-block; + text-align: left } -.el-table-filter__list-item:hover { - background-color: #e6f0ff; - color: #38f +.el-date-editor.el-input, +.el-date-editor.el-input__inner { + width: 220px } -.el-table-filter__list-item.is-active { - background-color: #006aff; - color: #fff +.el-date-editor--monthrange.el-input, +.el-date-editor--monthrange.el-input__inner { + width: 300px } -.el-table-filter__content { - min-width: 100px +.el-date-editor--daterange.el-input, +.el-date-editor--daterange.el-input__inner, +.el-date-editor--timerange.el-input, +.el-date-editor--timerange.el-input__inner { + width: 350px } -.el-table-filter__bottom { - border-top: 1px solid #ebeef5; - padding: 8px +.el-date-editor--datetimerange.el-input, +.el-date-editor--datetimerange.el-input__inner { + width: 400px } -.el-table-filter__bottom button { - background: 0 0; - border: none; - color: #606266; - cursor: pointer; - font-size: 13px; - padding: 0 3px +.el-date-editor--dates .el-input__inner { + text-overflow: ellipsis; + white-space: nowrap } -.el-table-filter__bottom button:hover { - color: #006aff +.el-date-editor .el-icon-circle-close { + cursor: pointer } -.el-table-filter__bottom button:focus { - outline: 0 +.el-date-editor .el-range__icon { + font-size: 14px; + margin-left: -5px; + color: #babdc2; + float: left; + line-height: 32px } -.el-table-filter__bottom button.is-disabled { - color: #babdc2; - cursor: not-allowed +.el-date-editor .el-range-input { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; + outline: 0; + display: inline-block; + height: 100%; + margin: 0; + padding: 0; + width: 39%; + text-align: center; + font-size: 14px; + color: #606266 } -.el-table-filter__wrap { - max-height: 280px +.el-date-editor .el-range-input::-webkit-input-placeholder { + color: #babdc2 } -.el-table-filter__checkbox-group { - padding: 10px +.el-date-editor .el-range-input::-moz-placeholder { + color: #babdc2 } -.el-table-filter__checkbox-group label.el-checkbox { - display: block; - margin-right: 5px; - margin-bottom: 8px; - margin-left: 5px +.el-date-editor .el-range-input::-ms-input-placeholder { + color: #babdc2 } -.el-table-filter__checkbox-group .el-checkbox:last-child { - margin-bottom: 0 +.el-date-editor .el-range-input::placeholder { + color: #babdc2 } -.el-date-table { - font-size: 12px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none +.el-date-editor .el-range-separator { + display: inline-block; + height: 100%; + padding: 0 5px; + margin: 0; + text-align: center; + line-height: 32px; + font-size: 14px; + width: 5%; + color: #1e2226 } -.el-date-table.is-week-mode .el-date-table__row:hover div { - background-color: #f2f6fc +.el-date-editor .el-range__close-icon { + font-size: 14px; + color: #babdc2; + width: 25px; + display: inline-block; + float: right; + line-height: 32px } -.el-date-table.is-week-mode .el-date-table__row:hover td.available:hover { - color: #606266 +.el-range-editor.el-input__inner { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + padding: 3px 10px } -.el-date-table.is-week-mode .el-date-table__row:hover td:first-child div { - margin-left: 5px; - border-top-left-radius: 15px; - border-bottom-left-radius: 15px +.el-range-editor .el-range-input { + line-height: 1 } -.el-date-table.is-week-mode .el-date-table__row:hover td:last-child div { - margin-right: 5px; - border-top-right-radius: 15px; - border-bottom-right-radius: 15px +.el-range-editor.is-active { + border-color: #006aff } -.el-date-table.is-week-mode .el-date-table__row.current div { - background-color: #f2f6fc +.el-range-editor.is-active:hover { + border-color: #006aff } -.el-date-table td { - width: 32px; - height: 30px; - padding: 4px 0; - -webkit-box-sizing: border-box; - box-sizing: border-box; - text-align: center; - cursor: pointer; - position: relative +.el-range-editor--medium.el-input__inner { + height: 36px } -.el-date-table td div { - height: 30px; - padding: 3px 0; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-range-editor--medium .el-range-separator { + line-height: 28px; + font-size: 14px } -.el-date-table td span { - width: 24px; - height: 24px; - display: block; - margin: 0 auto; - line-height: 24px; - position: absolute; - left: 50%; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - border-radius: 50% +.el-range-editor--medium .el-range-input { + font-size: 14px } -.el-date-table td.next-month, -.el-date-table td.prev-month { - color: #babdc2 +.el-range-editor--medium .el-range__close-icon, +.el-range-editor--medium .el-range__icon { + line-height: 28px } -.el-date-table td.today { - position: relative +.el-range-editor--small.el-input__inner { + height: 32px } -.el-date-table td.today span { - color: #006aff; - font-weight: 700 +.el-range-editor--small .el-range-separator { + line-height: 24px; + font-size: 13px } -.el-date-table td.today.end-date span, -.el-date-table td.today.start-date span { - color: #fff +.el-range-editor--small .el-range-input { + font-size: 13px } -.el-date-table td.available:hover { - color: #006aff +.el-range-editor--small .el-range__close-icon, +.el-range-editor--small .el-range__icon { + line-height: 24px } -.el-date-table td.in-range div { - background-color: #f2f6fc +.el-range-editor--mini.el-input__inner { + height: 28px } -.el-date-table td.in-range div:hover { - background-color: #f2f6fc +.el-range-editor--mini .el-range-separator { + line-height: 20px; + font-size: 12px } -.el-date-table td.current:not(.disabled) span { - color: #fff; - background-color: #006aff +.el-range-editor--mini .el-range-input { + font-size: 12px } -.el-date-table td.end-date div, -.el-date-table td.start-date div { - color: #fff +.el-range-editor--mini .el-range__close-icon, +.el-range-editor--mini .el-range__icon { + line-height: 20px } -.el-date-table td.end-date span, -.el-date-table td.start-date span { - background-color: #006aff +.el-range-editor.is-disabled { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-date-table td.start-date div { - margin-left: 5px; - border-top-left-radius: 15px; - border-bottom-left-radius: 15px +.el-range-editor.is-disabled:focus, +.el-range-editor.is-disabled:hover { + border-color: #e4e7ed } -.el-date-table td.end-date div { - margin-right: 5px; - border-top-right-radius: 15px; - border-bottom-right-radius: 15px +.el-range-editor.is-disabled input { + background-color: #f5f7fa; + color: #babdc2; + cursor: not-allowed } -.el-date-table td.disabled div { - background-color: #f5f7fa; - opacity: 1; - cursor: not-allowed; +.el-range-editor.is-disabled input::-webkit-input-placeholder { color: #babdc2 } -.el-date-table td.selected div { - margin-left: 5px; - margin-right: 5px; - background-color: #f2f6fc; - border-radius: 15px +.el-range-editor.is-disabled input::-moz-placeholder { + color: #babdc2 } -.el-date-table td.selected div:hover { - background-color: #f2f6fc +.el-range-editor.is-disabled input::-ms-input-placeholder { + color: #babdc2 } -.el-date-table td.selected span { - background-color: #006aff; - color: #fff; - border-radius: 15px +.el-range-editor.is-disabled input::placeholder { + color: #babdc2 } -.el-date-table td.week { - font-size: 80%; - color: #606266 +.el-range-editor.is-disabled .el-range-separator { + color: #babdc2 } -.el-date-table th { - padding: 5px; +.el-picker-panel { color: #606266; - font-weight: 400; - border-bottom: solid 1px #ebeef5 + border: 1px solid #e4e7ed; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + background: #fff; + border-radius: 4px; + line-height: 30px; + margin: 5px 0 } -.el-month-table { - font-size: 12px; - margin: -1px; - border-collapse: collapse +.el-picker-panel__body-wrapper::after, +.el-picker-panel__body::after { + content: ""; + display: table; + clear: both } -.el-month-table td { - text-align: center; - padding: 8px 0; - cursor: pointer +.el-picker-panel__content { + position: relative; + margin: 15px } -.el-month-table td div { - height: 48px; - padding: 6px 0; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-picker-panel__footer { + border-top: 1px solid #e4e4e4; + padding: 4px; + text-align: right; + background-color: #fff; + position: relative; + font-size: 0 } -.el-month-table td.today .cell { - color: #006aff; - font-weight: 700 +.el-picker-panel__shortcut { + display: block; + width: 100%; + border: 0; + background-color: transparent; + line-height: 28px; + font-size: 14px; + color: #606266; + padding-left: 12px; + text-align: left; + outline: 0; + cursor: pointer } -.el-month-table td.today.end-date .cell, -.el-month-table td.today.start-date .cell { - color: #fff +.el-picker-panel__shortcut:hover { + color: #006aff } -.el-month-table td.disabled .cell { - background-color: #f5f7fa; - cursor: not-allowed; - color: #babdc2 +.el-picker-panel__shortcut.active { + background-color: #e6f1fe; + color: #006aff } -.el-month-table td.disabled .cell:hover { - color: #babdc2 +.el-picker-panel__btn { + border: 1px solid #dcdcdc; + color: #333; + line-height: 24px; + border-radius: 2px; + padding: 0 20px; + cursor: pointer; + background-color: transparent; + outline: 0; + font-size: 12px } -.el-month-table td .cell { - width: 60px; - height: 36px; - display: block; - line-height: 36px; - color: #606266; - margin: 0 auto; - border-radius: 18px +.el-picker-panel__btn[disabled] { + color: #ccc; + cursor: not-allowed } -.el-month-table td .cell:hover { +.el-picker-panel__icon-btn { + font-size: 12px; + color: #1e2226; + border: 0; + background: 0 0; + cursor: pointer; + outline: 0; + margin-top: 8px +} + +.el-picker-panel__icon-btn:hover { color: #006aff } -.el-month-table td.in-range div { - background-color: #f2f6fc +.el-picker-panel__icon-btn.is-disabled { + color: #bbb } -.el-month-table td.in-range div:hover { - background-color: #f2f6fc +.el-picker-panel__icon-btn.is-disabled:hover { + cursor: not-allowed } -.el-month-table td.end-date div, -.el-month-table td.start-date div { - color: #fff +.el-picker-panel__link-btn { + vertical-align: middle } -.el-month-table td.end-date .cell, -.el-month-table td.start-date .cell { - color: #fff; - background-color: #006aff +.el-picker-panel [slot=sidebar], +.el-picker-panel__sidebar { + position: absolute; + top: 0; + bottom: 0; + width: 110px; + border-right: 1px solid #e4e4e4; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding-top: 6px; + background-color: #fff; + overflow: auto } -.el-month-table td.start-date div { - border-top-left-radius: 24px; - border-bottom-left-radius: 24px +.el-picker-panel [slot=sidebar]+.el-picker-panel__body, +.el-picker-panel__sidebar+.el-picker-panel__body { + margin-left: 110px } -.el-month-table td.end-date div { - border-top-right-radius: 24px; - border-bottom-right-radius: 24px +.el-date-picker { + width: 322px } -.el-month-table td.current:not(.disabled) .cell { - color: #006aff +.el-date-picker.has-sidebar.has-time { + width: 434px } -.el-year-table { - font-size: 12px; - margin: -1px; - border-collapse: collapse +.el-date-picker.has-sidebar { + width: 438px } -.el-year-table .el-icon { - color: #1e2226 +.el-date-picker.has-time .el-picker-panel__body-wrapper { + position: relative } -.el-year-table td { - text-align: center; - padding: 20px 3px; - cursor: pointer +.el-date-picker .el-picker-panel__content { + width: 292px } -.el-year-table td.today .cell { - color: #006aff; - font-weight: 700 +.el-date-picker table { + table-layout: fixed; + width: 100% } -.el-year-table td.disabled .cell { - background-color: #f5f7fa; - cursor: not-allowed; - color: #babdc2 +.el-date-picker__editor-wrap { + position: relative; + display: table-cell; + padding: 0 5px } -.el-year-table td.disabled .cell:hover { - color: #babdc2 +.el-date-picker__time-header { + position: relative; + border-bottom: 1px solid #e4e4e4; + font-size: 12px; + padding: 8px 5px 5px 5px; + display: table; + width: 100%; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-year-table td .cell { - width: 48px; - height: 32px; - display: block; - line-height: 32px; - color: #606266; - margin: 0 auto +.el-date-picker__header { + margin: 12px; + text-align: center } -.el-year-table td .cell:hover { - color: #006aff +.el-date-picker__header--bordered { + margin-bottom: 0; + padding-bottom: 12px; + border-bottom: solid 1px #ebeef5 } -.el-year-table td.current:not(.disabled) .cell { - color: #006aff +.el-date-picker__header--bordered+.el-picker-panel__content { + margin-top: 0 } -.el-time-spinner.has-seconds .el-time-spinner__wrapper { - width: 33.3% +.el-date-picker__header-label { + font-size: 16px; + font-weight: 500; + padding: 0 5px; + line-height: 22px; + text-align: center; + cursor: pointer; + color: #606266 } -.el-time-spinner__wrapper { - max-height: 190px; - overflow: auto; - display: inline-block; - width: 50%; - vertical-align: top; - position: relative +.el-date-picker__header-label:hover { + color: #006aff } -.el-time-spinner__wrapper .el-scrollbar__wrap:not(.el-scrollbar__wrap--hidden-default) { - padding-bottom: 15px +.el-date-picker__header-label.active { + color: #006aff } -.el-time-spinner__wrapper.is-arrow { - -webkit-box-sizing: border-box; - box-sizing: border-box; - text-align: center; - overflow: hidden +.el-date-picker__prev-btn { + float: left } -.el-time-spinner__wrapper.is-arrow .el-time-spinner__list { - -webkit-transform: translateY(-32px); - transform: translateY(-32px) +.el-date-picker__next-btn { + float: right } -.el-time-spinner__wrapper.is-arrow .el-time-spinner__item:hover:not(.disabled):not(.active) { - background: #fff; - cursor: default +.el-date-picker__time-wrap { + padding: 10px; + text-align: center } -.el-time-spinner__arrow { - font-size: 12px; - color: #1e2226; - position: absolute; - left: 0; - width: 100%; - z-index: 1; - text-align: center; - height: 30px; +.el-date-picker__time-label { + float: left; + cursor: pointer; line-height: 30px; - cursor: pointer + margin-left: 10px } -.el-time-spinner__arrow:hover { - color: #006aff +.el-date-range-picker { + width: 646px } -.el-time-spinner__arrow.el-icon-arrow-up { - top: 10px +.el-date-range-picker.has-sidebar { + width: 756px } -.el-time-spinner__arrow.el-icon-arrow-down { - bottom: 10px +.el-date-range-picker table { + table-layout: fixed; + width: 100% } -.el-time-spinner__input.el-input { - width: 70% +.el-date-range-picker .el-picker-panel__body { + min-width: 513px } -.el-time-spinner__input.el-input .el-input__inner { - padding: 0; - text-align: center +.el-date-range-picker .el-picker-panel__content { + margin: 0 } -.el-time-spinner__list { - padding: 0; - margin: 0; - list-style: none; - text-align: center +.el-date-range-picker__header { + position: relative; + text-align: center; + height: 28px } -.el-time-spinner__list::after, -.el-time-spinner__list::before { - content: ''; - display: block; - width: 100%; - height: 80px +.el-date-range-picker__header [class*=arrow-left] { + float: left } -.el-time-spinner__item { - height: 32px; - line-height: 32px; - font-size: 12px; - color: #606266 +.el-date-range-picker__header [class*=arrow-right] { + float: right } -.el-time-spinner__item:hover:not(.disabled):not(.active) { - background: #f5f7fa; - cursor: pointer +.el-date-range-picker__header div { + font-size: 16px; + font-weight: 500; + margin-right: 50px } -.el-time-spinner__item.active:not(.disabled) { - color: #1e2226; - font-weight: 700 +.el-date-range-picker__content { + float: left; + width: 50%; + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + padding: 16px } -.el-time-spinner__item.disabled { - color: #babdc2; - cursor: not-allowed +.el-date-range-picker__content.is-left { + border-right: 1px solid #e4e4e4 } -.fade-in-linear-enter-active, -.fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-date-range-picker__content .el-date-range-picker__header div { + margin-left: 50px; + margin-right: 50px } -.fade-in-linear-enter, -.fade-in-linear-leave, -.fade-in-linear-leave-active { - opacity: 0 +.el-date-range-picker__editors-wrap { + -webkit-box-sizing: border-box; + box-sizing: border-box; + display: table-cell } -.el-fade-in-linear-enter-active, -.el-fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-date-range-picker__editors-wrap.is-right { + text-align: right } -.el-fade-in-linear-enter, -.el-fade-in-linear-leave, -.el-fade-in-linear-leave-active { - opacity: 0 +.el-date-range-picker__time-header { + position: relative; + border-bottom: 1px solid #e4e4e4; + font-size: 12px; + padding: 8px 5px 5px 5px; + display: table; + width: 100%; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-fade-in-enter-active, -.el-fade-in-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-date-range-picker__time-header>.el-icon-arrow-right { + font-size: 20px; + vertical-align: middle; + display: table-cell; + color: #1e2226 } -.el-fade-in-enter, -.el-fade-in-leave-active { - opacity: 0 +.el-date-range-picker__time-picker-wrap { + position: relative; + display: table-cell; + padding: 0 5px } -.el-zoom-in-center-enter-active, -.el-zoom-in-center-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-date-range-picker__time-picker-wrap .el-picker-panel { + position: absolute; + top: 13px; + right: 0; + z-index: 1; + background: #fff } -.el-zoom-in-center-enter, -.el-zoom-in-center-leave-active { - opacity: 0; - -webkit-transform: scaleX(0); - transform: scaleX(0) +.el-time-range-picker { + width: 354px; + overflow: visible } -.el-zoom-in-top-enter-active, -.el-zoom-in-top-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center top; - transform-origin: center top +.el-time-range-picker__content { + position: relative; + text-align: center; + padding: 10px } -.el-zoom-in-top-enter, -.el-zoom-in-top-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-time-range-picker__cell { + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + padding: 4px 7px 7px; + width: 50%; + display: inline-block } -.el-zoom-in-bottom-enter-active, -.el-zoom-in-bottom-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center bottom; - transform-origin: center bottom +.el-time-range-picker__header { + margin-bottom: 5px; + text-align: center; + font-size: 14px } -.el-zoom-in-bottom-enter, -.el-zoom-in-bottom-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-time-range-picker__body { + border-radius: 2px; + border: 1px solid #e4e7ed } -.el-zoom-in-left-enter-active, -.el-zoom-in-left-leave-active { - opacity: 1; - -webkit-transform: scale(1, 1); - transform: scale(1, 1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: top left; - transform-origin: top left +.el-time-panel { + margin: 5px 0; + border: solid 1px #e4e7ed; + background-color: #fff; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + border-radius: 2px; + position: absolute; + width: 180px; + left: 0; + z-index: 1000; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-box-sizing: content-box; + box-sizing: content-box } -.el-zoom-in-left-enter, -.el-zoom-in-left-leave-active { - opacity: 0; - -webkit-transform: scale(.45, .45); - transform: scale(.45, .45) +.el-time-panel__content { + font-size: 0; + position: relative; + overflow: hidden } -.collapse-transition { - -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; - transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out +.el-time-panel__content::after, +.el-time-panel__content::before { + content: ""; + top: 50%; + position: absolute; + margin-top: -15px; + height: 32px; + z-index: -1; + left: 0; + right: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding-top: 6px; + text-align: left; + border-top: 1px solid #e4e7ed; + border-bottom: 1px solid #e4e7ed } -.horizontal-collapse-transition { - -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; - transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out +.el-time-panel__content::after { + left: 50%; + margin-left: 12%; + margin-right: 12% } -.el-list-enter-active, -.el-list-leave-active { - -webkit-transition: all 1s; - transition: all 1s +.el-time-panel__content::before { + padding-left: 50%; + margin-right: 12%; + margin-left: 12% } -.el-list-enter, -.el-list-leave-active { - opacity: 0; - -webkit-transform: translateY(-30px); - transform: translateY(-30px) +.el-time-panel__content.has-seconds::after { + left: calc(100% / 3 * 2) } -.el-opacity-transition { - -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); - transition: opacity .3s cubic-bezier(.55, 0, .1, 1) +.el-time-panel__content.has-seconds::before { + padding-left: calc(100% / 3) } -.el-date-editor { +.el-time-panel__footer { + border-top: 1px solid #e4e4e4; + padding: 4px; + height: 36px; + line-height: 25px; + text-align: right; + -webkit-box-sizing: border-box; + box-sizing: border-box +} + +.el-time-panel__btn { + border: none; + line-height: 28px; + padding: 0 5px; + margin: 0 5px; + cursor: pointer; + background-color: transparent; + outline: 0; + font-size: 12px; + color: #1e2226 +} + +.el-time-panel__btn.confirm { + font-weight: 800; + color: #006aff +} + +.el-textarea { position: relative; display: inline-block; - text-align: left + width: 100%; + vertical-align: bottom; + font-size: 14px } -.el-date-editor.el-input, -.el-date-editor.el-input__inner { - width: 220px +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-date-editor--monthrange.el-input, -.el-date-editor--monthrange.el-input__inner { - width: 300px +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-date-editor--daterange.el-input, -.el-date-editor--daterange.el-input__inner, -.el-date-editor--timerange.el-input, -.el-date-editor--timerange.el-input__inner { - width: 350px +.el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-date-editor--datetimerange.el-input, -.el-date-editor--datetimerange.el-input__inner { - width: 400px +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-date-editor--dates .el-input__inner { - text-overflow: ellipsis; - white-space: nowrap +.el-textarea__inner::placeholder { + color: #babdc2 } -.el-date-editor .el-icon-circle-close { - cursor: pointer +.el-textarea__inner:hover { + border-color: #babdc2 } -.el-date-editor .el-range__icon { - font-size: 14px; - margin-left: -5px; - color: #babdc2; - float: left; - line-height: 32px +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff } -.el-date-editor .el-range-input { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - border: none; - outline: 0; - display: inline-block; - height: 100%; - margin: 0; - padding: 0; - width: 39%; - text-align: center; - font-size: 14px; - color: #606266 +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px } -.el-date-editor .el-range-input::-webkit-input-placeholder { +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed +} + +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::-moz-placeholder { +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::-ms-input-placeholder { +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::placeholder { +.el-textarea.is-disabled .el-textarea__inner::placeholder { color: #babdc2 } -.el-date-editor .el-range-separator { - display: inline-block; - height: 100%; - padding: 0 5px; - margin: 0; - text-align: center; - line-height: 32px; - font-size: 14px; - width: 5%; - color: #1e2226 +.el-textarea.is-exceed .el-textarea__inner { + border-color: #ff4d4f } -.el-date-editor .el-range__close-icon { +.el-textarea.is-exceed .el-input__count { + color: #ff4d4f +} + +.el-input { + position: relative; font-size: 14px; - color: #babdc2; - width: 25px; display: inline-block; - float: right; - line-height: 32px + width: 100% } -.el-range-editor.el-input__inner { +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px +} + +.el-input::-webkit-scrollbar:horizontal { + height: 6px +} + +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc +} + +.el-input::-webkit-scrollbar-corner { + background: #fff +} + +.el-input::-webkit-scrollbar-track { + background: #fff +} + +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px +} + +.el-input .el-input__clear { + color: #babdc2; + font-size: 14px; + cursor: pointer; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1) +} + +.el-input .el-input__clear:hover { + color: #1e2226 +} + +.el-input .el-input__count { + height: 100%; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; - padding: 3px 10px -} - -.el-range-editor .el-range-input { - line-height: 1 + color: #909399; + font-size: 12px } -.el-range-editor.is-active { - border-color: #006aff +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px } -.el-range-editor.is-active:hover { - border-color: #006aff +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + display: inline-block; + font-size: inherit; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + width: 100% } -.el-range-editor--medium.el-input__inner { - height: 36px +.el-input__inner::-ms-reveal { + display: none } -.el-range-editor--medium .el-range-separator { - line-height: 28px; - font-size: 14px +.el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-range-editor--medium .el-range-input { - font-size: 14px +.el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-range-editor--medium .el-range__close-icon, -.el-range-editor--medium .el-range__icon { - line-height: 28px +.el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.el-range-editor--small.el-input__inner { - height: 32px +.el-input__inner::placeholder { + color: #babdc2 } -.el-range-editor--small .el-range-separator { - line-height: 24px; - font-size: 13px +.el-input__inner:hover { + border-color: #babdc2 } -.el-range-editor--small .el-range-input { - font-size: 13px +.el-input__inner:focus { + outline: 0; + border-color: #006aff } -.el-range-editor--small .el-range__close-icon, -.el-range-editor--small .el-range__icon { - line-height: 24px +.el-input__suffix { + position: absolute; + height: 100%; + right: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s; + pointer-events: none } -.el-range-editor--mini.el-input__inner { - height: 28px +.el-input__suffix-inner { + pointer-events: all } -.el-range-editor--mini .el-range-separator { - line-height: 20px; - font-size: 12px +.el-input__prefix { + position: absolute; + height: 100%; + left: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s } -.el-range-editor--mini .el-range-input { - font-size: 12px +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all .3s; + transition: all .3s; + line-height: 40px } -.el-range-editor--mini .el-range__close-icon, -.el-range-editor--mini .el-range__icon { - line-height: 20px +.el-input__icon:after { + content: ''; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle } -.el-range-editor.is-disabled { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-input__validateIcon { + pointer-events: none } -.el-range-editor.is-disabled:focus, -.el-range-editor.is-disabled:hover { - border-color: #e4e7ed +.el-input.is-active .el-input__inner { + outline: 0; + border-color: #006aff } -.el-range-editor.is-disabled input { +.el-input.is-disabled .el-input__inner { background-color: #f5f7fa; + border-color: #e4e7ed; color: #babdc2; cursor: not-allowed } -.el-range-editor.is-disabled input::-webkit-input-placeholder { +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { color: #babdc2 } -.el-range-editor.is-disabled input::-moz-placeholder { +.el-input.is-disabled .el-input__inner::-moz-placeholder { color: #babdc2 } -.el-range-editor.is-disabled input::-ms-input-placeholder { +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { color: #babdc2 } -.el-range-editor.is-disabled input::placeholder { +.el-input.is-disabled .el-input__inner::placeholder { color: #babdc2 } -.el-range-editor.is-disabled .el-range-separator { - color: #babdc2 +.el-input.is-disabled .el-input__icon { + cursor: not-allowed } -.el-picker-panel { - color: #606266; - border: 1px solid #e4e7ed; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - background: #fff; - border-radius: 4px; - line-height: 30px; - margin: 5px 0 +.el-input.is-exceed .el-input__inner { + border-color: #ff4d4f } -.el-picker-panel__body-wrapper::after, -.el-picker-panel__body::after { - content: ""; - display: table; - clear: both +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #ff4d4f } -.el-picker-panel__content { - position: relative; - margin: 15px +.el-input--suffix .el-input__inner { + padding-right: 30px } -.el-picker-panel__footer { - border-top: 1px solid #e4e4e4; - padding: 4px; - text-align: right; - background-color: #fff; - position: relative; - font-size: 0 +.el-input--prefix .el-input__inner { + padding-left: 30px } -.el-picker-panel__shortcut { - display: block; - width: 100%; - border: 0; - background-color: transparent; - line-height: 28px; - font-size: 14px; - color: #606266; - padding-left: 12px; - text-align: left; - outline: 0; - cursor: pointer +.el-input--medium { + font-size: 14px } -.el-picker-panel__shortcut:hover { - color: #006aff +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px } -.el-picker-panel__shortcut.active { - background-color: #e6f1fe; - color: #006aff -} - -.el-picker-panel__btn { - border: 1px solid #dcdcdc; - color: #333; - line-height: 24px; - border-radius: 2px; - padding: 0 20px; - cursor: pointer; - background-color: transparent; - outline: 0; - font-size: 12px +.el-input--medium .el-input__icon { + line-height: 36px } -.el-picker-panel__btn[disabled] { - color: #ccc; - cursor: not-allowed +.el-input--small { + font-size: 13px } -.el-picker-panel__icon-btn { - font-size: 12px; - color: #1e2226; - border: 0; - background: 0 0; - cursor: pointer; - outline: 0; - margin-top: 8px +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px } -.el-picker-panel__icon-btn:hover { - color: #006aff +.el-input--small .el-input__icon { + line-height: 32px } -.el-picker-panel__icon-btn.is-disabled { - color: #bbb +.el-input--mini { + font-size: 12px } -.el-picker-panel__icon-btn.is-disabled:hover { - cursor: not-allowed +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px } -.el-picker-panel__link-btn { - vertical-align: middle +.el-input--mini .el-input__icon { + line-height: 28px } -.el-picker-panel [slot=sidebar], -.el-picker-panel__sidebar { - position: absolute; - top: 0; - bottom: 0; - width: 110px; - border-right: 1px solid #e4e4e4; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding-top: 6px; - background-color: #fff; - overflow: auto +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0 } -.el-picker-panel [slot=sidebar]+.el-picker-panel__body, -.el-picker-panel__sidebar+.el-picker-panel__body { - margin-left: 110px +.el-input-group>.el-input__inner { + vertical-align: middle; + display: table-cell } -.el-date-picker { - width: 322px +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap } -.el-date-picker.has-sidebar.has-time { - width: 434px +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0 } -.el-date-picker.has-sidebar { - width: 438px +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px } -.el-date-picker.has-time .el-picker-panel__body-wrapper { - position: relative +.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-date-picker .el-picker-panel__content { - width: 292px +.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-date-picker table { - table-layout: fixed; - width: 100% +.el-input-group__prepend { + border-right: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-date-picker__editor-wrap { - position: relative; - display: table-cell; - padding: 0 5px +.el-input-group__append { + border-left: 0; + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-date-picker__time-header { - position: relative; - border-bottom: 1px solid #e4e4e4; - font-size: 12px; - padding: 8px 5px 5px 5px; - display: table; - width: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-input-group--prepend .el-input__inner { + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-date-picker__header { - margin: 12px; - text-align: center +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-date-picker__header--bordered { - margin-bottom: 0; - padding-bottom: 12px; - border-bottom: solid 1px #ebeef5 +.el-input-group--append .el-input__inner { + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-date-picker__header--bordered+.el-picker-panel__content { - margin-top: 0 +.el-input-group--append .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-date-picker__header-label { - font-size: 16px; - font-weight: 500; - padding: 0 5px; - line-height: 22px; - text-align: center; - cursor: pointer; - color: #606266 +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0 } -.el-date-picker__header-label:hover { - color: #006aff +.el-scrollbar { + overflow: hidden; + position: relative } -.el-date-picker__header-label.active { - color: #006aff +.el-scrollbar:active>.el-scrollbar__bar, +.el-scrollbar:focus>.el-scrollbar__bar, +.el-scrollbar:hover>.el-scrollbar__bar { + opacity: 1; + -webkit-transition: opacity 340ms ease-out; + transition: opacity 340ms ease-out } -.el-date-picker__prev-btn { - float: left +.el-scrollbar__wrap { + overflow: scroll; + height: 100% } -.el-date-picker__next-btn { - float: right +.el-scrollbar__wrap--hidden-default { + scrollbar-width: none } -.el-date-picker__time-wrap { - padding: 10px; - text-align: center +.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0 } -.el-date-picker__time-label { - float: left; +.el-scrollbar__thumb { + position: relative; + display: block; + width: 0; + height: 0; cursor: pointer; - line-height: 30px; - margin-left: 10px -} - -.el-date-range-picker { - width: 646px + border-radius: inherit; + background-color: rgba(30, 34, 38, .3); + -webkit-transition: .3s background-color; + transition: .3s background-color } -.el-date-range-picker.has-sidebar { - width: 756px +.el-scrollbar__thumb:hover { + background-color: rgba(30, 34, 38, .5) } -.el-date-range-picker table { - table-layout: fixed; - width: 100% +.el-scrollbar__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + -webkit-transition: opacity 120ms ease-out; + transition: opacity 120ms ease-out } -.el-date-range-picker .el-picker-panel__body { - min-width: 513px +.el-scrollbar__bar.is-vertical { + width: 6px; + top: 2px } -.el-date-range-picker .el-picker-panel__content { - margin: 0 +.el-scrollbar__bar.is-vertical>div { + width: 100% } -.el-date-range-picker__header { - position: relative; - text-align: center; - height: 28px +.el-scrollbar__bar.is-horizontal { + height: 6px; + left: 2px } -.el-date-range-picker__header [class*=arrow-left] { - float: left +.el-scrollbar__bar.is-horizontal>div { + height: 100% } -.el-date-range-picker__header [class*=arrow-right] { - float: right -} - -.el-date-range-picker__header div { - font-size: 16px; - font-weight: 500; - margin-right: 50px +.el-popper .popper__arrow, +.el-popper .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-date-range-picker__content { - float: left; - width: 50%; - -webkit-box-sizing: border-box; - box-sizing: border-box; - margin: 0; - padding: 16px +.el-popper .popper__arrow { + border-width: 6px; + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) } -.el-date-range-picker__content.is-left { - border-right: 1px solid #e4e4e4 +.el-popper .popper__arrow::after { + content: " "; + border-width: 6px } -.el-date-range-picker__content .el-date-range-picker__header div { - margin-left: 50px; - margin-right: 50px +.el-popper[x-placement^=top] { + margin-bottom: 12px } -.el-date-range-picker__editors-wrap { - -webkit-box-sizing: border-box; - box-sizing: border-box; - display: table-cell +.el-popper[x-placement^=top] .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: #ebeef5; + border-bottom-width: 0 } -.el-date-range-picker__editors-wrap.is-right { - text-align: right +.el-popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -6px; + border-top-color: #fff; + border-bottom-width: 0 } -.el-date-range-picker__time-header { - position: relative; - border-bottom: 1px solid #e4e4e4; - font-size: 12px; - padding: 8px 5px 5px 5px; - display: table; - width: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-popper[x-placement^=bottom] { + margin-top: 12px } -.el-date-range-picker__time-header>.el-icon-arrow-right { - font-size: 20px; - vertical-align: middle; - display: table-cell; - color: #1e2226 +.el-popper[x-placement^=bottom] .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: #ebeef5 } -.el-date-range-picker__time-picker-wrap { - position: relative; - display: table-cell; - padding: 0 5px +.el-popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: #fff } -.el-date-range-picker__time-picker-wrap .el-picker-panel { - position: absolute; - top: 13px; - right: 0; - z-index: 1; - background: #fff +.el-popper[x-placement^=right] { + margin-left: 12px } -.el-time-range-picker { - width: 354px; - overflow: visible +.el-popper[x-placement^=right] .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: #ebeef5; + border-left-width: 0 } -.el-time-range-picker__content { - position: relative; - text-align: center; - padding: 10px +.el-popper[x-placement^=right] .popper__arrow::after { + bottom: -6px; + left: 1px; + border-right-color: #fff; + border-left-width: 0 } -.el-time-range-picker__cell { - -webkit-box-sizing: border-box; - box-sizing: border-box; - margin: 0; - padding: 4px 7px 7px; - width: 50%; - display: inline-block +.el-popper[x-placement^=left] { + margin-right: 12px } -.el-time-range-picker__header { - margin-bottom: 5px; - text-align: center; - font-size: 14px +.el-popper[x-placement^=left] .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: #ebeef5 } -.el-time-range-picker__body { - border-radius: 2px; - border: 1px solid #e4e7ed +.el-popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: #fff } -.el-time-panel { - margin: 5px 0; - border: solid 1px #e4e7ed; - background-color: #fff; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - border-radius: 2px; - position: absolute; - width: 180px; - left: 0; - z-index: 1000; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-box-sizing: content-box; - box-sizing: content-box +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-time-panel__content { - font-size: 0; - position: relative; - overflow: hidden +.fade-in-linear-enter, +.fade-in-linear-leave, +.fade-in-linear-leave-active { + opacity: 0 } -.el-time-panel__content::after, -.el-time-panel__content::before { - content: ""; - top: 50%; - position: absolute; - margin-top: -15px; - height: 32px; - z-index: -1; - left: 0; - right: 0; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding-top: 6px; - text-align: left; - border-top: 1px solid #e4e7ed; - border-bottom: 1px solid #e4e7ed +.el-fade-in-linear-enter-active, +.el-fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-time-panel__content::after { - left: 50%; - margin-left: 12%; - margin-right: 12% +.el-fade-in-linear-enter, +.el-fade-in-linear-leave, +.el-fade-in-linear-leave-active { + opacity: 0 } -.el-time-panel__content::before { - padding-left: 50%; - margin-right: 12%; - margin-left: 12% +.el-fade-in-enter-active, +.el-fade-in-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-time-panel__content.has-seconds::after { - left: calc(100% / 3 * 2) +.el-fade-in-enter, +.el-fade-in-leave-active { + opacity: 0 } -.el-time-panel__content.has-seconds::before { - padding-left: calc(100% / 3) +.el-zoom-in-center-enter-active, +.el-zoom-in-center-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-time-panel__footer { - border-top: 1px solid #e4e4e4; - padding: 4px; - height: 36px; - line-height: 25px; - text-align: right; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-zoom-in-center-enter, +.el-zoom-in-center-leave-active { + opacity: 0; + -webkit-transform: scaleX(0); + transform: scaleX(0) } -.el-time-panel__btn { - border: none; - line-height: 28px; - padding: 0 5px; - margin: 0 5px; - cursor: pointer; - background-color: transparent; - outline: 0; - font-size: 12px; - color: #1e2226 +.el-zoom-in-top-enter-active, +.el-zoom-in-top-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center top; + transform-origin: center top } -.el-time-panel__btn.confirm { - font-weight: 800; - color: #006aff +.el-zoom-in-top-enter, +.el-zoom-in-top-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-textarea { - position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px +.el-zoom-in-bottom-enter-active, +.el-zoom-in-bottom-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center bottom; + transform-origin: center bottom } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; - border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) +.el-zoom-in-bottom-enter, +.el-zoom-in-bottom-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-zoom-in-left-enter-active, +.el-zoom-in-left-leave-active { + opacity: 1; + -webkit-transform: scale(1, 1); + transform: scale(1, 1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: top left; + transform-origin: top left } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-zoom-in-left-enter, +.el-zoom-in-left-leave-active { + opacity: 0; + -webkit-transform: scale(.45, .45); + transform: scale(.45, .45) } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.collapse-transition { + -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; + transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out } -.el-textarea__inner::placeholder { - color: #babdc2 +.horizontal-collapse-transition { + -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; + transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out } -.el-textarea__inner:hover { - border-color: #babdc2 +.el-list-enter-active, +.el-list-leave-active { + -webkit-transition: all 1s; + transition: all 1s } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff +.el-list-enter, +.el-list-leave-active { + opacity: 0; + -webkit-transform: translateY(-30px); + transform: translateY(-30px) } -.el-textarea .el-input__count { - color: #909399; - background: #fff; - position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px +.el-opacity-transition { + -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); + transition: opacity .3s cubic-bezier(.55, 0, .1, 1) } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-date-editor { + position: relative; + display: inline-block; + text-align: left } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-date-editor.el-input, +.el-date-editor.el-input__inner { + width: 220px } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-date-editor--monthrange.el-input, +.el-date-editor--monthrange.el-input__inner { + width: 300px } -.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-date-editor--daterange.el-input, +.el-date-editor--daterange.el-input__inner, +.el-date-editor--timerange.el-input, +.el-date-editor--timerange.el-input__inner { + width: 350px } -.el-textarea.is-disabled .el-textarea__inner::placeholder { - color: #babdc2 +.el-date-editor--datetimerange.el-input, +.el-date-editor--datetimerange.el-input__inner { + width: 400px } -.el-textarea.is-exceed .el-textarea__inner { - border-color: #ff4d4f +.el-date-editor--dates .el-input__inner { + text-overflow: ellipsis; + white-space: nowrap } -.el-textarea.is-exceed .el-input__count { - color: #ff4d4f +.el-date-editor .el-icon-circle-close { + cursor: pointer } -.el-input { - position: relative; +.el-date-editor .el-range__icon { font-size: 14px; - display: inline-block; - width: 100% -} - -.el-input::-webkit-scrollbar { - z-index: 11; - width: 6px + margin-left: -5px; + color: #babdc2; + float: left; + line-height: 32px } -.el-input::-webkit-scrollbar:horizontal { - height: 6px +.el-date-editor .el-range-input { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; + outline: 0; + display: inline-block; + height: 100%; + margin: 0; + padding: 0; + width: 39%; + text-align: center; + font-size: 14px; + color: #606266 } -.el-input::-webkit-scrollbar-thumb { - border-radius: 5px; - width: 6px; - background: #b4bccc +.el-date-editor .el-range-input::-webkit-input-placeholder { + color: #babdc2 } -.el-input::-webkit-scrollbar-corner { - background: #fff +.el-date-editor .el-range-input::-moz-placeholder { + color: #babdc2 } -.el-input::-webkit-scrollbar-track { - background: #fff +.el-date-editor .el-range-input::-ms-input-placeholder { + color: #babdc2 } -.el-input::-webkit-scrollbar-track-piece { - background: #fff; - width: 6px +.el-date-editor .el-range-input::placeholder { + color: #babdc2 } -.el-input .el-input__clear { - color: #babdc2; +.el-date-editor .el-range-separator { + display: inline-block; + height: 100%; + padding: 0 5px; + margin: 0; + text-align: center; + line-height: 32px; font-size: 14px; - cursor: pointer; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1) + width: 5%; + color: #1e2226 } -.el-input .el-input__clear:hover { - color: #1e2226 +.el-date-editor .el-range__close-icon { + font-size: 14px; + color: #babdc2; + width: 25px; + display: inline-block; + float: right; + line-height: 32px } -.el-input .el-input__count { - height: 100%; +.el-range-editor.el-input__inner { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; - color: #909399; - font-size: 12px + padding: 3px 10px } -.el-input .el-input__count .el-input__count-inner { - background: #fff; - line-height: initial; - display: inline-block; - padding: 0 5px +.el-range-editor .el-range-input { + line-height: 1 } -.el-input__inner { - -webkit-appearance: none; - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - display: inline-block; - font-size: inherit; - height: 40px; - line-height: 40px; - outline: 0; - padding: 0 15px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - width: 100% +.el-range-editor.is-active { + border-color: #006aff } -.el-input__inner::-ms-reveal { - display: none +.el-range-editor.is-active:hover { + border-color: #006aff } -.el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-range-editor--medium.el-input__inner { + height: 36px } -.el-input__inner::-moz-placeholder { - color: #babdc2 +.el-range-editor--medium .el-range-separator { + line-height: 28px; + font-size: 14px } -.el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-range-editor--medium .el-range-input { + font-size: 14px } -.el-input__inner::placeholder { - color: #babdc2 +.el-range-editor--medium .el-range__close-icon, +.el-range-editor--medium .el-range__icon { + line-height: 28px } -.el-input__inner:hover { - border-color: #babdc2 +.el-range-editor--small.el-input__inner { + height: 32px } -.el-input__inner:focus { - outline: 0; - border-color: #006aff +.el-range-editor--small .el-range-separator { + line-height: 24px; + font-size: 13px } -.el-input__suffix { - position: absolute; - height: 100%; - right: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s; - pointer-events: none +.el-range-editor--small .el-range-input { + font-size: 13px } -.el-input__suffix-inner { - pointer-events: all +.el-range-editor--small .el-range__close-icon, +.el-range-editor--small .el-range__icon { + line-height: 24px } -.el-input__prefix { - position: absolute; - height: 100%; - left: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s +.el-range-editor--mini.el-input__inner { + height: 28px } -.el-input__icon { - height: 100%; - width: 25px; - text-align: center; - -webkit-transition: all .3s; - transition: all .3s; - line-height: 40px +.el-range-editor--mini .el-range-separator { + line-height: 20px; + font-size: 12px } -.el-input__icon:after { - content: ''; - height: 100%; - width: 0; - display: inline-block; - vertical-align: middle +.el-range-editor--mini .el-range-input { + font-size: 12px } -.el-input__validateIcon { - pointer-events: none +.el-range-editor--mini .el-range__close-icon, +.el-range-editor--mini .el-range__icon { + line-height: 20px } -.el-input.is-active .el-input__inner { - outline: 0; - border-color: #006aff +.el-range-editor.is-disabled { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-input.is-disabled .el-input__inner { +.el-range-editor.is-disabled:focus, +.el-range-editor.is-disabled:hover { + border-color: #e4e7ed +} + +.el-range-editor.is-disabled input { background-color: #f5f7fa; - border-color: #e4e7ed; color: #babdc2; cursor: not-allowed } -.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { +.el-range-editor.is-disabled input::-webkit-input-placeholder { color: #babdc2 } -.el-input.is-disabled .el-input__inner::-moz-placeholder { +.el-range-editor.is-disabled input::-moz-placeholder { color: #babdc2 } -.el-input.is-disabled .el-input__inner::-ms-input-placeholder { +.el-range-editor.is-disabled input::-ms-input-placeholder { color: #babdc2 } -.el-input.is-disabled .el-input__inner::placeholder { +.el-range-editor.is-disabled input::placeholder { color: #babdc2 } -.el-input.is-disabled .el-input__icon { - cursor: not-allowed +.el-range-editor.is-disabled .el-range-separator { + color: #babdc2 } -.el-input.is-exceed .el-input__inner { - border-color: #ff4d4f +.el-picker-panel { + color: #606266; + border: 1px solid #e4e7ed; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + background: #fff; + border-radius: 4px; + line-height: 30px; + margin: 5px 0 } -.el-input.is-exceed .el-input__suffix .el-input__count { - color: #ff4d4f +.el-picker-panel__body-wrapper::after, +.el-picker-panel__body::after { + content: ""; + display: table; + clear: both } -.el-input--suffix .el-input__inner { - padding-right: 30px +.el-picker-panel__content { + position: relative; + margin: 15px } -.el-input--prefix .el-input__inner { - padding-left: 30px +.el-picker-panel__footer { + border-top: 1px solid #e4e4e4; + padding: 4px; + text-align: right; + background-color: #fff; + position: relative; + font-size: 0 } -.el-input--medium { - font-size: 14px +.el-picker-panel__shortcut { + display: block; + width: 100%; + border: 0; + background-color: transparent; + line-height: 28px; + font-size: 14px; + color: #606266; + padding-left: 12px; + text-align: left; + outline: 0; + cursor: pointer } -.el-input--medium .el-input__inner { - height: 36px; - line-height: 36px +.el-picker-panel__shortcut:hover { + color: #006aff } -.el-input--medium .el-input__icon { - line-height: 36px +.el-picker-panel__shortcut.active { + background-color: #e6f1fe; + color: #006aff } -.el-input--small { - font-size: 13px +.el-picker-panel__btn { + border: 1px solid #dcdcdc; + color: #333; + line-height: 24px; + border-radius: 2px; + padding: 0 20px; + cursor: pointer; + background-color: transparent; + outline: 0; + font-size: 12px } -.el-input--small .el-input__inner { - height: 32px; - line-height: 32px +.el-picker-panel__btn[disabled] { + color: #ccc; + cursor: not-allowed } -.el-input--small .el-input__icon { - line-height: 32px +.el-picker-panel__icon-btn { + font-size: 12px; + color: #1e2226; + border: 0; + background: 0 0; + cursor: pointer; + outline: 0; + margin-top: 8px } -.el-input--mini { - font-size: 12px +.el-picker-panel__icon-btn:hover { + color: #006aff } -.el-input--mini .el-input__inner { - height: 28px; - line-height: 28px +.el-picker-panel__icon-btn.is-disabled { + color: #bbb } -.el-input--mini .el-input__icon { - line-height: 28px +.el-picker-panel__icon-btn.is-disabled:hover { + cursor: not-allowed } -.el-input-group { - line-height: normal; - display: inline-table; - width: 100%; - border-collapse: separate; - border-spacing: 0 +.el-picker-panel__link-btn { + vertical-align: middle } -.el-input-group>.el-input__inner { - vertical-align: middle; - display: table-cell +.el-picker-panel [slot=sidebar], +.el-picker-panel__sidebar { + position: absolute; + top: 0; + bottom: 0; + width: 110px; + border-right: 1px solid #e4e4e4; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding-top: 6px; + background-color: #fff; + overflow: auto } -.el-input-group__append, -.el-input-group__prepend { - background-color: #f5f7fa; - color: #909399; - vertical-align: middle; - display: table-cell; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 4px; - padding: 0 20px; - width: 1px; - white-space: nowrap +.el-picker-panel [slot=sidebar]+.el-picker-panel__body, +.el-picker-panel__sidebar+.el-picker-panel__body { + margin-left: 110px } -.el-input-group__append:focus, -.el-input-group__prepend:focus { - outline: 0 +.el-date-picker { + width: 322px } -.el-input-group__append .el-button, -.el-input-group__append .el-select, -.el-input-group__prepend .el-button, -.el-input-group__prepend .el-select { - display: inline-block; - margin: -10px -20px +.el-date-picker.has-sidebar.has-time { + width: 434px } -.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-date-picker.has-sidebar { + width: 438px } -.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-date-picker.has-time .el-picker-panel__body-wrapper { + position: relative } -.el-input-group__prepend { - border-right: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-date-picker .el-picker-panel__content { + width: 292px } -.el-input-group__append { - border-left: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-date-picker table { + table-layout: fixed; + width: 100% } -.el-input-group--prepend .el-input__inner { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-date-picker__editor-wrap { + position: relative; + display: table-cell; + padding: 0 5px } -.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-date-picker__time-header { + position: relative; + border-bottom: 1px solid #e4e4e4; + font-size: 12px; + padding: 8px 5px 5px 5px; + display: table; + width: 100%; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-input-group--append .el-input__inner { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-date-picker__header { + margin: 12px; + text-align: center } -.el-input-group--append .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-date-picker__header--bordered { + margin-bottom: 0; + padding-bottom: 12px; + border-bottom: solid 1px #ebeef5 } -.el-input__inner::-ms-clear { - display: none; - width: 0; - height: 0 +.el-date-picker__header--bordered+.el-picker-panel__content { + margin-top: 0 +} + +.el-date-picker__header-label { + font-size: 16px; + font-weight: 500; + padding: 0 5px; + line-height: 22px; + text-align: center; + cursor: pointer; + color: #606266 +} + +.el-date-picker__header-label:hover { + color: #006aff +} + +.el-date-picker__header-label.active { + color: #006aff +} + +.el-date-picker__prev-btn { + float: left +} + +.el-date-picker__next-btn { + float: right +} + +.el-date-picker__time-wrap { + padding: 10px; + text-align: center +} + +.el-date-picker__time-label { + float: left; + cursor: pointer; + line-height: 30px; + margin-left: 10px } .el-scrollbar { @@ -12977,6 +13055,38 @@ border-left-color: #fff } +.time-select { + margin: 5px 0; + min-width: 0 +} + +.time-select .el-picker-panel__content { + max-height: 200px; + margin: 0 +} + +.time-select-item { + padding: 8px 10px; + font-size: 14px; + line-height: 20px +} + +.time-select-item.selected:not(.disabled) { + color: #006aff; + font-weight: 700 +} + +.time-select-item.disabled { + color: #e4e7ed; + cursor: not-allowed +} + +.time-select-item:hover { + background-color: #f5f7fa; + font-weight: 700; + cursor: pointer +} + .fade-in-linear-enter-active, .fade-in-linear-leave-active { -webkit-transition: opacity .2s linear; @@ -13442,1067 +13552,1232 @@ margin-left: 110px } -.el-date-picker { - width: 322px -} - -.el-date-picker.has-sidebar.has-time { - width: 434px +.el-time-spinner.has-seconds .el-time-spinner__wrapper { + width: 33.3% } -.el-date-picker.has-sidebar { - width: 438px +.el-time-spinner__wrapper { + max-height: 190px; + overflow: auto; + display: inline-block; + width: 50%; + vertical-align: top; + position: relative } -.el-date-picker.has-time .el-picker-panel__body-wrapper { - position: relative +.el-time-spinner__wrapper .el-scrollbar__wrap:not(.el-scrollbar__wrap--hidden-default) { + padding-bottom: 15px } -.el-date-picker .el-picker-panel__content { - width: 292px +.el-time-spinner__wrapper.is-arrow { + -webkit-box-sizing: border-box; + box-sizing: border-box; + text-align: center; + overflow: hidden } -.el-date-picker table { - table-layout: fixed; - width: 100% +.el-time-spinner__wrapper.is-arrow .el-time-spinner__list { + -webkit-transform: translateY(-32px); + transform: translateY(-32px) } -.el-date-picker__editor-wrap { - position: relative; - display: table-cell; - padding: 0 5px +.el-time-spinner__wrapper.is-arrow .el-time-spinner__item:hover:not(.disabled):not(.active) { + background: #fff; + cursor: default } -.el-date-picker__time-header { - position: relative; - border-bottom: 1px solid #e4e4e4; +.el-time-spinner__arrow { font-size: 12px; - padding: 8px 5px 5px 5px; - display: table; + color: #1e2226; + position: absolute; + left: 0; width: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box + z-index: 1; + text-align: center; + height: 30px; + line-height: 30px; + cursor: pointer } -.el-date-picker__header { - margin: 12px; - text-align: center +.el-time-spinner__arrow:hover { + color: #006aff } -.el-date-picker__header--bordered { - margin-bottom: 0; - padding-bottom: 12px; - border-bottom: solid 1px #ebeef5 +.el-time-spinner__arrow.el-icon-arrow-up { + top: 10px } -.el-date-picker__header--bordered+.el-picker-panel__content { - margin-top: 0 +.el-time-spinner__arrow.el-icon-arrow-down { + bottom: 10px } -.el-date-picker__header-label { - font-size: 16px; - font-weight: 500; - padding: 0 5px; - line-height: 22px; - text-align: center; - cursor: pointer; - color: #606266 +.el-time-spinner__input.el-input { + width: 70% } -.el-date-picker__header-label:hover { - color: #006aff +.el-time-spinner__input.el-input .el-input__inner { + padding: 0; + text-align: center } -.el-date-picker__header-label.active { - color: #006aff +.el-time-spinner__list { + padding: 0; + margin: 0; + list-style: none; + text-align: center } -.el-date-picker__prev-btn { - float: left +.el-time-spinner__list::after, +.el-time-spinner__list::before { + content: ''; + display: block; + width: 100%; + height: 80px } -.el-date-picker__next-btn { - float: right +.el-time-spinner__item { + height: 32px; + line-height: 32px; + font-size: 12px; + color: #606266 } -.el-date-picker__time-wrap { - padding: 10px; - text-align: center +.el-time-spinner__item:hover:not(.disabled):not(.active) { + background: #f5f7fa; + cursor: pointer } -.el-date-picker__time-label { - float: left; - cursor: pointer; - line-height: 30px; - margin-left: 10px +.el-time-spinner__item.active:not(.disabled) { + color: #1e2226; + font-weight: 700 } -.el-scrollbar { - overflow: hidden; - position: relative +.el-time-spinner__item.disabled { + color: #babdc2; + cursor: not-allowed } -.el-scrollbar:active>.el-scrollbar__bar, -.el-scrollbar:focus>.el-scrollbar__bar, -.el-scrollbar:hover>.el-scrollbar__bar { - opacity: 1; - -webkit-transition: opacity 340ms ease-out; - transition: opacity 340ms ease-out +.el-time-panel { + margin: 5px 0; + border: solid 1px #e4e7ed; + background-color: #fff; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + border-radius: 2px; + position: absolute; + width: 180px; + left: 0; + z-index: 1000; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + -webkit-box-sizing: content-box; + box-sizing: content-box } -.el-scrollbar__wrap { - overflow: scroll; - height: 100% +.el-time-panel__content { + font-size: 0; + position: relative; + overflow: hidden } -.el-scrollbar__wrap--hidden-default { - scrollbar-width: none +.el-time-panel__content::after, +.el-time-panel__content::before { + content: ""; + top: 50%; + position: absolute; + margin-top: -15px; + height: 32px; + z-index: -1; + left: 0; + right: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding-top: 6px; + text-align: left; + border-top: 1px solid #e4e7ed; + border-bottom: 1px solid #e4e7ed } -.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { - width: 0; - height: 0 +.el-time-panel__content::after { + left: 50%; + margin-left: 12%; + margin-right: 12% } -.el-scrollbar__thumb { - position: relative; - display: block; - width: 0; - height: 0; - cursor: pointer; - border-radius: inherit; - background-color: rgba(30, 34, 38, .3); - -webkit-transition: .3s background-color; - transition: .3s background-color +.el-time-panel__content::before { + padding-left: 50%; + margin-right: 12%; + margin-left: 12% } -.el-scrollbar__thumb:hover { - background-color: rgba(30, 34, 38, .5) +.el-time-panel__content.has-seconds::after { + left: calc(100% / 3 * 2) } -.el-scrollbar__bar { - position: absolute; - right: 2px; - bottom: 2px; - z-index: 1; - border-radius: 4px; - opacity: 0; - -webkit-transition: opacity 120ms ease-out; - transition: opacity 120ms ease-out +.el-time-panel__content.has-seconds::before { + padding-left: calc(100% / 3) } -.el-scrollbar__bar.is-vertical { - width: 6px; - top: 2px +.el-time-panel__footer { + border-top: 1px solid #e4e4e4; + padding: 4px; + height: 36px; + line-height: 25px; + text-align: right; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-scrollbar__bar.is-vertical>div { - width: 100% +.el-time-panel__btn { + border: none; + line-height: 28px; + padding: 0 5px; + margin: 0 5px; + cursor: pointer; + background-color: transparent; + outline: 0; + font-size: 12px; + color: #1e2226 } -.el-scrollbar__bar.is-horizontal { - height: 6px; - left: 2px +.el-time-panel__btn.confirm { + font-weight: 800; + color: #006aff } -.el-scrollbar__bar.is-horizontal>div { - height: 100% +.el-time-range-picker { + width: 354px; + overflow: visible } -.el-popper .popper__arrow, -.el-popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-time-range-picker__content { + position: relative; + text-align: center; + padding: 10px } -.el-popper .popper__arrow { - border-width: 6px; - -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); - filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) +.el-time-range-picker__cell { + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + padding: 4px 7px 7px; + width: 50%; + display: inline-block } -.el-popper .popper__arrow::after { - content: " "; - border-width: 6px +.el-time-range-picker__header { + margin-bottom: 5px; + text-align: center; + font-size: 14px } -.el-popper[x-placement^=top] { - margin-bottom: 12px +.el-time-range-picker__body { + border-radius: 2px; + border: 1px solid #e4e7ed } -.el-popper[x-placement^=top] .popper__arrow { - bottom: -6px; - left: 50%; - margin-right: 3px; - border-top-color: #ebeef5; - border-bottom-width: 0 +.el-textarea { + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: 14px } -.el-popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -6px; - border-top-color: #fff; - border-bottom-width: 0 +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-popper[x-placement^=bottom] { - margin-top: 12px +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-popper[x-placement^=bottom] .popper__arrow { - top: -6px; - left: 50%; - margin-right: 3px; - border-top-width: 0; - border-bottom-color: #ebeef5 +.el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -6px; - border-top-width: 0; - border-bottom-color: #fff +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-popper[x-placement^=right] { - margin-left: 12px +.el-textarea__inner::placeholder { + color: #babdc2 } -.el-popper[x-placement^=right] .popper__arrow { - top: 50%; - left: -6px; - margin-bottom: 3px; - border-right-color: #ebeef5; - border-left-width: 0 +.el-textarea__inner:hover { + border-color: #babdc2 } -.el-popper[x-placement^=right] .popper__arrow::after { - bottom: -6px; - left: 1px; - border-right-color: #fff; - border-left-width: 0 +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff } -.el-popper[x-placement^=left] { - margin-right: 12px +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px } -.el-popper[x-placement^=left] .popper__arrow { - top: 50%; - right: -6px; - margin-bottom: 3px; - border-right-width: 0; - border-left-color: #ebeef5 +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -6px; - margin-left: -6px; - border-right-width: 0; - border-left-color: #fff +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.time-select { - margin: 5px 0; - min-width: 0 +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.time-select .el-picker-panel__content { - max-height: 200px; - margin: 0 +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.time-select-item { - padding: 8px 10px; - font-size: 14px; - line-height: 20px +.el-textarea.is-disabled .el-textarea__inner::placeholder { + color: #babdc2 } -.time-select-item.selected:not(.disabled) { - color: #006aff; - font-weight: 700 +.el-textarea.is-exceed .el-textarea__inner { + border-color: #ff4d4f } -.time-select-item.disabled { - color: #e4e7ed; - cursor: not-allowed +.el-textarea.is-exceed .el-input__count { + color: #ff4d4f } -.time-select-item:hover { - background-color: #f5f7fa; - font-weight: 700; - cursor: pointer +.el-input { + position: relative; + font-size: 14px; + display: inline-block; + width: 100% } -.fade-in-linear-enter-active, -.fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px } -.fade-in-linear-enter, -.fade-in-linear-leave, -.fade-in-linear-leave-active { - opacity: 0 +.el-input::-webkit-scrollbar:horizontal { + height: 6px } -.el-fade-in-linear-enter-active, -.el-fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc } -.el-fade-in-linear-enter, -.el-fade-in-linear-leave, -.el-fade-in-linear-leave-active { - opacity: 0 +.el-input::-webkit-scrollbar-corner { + background: #fff } -.el-fade-in-enter-active, -.el-fade-in-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-input::-webkit-scrollbar-track { + background: #fff } -.el-fade-in-enter, -.el-fade-in-leave-active { - opacity: 0 +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px } -.el-zoom-in-center-enter-active, -.el-zoom-in-center-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-input .el-input__clear { + color: #babdc2; + font-size: 14px; + cursor: pointer; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1) } -.el-zoom-in-center-enter, -.el-zoom-in-center-leave-active { - opacity: 0; - -webkit-transform: scaleX(0); - transform: scaleX(0) +.el-input .el-input__clear:hover { + color: #1e2226 } -.el-zoom-in-top-enter-active, -.el-zoom-in-top-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center top; - transform-origin: center top +.el-input .el-input__count { + height: 100%; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + color: #909399; + font-size: 12px } -.el-zoom-in-top-enter, -.el-zoom-in-top-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px } -.el-zoom-in-bottom-enter-active, -.el-zoom-in-bottom-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center bottom; - transform-origin: center bottom +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + display: inline-block; + font-size: inherit; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + width: 100% } -.el-zoom-in-bottom-enter, -.el-zoom-in-bottom-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-input__inner::-ms-reveal { + display: none } -.el-zoom-in-left-enter-active, -.el-zoom-in-left-leave-active { - opacity: 1; - -webkit-transform: scale(1, 1); - transform: scale(1, 1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: top left; - transform-origin: top left +.el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-zoom-in-left-enter, -.el-zoom-in-left-leave-active { - opacity: 0; - -webkit-transform: scale(.45, .45); - transform: scale(.45, .45) +.el-input__inner::-moz-placeholder { + color: #babdc2 } -.collapse-transition { - -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; - transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out +.el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.horizontal-collapse-transition { - -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; - transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out +.el-input__inner::placeholder { + color: #babdc2 } -.el-list-enter-active, -.el-list-leave-active { - -webkit-transition: all 1s; - transition: all 1s +.el-input__inner:hover { + border-color: #babdc2 } -.el-list-enter, -.el-list-leave-active { - opacity: 0; - -webkit-transform: translateY(-30px); - transform: translateY(-30px) +.el-input__inner:focus { + outline: 0; + border-color: #006aff } -.el-opacity-transition { - -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); - transition: opacity .3s cubic-bezier(.55, 0, .1, 1) +.el-input__suffix { + position: absolute; + height: 100%; + right: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s; + pointer-events: none } -.el-date-editor { - position: relative; - display: inline-block; - text-align: left +.el-input__suffix-inner { + pointer-events: all } -.el-date-editor.el-input, -.el-date-editor.el-input__inner { - width: 220px +.el-input__prefix { + position: absolute; + height: 100%; + left: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s } -.el-date-editor--monthrange.el-input, -.el-date-editor--monthrange.el-input__inner { - width: 300px +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all .3s; + transition: all .3s; + line-height: 40px } -.el-date-editor--daterange.el-input, -.el-date-editor--daterange.el-input__inner, -.el-date-editor--timerange.el-input, -.el-date-editor--timerange.el-input__inner { - width: 350px +.el-input__icon:after { + content: ''; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle } -.el-date-editor--datetimerange.el-input, -.el-date-editor--datetimerange.el-input__inner { - width: 400px +.el-input__validateIcon { + pointer-events: none } -.el-date-editor--dates .el-input__inner { - text-overflow: ellipsis; - white-space: nowrap -} - -.el-date-editor .el-icon-circle-close { - cursor: pointer +.el-input.is-active .el-input__inner { + outline: 0; + border-color: #006aff } -.el-date-editor .el-range__icon { - font-size: 14px; - margin-left: -5px; +.el-input.is-disabled .el-input__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; color: #babdc2; - float: left; - line-height: 32px -} - -.el-date-editor .el-range-input { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - border: none; - outline: 0; - display: inline-block; - height: 100%; - margin: 0; - padding: 0; - width: 39%; - text-align: center; - font-size: 14px; - color: #606266 + cursor: not-allowed } -.el-date-editor .el-range-input::-webkit-input-placeholder { +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::-moz-placeholder { +.el-input.is-disabled .el-input__inner::-moz-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::-ms-input-placeholder { +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { color: #babdc2 } -.el-date-editor .el-range-input::placeholder { +.el-input.is-disabled .el-input__inner::placeholder { color: #babdc2 } -.el-date-editor .el-range-separator { - display: inline-block; - height: 100%; - padding: 0 5px; - margin: 0; - text-align: center; - line-height: 32px; - font-size: 14px; - width: 5%; - color: #1e2226 +.el-input.is-disabled .el-input__icon { + cursor: not-allowed } -.el-date-editor .el-range__close-icon { - font-size: 14px; - color: #babdc2; - width: 25px; - display: inline-block; - float: right; - line-height: 32px +.el-input.is-exceed .el-input__inner { + border-color: #ff4d4f } -.el-range-editor.el-input__inner { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - padding: 3px 10px +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #ff4d4f } -.el-range-editor .el-range-input { - line-height: 1 +.el-input--suffix .el-input__inner { + padding-right: 30px } -.el-range-editor.is-active { - border-color: #006aff +.el-input--prefix .el-input__inner { + padding-left: 30px } -.el-range-editor.is-active:hover { - border-color: #006aff +.el-input--medium { + font-size: 14px } -.el-range-editor--medium.el-input__inner { - height: 36px +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px } -.el-range-editor--medium .el-range-separator { - line-height: 28px; - font-size: 14px +.el-input--medium .el-input__icon { + line-height: 36px } -.el-range-editor--medium .el-range-input { - font-size: 14px +.el-input--small { + font-size: 13px } -.el-range-editor--medium .el-range__close-icon, -.el-range-editor--medium .el-range__icon { - line-height: 28px +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px } -.el-range-editor--small.el-input__inner { - height: 32px +.el-input--small .el-input__icon { + line-height: 32px } -.el-range-editor--small .el-range-separator { - line-height: 24px; - font-size: 13px +.el-input--mini { + font-size: 12px } -.el-range-editor--small .el-range-input { - font-size: 13px +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px } -.el-range-editor--small .el-range__close-icon, -.el-range-editor--small .el-range__icon { - line-height: 24px +.el-input--mini .el-input__icon { + line-height: 28px } -.el-range-editor--mini.el-input__inner { - height: 28px +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0 } -.el-range-editor--mini .el-range-separator { - line-height: 20px; - font-size: 12px +.el-input-group>.el-input__inner { + vertical-align: middle; + display: table-cell } -.el-range-editor--mini .el-range-input { - font-size: 12px +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap } -.el-range-editor--mini .el-range__close-icon, -.el-range-editor--mini .el-range__icon { - line-height: 20px +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0 } -.el-range-editor.is-disabled { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px } -.el-range-editor.is-disabled:focus, -.el-range-editor.is-disabled:hover { - border-color: #e4e7ed +.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-range-editor.is-disabled input { - background-color: #f5f7fa; - color: #babdc2; - cursor: not-allowed +.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-range-editor.is-disabled input::-webkit-input-placeholder { - color: #babdc2 +.el-input-group__prepend { + border-right: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-range-editor.is-disabled input::-moz-placeholder { - color: #babdc2 +.el-input-group__append { + border-left: 0; + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-range-editor.is-disabled input::-ms-input-placeholder { - color: #babdc2 +.el-input-group--prepend .el-input__inner { + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-range-editor.is-disabled input::placeholder { - color: #babdc2 +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-range-editor.is-disabled .el-range-separator { - color: #babdc2 +.el-input-group--append .el-input__inner { + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-picker-panel { - color: #606266; - border: 1px solid #e4e7ed; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - background: #fff; - border-radius: 4px; - line-height: 30px; - margin: 5px 0 +.el-input-group--append .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-picker-panel__body-wrapper::after, -.el-picker-panel__body::after { - content: ""; - display: table; - clear: both +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0 } -.el-picker-panel__content { - position: relative; - margin: 15px +.el-scrollbar { + overflow: hidden; + position: relative } -.el-picker-panel__footer { - border-top: 1px solid #e4e4e4; - padding: 4px; - text-align: right; - background-color: #fff; - position: relative; - font-size: 0 +.el-scrollbar:active>.el-scrollbar__bar, +.el-scrollbar:focus>.el-scrollbar__bar, +.el-scrollbar:hover>.el-scrollbar__bar { + opacity: 1; + -webkit-transition: opacity 340ms ease-out; + transition: opacity 340ms ease-out } -.el-picker-panel__shortcut { - display: block; - width: 100%; - border: 0; - background-color: transparent; - line-height: 28px; - font-size: 14px; - color: #606266; - padding-left: 12px; - text-align: left; - outline: 0; - cursor: pointer +.el-scrollbar__wrap { + overflow: scroll; + height: 100% } -.el-picker-panel__shortcut:hover { - color: #006aff +.el-scrollbar__wrap--hidden-default { + scrollbar-width: none } -.el-picker-panel__shortcut.active { - background-color: #e6f1fe; - color: #006aff +.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0 } -.el-picker-panel__btn { - border: 1px solid #dcdcdc; - color: #333; - line-height: 24px; - border-radius: 2px; - padding: 0 20px; +.el-scrollbar__thumb { + position: relative; + display: block; + width: 0; + height: 0; cursor: pointer; - background-color: transparent; - outline: 0; - font-size: 12px + border-radius: inherit; + background-color: rgba(30, 34, 38, .3); + -webkit-transition: .3s background-color; + transition: .3s background-color } -.el-picker-panel__btn[disabled] { - color: #ccc; - cursor: not-allowed +.el-scrollbar__thumb:hover { + background-color: rgba(30, 34, 38, .5) } -.el-picker-panel__icon-btn { - font-size: 12px; - color: #1e2226; - border: 0; - background: 0 0; - cursor: pointer; - outline: 0; - margin-top: 8px +.el-scrollbar__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + -webkit-transition: opacity 120ms ease-out; + transition: opacity 120ms ease-out } -.el-picker-panel__icon-btn:hover { - color: #006aff +.el-scrollbar__bar.is-vertical { + width: 6px; + top: 2px } -.el-picker-panel__icon-btn.is-disabled { - color: #bbb +.el-scrollbar__bar.is-vertical>div { + width: 100% } -.el-picker-panel__icon-btn.is-disabled:hover { - cursor: not-allowed +.el-scrollbar__bar.is-horizontal { + height: 6px; + left: 2px } -.el-picker-panel__link-btn { - vertical-align: middle +.el-scrollbar__bar.is-horizontal>div { + height: 100% } -.el-picker-panel [slot=sidebar], -.el-picker-panel__sidebar { +.el-popper .popper__arrow, +.el-popper .popper__arrow::after { position: absolute; - top: 0; - bottom: 0; - width: 110px; - border-right: 1px solid #e4e4e4; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding-top: 6px; - background-color: #fff; - overflow: auto + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-picker-panel [slot=sidebar]+.el-picker-panel__body, -.el-picker-panel__sidebar+.el-picker-panel__body { - margin-left: 110px +.el-popper .popper__arrow { + border-width: 6px; + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) } -.el-time-spinner.has-seconds .el-time-spinner__wrapper { - width: 33.3% +.el-popper .popper__arrow::after { + content: " "; + border-width: 6px } -.el-time-spinner__wrapper { - max-height: 190px; - overflow: auto; - display: inline-block; - width: 50%; - vertical-align: top; - position: relative +.el-popper[x-placement^=top] { + margin-bottom: 12px } -.el-time-spinner__wrapper .el-scrollbar__wrap:not(.el-scrollbar__wrap--hidden-default) { - padding-bottom: 15px +.el-popper[x-placement^=top] .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: #ebeef5; + border-bottom-width: 0 } -.el-time-spinner__wrapper.is-arrow { - -webkit-box-sizing: border-box; - box-sizing: border-box; - text-align: center; - overflow: hidden +.el-popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -6px; + border-top-color: #fff; + border-bottom-width: 0 } -.el-time-spinner__wrapper.is-arrow .el-time-spinner__list { - -webkit-transform: translateY(-32px); - transform: translateY(-32px) +.el-popper[x-placement^=bottom] { + margin-top: 12px } -.el-time-spinner__wrapper.is-arrow .el-time-spinner__item:hover:not(.disabled):not(.active) { - background: #fff; - cursor: default +.el-popper[x-placement^=bottom] .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: #ebeef5 } -.el-time-spinner__arrow { - font-size: 12px; - color: #1e2226; - position: absolute; - left: 0; - width: 100%; - z-index: 1; - text-align: center; - height: 30px; - line-height: 30px; - cursor: pointer +.el-popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: #fff } -.el-time-spinner__arrow:hover { - color: #006aff +.el-popper[x-placement^=right] { + margin-left: 12px } -.el-time-spinner__arrow.el-icon-arrow-up { - top: 10px +.el-popper[x-placement^=right] .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: #ebeef5; + border-left-width: 0 } -.el-time-spinner__arrow.el-icon-arrow-down { - bottom: 10px +.el-popper[x-placement^=right] .popper__arrow::after { + bottom: -6px; + left: 1px; + border-right-color: #fff; + border-left-width: 0 } -.el-time-spinner__input.el-input { - width: 70% +.el-popper[x-placement^=left] { + margin-right: 12px } -.el-time-spinner__input.el-input .el-input__inner { - padding: 0; - text-align: center +.el-popper[x-placement^=left] .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: #ebeef5 } -.el-time-spinner__list { - padding: 0; - margin: 0; - list-style: none; - text-align: center +.el-popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: #fff } -.el-time-spinner__list::after, -.el-time-spinner__list::before { - content: ''; +.el-popper .popper__arrow, +.el-popper .popper__arrow::after { + position: absolute; display: block; - width: 100%; - height: 80px + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-time-spinner__item { - height: 32px; - line-height: 32px; - font-size: 12px; - color: #606266 +.el-popper .popper__arrow { + border-width: 6px; + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) } -.el-time-spinner__item:hover:not(.disabled):not(.active) { - background: #f5f7fa; - cursor: pointer +.el-popper .popper__arrow::after { + content: " "; + border-width: 6px } -.el-time-spinner__item.active:not(.disabled) { - color: #1e2226; - font-weight: 700 +.el-popper[x-placement^=top] { + margin-bottom: 12px } -.el-time-spinner__item.disabled { - color: #babdc2; - cursor: not-allowed +.el-popper[x-placement^=top] .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: #ebeef5; + border-bottom-width: 0 } -.el-time-panel { - margin: 5px 0; - border: solid 1px #e4e7ed; - background-color: #fff; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - border-radius: 2px; - position: absolute; - width: 180px; - left: 0; - z-index: 1000; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-box-sizing: content-box; - box-sizing: content-box +.el-popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -6px; + border-top-color: #fff; + border-bottom-width: 0 } -.el-time-panel__content { - font-size: 0; - position: relative; - overflow: hidden +.el-popper[x-placement^=bottom] { + margin-top: 12px } -.el-time-panel__content::after, -.el-time-panel__content::before { - content: ""; - top: 50%; - position: absolute; - margin-top: -15px; - height: 32px; - z-index: -1; - left: 0; - right: 0; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding-top: 6px; - text-align: left; - border-top: 1px solid #e4e7ed; - border-bottom: 1px solid #e4e7ed +.el-popper[x-placement^=bottom] .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: #ebeef5 } -.el-time-panel__content::after { - left: 50%; - margin-left: 12%; - margin-right: 12% +.el-popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: #fff } -.el-time-panel__content::before { - padding-left: 50%; - margin-right: 12%; - margin-left: 12% +.el-popper[x-placement^=right] { + margin-left: 12px } -.el-time-panel__content.has-seconds::after { - left: calc(100% / 3 * 2) +.el-popper[x-placement^=right] .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: #ebeef5; + border-left-width: 0 } -.el-time-panel__content.has-seconds::before { - padding-left: calc(100% / 3) +.el-popper[x-placement^=right] .popper__arrow::after { + bottom: -6px; + left: 1px; + border-right-color: #fff; + border-left-width: 0 } -.el-time-panel__footer { - border-top: 1px solid #e4e4e4; - padding: 4px; - height: 36px; - line-height: 25px; - text-align: right; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-popper[x-placement^=left] { + margin-right: 12px } -.el-time-panel__btn { - border: none; - line-height: 28px; - padding: 0 5px; - margin: 0 5px; - cursor: pointer; - background-color: transparent; - outline: 0; - font-size: 12px; - color: #1e2226 +.el-popper[x-placement^=left] .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: #ebeef5 } -.el-time-panel__btn.confirm { - font-weight: 800; - color: #006aff +.el-popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: #fff } -.el-time-range-picker { - width: 354px; - overflow: visible +.el-popover { + position: absolute; + background: #fff; + min-width: 150px; + border-radius: 4px; + border: 1px solid #ebeef5; + padding: 12px; + z-index: 2000; + color: #606266; + line-height: 1.4; + text-align: justify; + font-size: 14px; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + word-break: break-all } -.el-time-range-picker__content { - position: relative; - text-align: center; - padding: 10px +.el-popover--plain { + padding: 18px 20px } -.el-time-range-picker__cell { - -webkit-box-sizing: border-box; - box-sizing: border-box; - margin: 0; - padding: 4px 7px 7px; - width: 50%; - display: inline-block +.el-popover__title { + color: #1e2226; + font-size: 16px; + line-height: 1; + margin-bottom: 12px } -.el-time-range-picker__header { - margin-bottom: 5px; - text-align: center; - font-size: 14px +.el-popover__reference:focus:hover, +.el-popover__reference:focus:not(.focusing) { + outline-width: 0 } -.el-time-range-picker__body { - border-radius: 2px; - border: 1px solid #e4e7ed +.el-popover:focus, +.el-popover:focus:active { + outline-width: 0 } -.el-textarea { - position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px +.el-tooltip:focus:hover, +.el-tooltip:focus:not(.focusing) { + outline-width: 0 } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; +.el-tooltip__popper { + position: absolute; border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) + padding: 10px; + z-index: 2000; + font-size: 12px; + line-height: 1.2; + min-width: 10px; + word-wrap: break-word } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-tooltip__popper .popper__arrow, +.el-tooltip__popper .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-tooltip__popper .popper__arrow { + border-width: 6px } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-tooltip__popper .popper__arrow::after { + content: " "; + border-width: 5px } -.el-textarea__inner::placeholder { - color: #babdc2 +.el-tooltip__popper[x-placement^=top] { + margin-bottom: 12px } -.el-textarea__inner:hover { - border-color: #babdc2 +.el-tooltip__popper[x-placement^=top] .popper__arrow { + bottom: -6px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff +.el-tooltip__popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -5px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-textarea .el-input__count { - color: #909399; - background: #fff; - position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px +.el-tooltip__popper[x-placement^=bottom] { + margin-top: 12px } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-tooltip__popper[x-placement^=bottom] .popper__arrow { + top: -6px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -5px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-tooltip__popper[x-placement^=right] { + margin-left: 12px +} + +.el-tooltip__popper[x-placement^=right] .popper__arrow { + left: -6px; + border-right-color: #1e2226; + border-left-width: 0 +} + +.el-tooltip__popper[x-placement^=right] .popper__arrow::after { + bottom: -5px; + left: 1px; + border-right-color: #1e2226; + border-left-width: 0 +} + +.el-tooltip__popper[x-placement^=left] { + margin-right: 12px +} + +.el-tooltip__popper[x-placement^=left] .popper__arrow { + right: -6px; + border-right-width: 0; + border-left-color: #1e2226 +} + +.el-tooltip__popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -5px; + margin-left: -5px; + border-right-width: 0; + border-left-color: #1e2226 +} + +.el-tooltip__popper.is-dark { + background: #1e2226; + color: #fff +} + +.el-tooltip__popper.is-light { + background: #fff; + border: 1px solid #1e2226 +} + +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { + border-top-color: #1e2226 +} + +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { + border-top-color: #fff +} + +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { + border-bottom-color: #1e2226 +} + +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { + border-bottom-color: #fff +} + +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { + border-left-color: #1e2226 +} + +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { + border-left-color: #fff +} + +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { + border-right-color: #1e2226 +} + +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { + border-right-color: #fff +} + +.v-modal-enter { + -webkit-animation: v-modal-in .2s ease; + animation: v-modal-in .2s ease +} + +.v-modal-leave { + -webkit-animation: v-modal-out .2s ease forwards; + animation: v-modal-out .2s ease forwards +} + +@keyframes v-modal-in { + 0% { + opacity: 0 + } +} + +@keyframes v-modal-out { + 100% { + opacity: 0 + } +} + +.v-modal { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + opacity: .5; + background: #000 +} + +.el-popup-parent--hidden { + overflow: hidden +} + + + +.el-textarea { + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: 14px +} + +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) +} + +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 +} + +.el-textarea__inner::-moz-placeholder { + color: #babdc2 +} + +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 +} + +.el-textarea__inner::placeholder { + color: #babdc2 +} + +.el-textarea__inner:hover { + border-color: #babdc2 +} + +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff +} + +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px +} + +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed +} + +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 +} + +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { + color: #babdc2 } .el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { @@ -14867,15484 +15142,12600 @@ height: 0 } -.el-scrollbar { +.el-message-box { + display: inline-block; + width: 420px; + padding-bottom: 10px; + vertical-align: middle; + background-color: #fff; + border-radius: 4px; + border: 1px solid #ebeef5; + font-size: 18px; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + text-align: left; overflow: hidden; - position: relative -} - -.el-scrollbar:active>.el-scrollbar__bar, -.el-scrollbar:focus>.el-scrollbar__bar, -.el-scrollbar:hover>.el-scrollbar__bar { - opacity: 1; - -webkit-transition: opacity 340ms ease-out; - transition: opacity 340ms ease-out -} - -.el-scrollbar__wrap { - overflow: scroll; - height: 100% + -webkit-backface-visibility: hidden; + backface-visibility: hidden } -.el-scrollbar__wrap--hidden-default { - scrollbar-width: none +.el-message-box__wrapper { + position: fixed; + top: 0; + bottom: 0; + left: 0; + right: 0; + text-align: center } -.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { +.el-message-box__wrapper::after { + content: ""; + display: inline-block; + height: 100%; width: 0; - height: 0 + vertical-align: middle } -.el-scrollbar__thumb { +.el-message-box__header { position: relative; - display: block; - width: 0; - height: 0; - cursor: pointer; - border-radius: inherit; - background-color: rgba(30, 34, 38, .3); - -webkit-transition: .3s background-color; - transition: .3s background-color + padding: 15px; + padding-bottom: 10px } -.el-scrollbar__thumb:hover { - background-color: rgba(30, 34, 38, .5) +.el-message-box__title { + padding-left: 0; + margin-bottom: 0; + font-size: 18px; + line-height: 1; + color: #1e2226 } -.el-scrollbar__bar { +.el-message-box__headerbtn { position: absolute; - right: 2px; - bottom: 2px; - z-index: 1; - border-radius: 4px; - opacity: 0; - -webkit-transition: opacity 120ms ease-out; - transition: opacity 120ms ease-out -} - -.el-scrollbar__bar.is-vertical { - width: 6px; - top: 2px + top: 15px; + right: 15px; + padding: 0; + border: none; + outline: 0; + background: 0 0; + font-size: 16px; + cursor: pointer } -.el-scrollbar__bar.is-vertical>div { - width: 100% +.el-message-box__headerbtn .el-message-box__close { + color: #909399 } -.el-scrollbar__bar.is-horizontal { - height: 6px; - left: 2px +.el-message-box__headerbtn:focus .el-message-box__close, +.el-message-box__headerbtn:hover .el-message-box__close { + color: #006aff } -.el-scrollbar__bar.is-horizontal>div { - height: 100% +.el-message-box__content { + padding: 10px 15px; + color: #606266; + font-size: 14px } -.el-popper .popper__arrow, -.el-popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-message-box__container { + position: relative } -.el-popper .popper__arrow { - border-width: 6px; - -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); - filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) +.el-message-box__input { + padding-top: 15px } -.el-popper .popper__arrow::after { - content: " "; - border-width: 6px +.el-message-box__input input.invalid { + border-color: #ff4d4f } -.el-popper[x-placement^=top] { - margin-bottom: 12px +.el-message-box__input input.invalid:focus { + border-color: #ff4d4f } -.el-popper[x-placement^=top] .popper__arrow { - bottom: -6px; - left: 50%; - margin-right: 3px; - border-top-color: #ebeef5; - border-bottom-width: 0 +.el-message-box__status { + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-size: 24px !important } -.el-popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -6px; - border-top-color: #fff; - border-bottom-width: 0 +.el-message-box__status::before { + padding-left: 1px } -.el-popper[x-placement^=bottom] { - margin-top: 12px +.el-message-box__status+.el-message-box__message { + padding-left: 36px; + padding-right: 12px } -.el-popper[x-placement^=bottom] .popper__arrow { - top: -6px; - left: 50%; - margin-right: 3px; - border-top-width: 0; - border-bottom-color: #ebeef5 +.el-message-box__status.el-icon-success { + color: #0daf49 } -.el-popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -6px; - border-top-width: 0; - border-bottom-color: #fff +.el-message-box__status.el-icon-info { + color: #909399 } -.el-popper[x-placement^=right] { - margin-left: 12px +.el-message-box__status.el-icon-warning { + color: #f08614 } -.el-popper[x-placement^=right] .popper__arrow { - top: 50%; - left: -6px; - margin-bottom: 3px; - border-right-color: #ebeef5; - border-left-width: 0 +.el-message-box__status.el-icon-error { + color: #ff4d4f } -.el-popper[x-placement^=right] .popper__arrow::after { - bottom: -6px; - left: 1px; - border-right-color: #fff; - border-left-width: 0 +.el-message-box__message { + margin: 0 } -.el-popper[x-placement^=left] { - margin-right: 12px +.el-message-box__message p { + margin: 0; + line-height: 24px } -.el-popper[x-placement^=left] .popper__arrow { - top: 50%; - right: -6px; - margin-bottom: 3px; - border-right-width: 0; - border-left-color: #ebeef5 +.el-message-box__errormsg { + color: #ff4d4f; + font-size: 12px; + min-height: 18px; + margin-top: 2px } -.el-popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -6px; - margin-left: -6px; - border-right-width: 0; - border-left-color: #fff +.el-message-box__btns { + padding: 5px 15px 0; + text-align: right } -.el-popper .popper__arrow, -.el-popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-message-box__btns button:nth-child(2) { + margin-left: 10px } -.el-popper .popper__arrow { - border-width: 6px; - -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); - filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) +.el-message-box__btns-reverse { + -webkit-box-orient: horizontal; + -webkit-box-direction: reverse; + -ms-flex-direction: row-reverse; + flex-direction: row-reverse } -.el-popper .popper__arrow::after { - content: " "; - border-width: 6px +.el-message-box--center { + padding-bottom: 30px } -.el-popper[x-placement^=top] { - margin-bottom: 12px +.el-message-box--center .el-message-box__header { + padding-top: 30px } -.el-popper[x-placement^=top] .popper__arrow { - bottom: -6px; - left: 50%; - margin-right: 3px; - border-top-color: #ebeef5; - border-bottom-width: 0 +.el-message-box--center .el-message-box__title { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center } -.el-popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -6px; - border-top-color: #fff; - border-bottom-width: 0 +.el-message-box--center .el-message-box__status { + position: relative; + top: auto; + padding-right: 5px; + text-align: center; + -webkit-transform: translateY(-1px); + transform: translateY(-1px) } -.el-popper[x-placement^=bottom] { - margin-top: 12px +.el-message-box--center .el-message-box__message { + margin-left: 0 } -.el-popper[x-placement^=bottom] .popper__arrow { - top: -6px; - left: 50%; - margin-right: 3px; - border-top-width: 0; - border-bottom-color: #ebeef5 +.el-message-box--center .el-message-box__btns, +.el-message-box--center .el-message-box__content { + text-align: center } -.el-popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -6px; - border-top-width: 0; - border-bottom-color: #fff +.el-message-box--center .el-message-box__content { + padding-left: 27px; + padding-right: 27px } -.el-popper[x-placement^=right] { - margin-left: 12px +.msgbox-fade-enter-active { + -webkit-animation: msgbox-fade-in .3s; + animation: msgbox-fade-in .3s } -.el-popper[x-placement^=right] .popper__arrow { - top: 50%; - left: -6px; - margin-bottom: 3px; - border-right-color: #ebeef5; - border-left-width: 0 +.msgbox-fade-leave-active { + -webkit-animation: msgbox-fade-out .3s; + animation: msgbox-fade-out .3s } -.el-popper[x-placement^=right] .popper__arrow::after { - bottom: -6px; - left: 1px; - border-right-color: #fff; - border-left-width: 0 -} +@-webkit-keyframes msgbox-fade-in { + 0% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } -.el-popper[x-placement^=left] { - margin-right: 12px + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } } -.el-popper[x-placement^=left] .popper__arrow { - top: 50%; - right: -6px; - margin-bottom: 3px; - border-right-width: 0; - border-left-color: #ebeef5 +@keyframes msgbox-fade-in { + 0% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } + + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } } -.el-popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -6px; - margin-left: -6px; - border-right-width: 0; - border-left-color: #fff +@-webkit-keyframes msgbox-fade-out { + 0% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } + + 100% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } } -.el-popover { - position: absolute; - background: #fff; - min-width: 150px; - border-radius: 4px; - border: 1px solid #ebeef5; - padding: 12px; - z-index: 2000; - color: #606266; - line-height: 1.4; - text-align: justify; +@keyframes msgbox-fade-out { + 0% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } + + 100% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } +} + +.el-breadcrumb { font-size: 14px; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - word-break: break-all + line-height: 1 } -.el-popover--plain { - padding: 18px 20px +.el-breadcrumb::after, +.el-breadcrumb::before { + display: table; + content: "" } -.el-popover__title { - color: #1e2226; - font-size: 16px; - line-height: 1; - margin-bottom: 12px +.el-breadcrumb::after { + clear: both } -.el-popover__reference:focus:hover, -.el-popover__reference:focus:not(.focusing) { - outline-width: 0 +.el-breadcrumb__separator { + margin: 0 9px; + font-weight: 700; + color: #babdc2 } -.el-popover:focus, -.el-popover:focus:active { - outline-width: 0 +.el-breadcrumb__separator[class*=icon] { + margin: 0 6px; + font-weight: 400 } -.el-tooltip:focus:hover, -.el-tooltip:focus:not(.focusing) { - outline-width: 0 +.el-breadcrumb__item { + float: left } -.el-tooltip__popper { - position: absolute; - border-radius: 4px; - padding: 10px; - z-index: 2000; - font-size: 12px; - line-height: 1.2; - min-width: 10px; - word-wrap: break-word +.el-breadcrumb__inner { + color: #606266 } -.el-tooltip__popper .popper__arrow, -.el-tooltip__popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-breadcrumb__inner a, +.el-breadcrumb__inner.is-link { + font-weight: 700; + text-decoration: none; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1); + color: #1e2226 } -.el-tooltip__popper .popper__arrow { - border-width: 6px +.el-breadcrumb__inner a:hover, +.el-breadcrumb__inner.is-link:hover { + color: #006aff; + cursor: pointer } -.el-tooltip__popper .popper__arrow::after { - content: " "; - border-width: 5px +.el-breadcrumb__item:last-child .el-breadcrumb__inner, +.el-breadcrumb__item:last-child .el-breadcrumb__inner a, +.el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover, +.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover { + font-weight: 400; + color: #606266; + cursor: text } -.el-tooltip__popper[x-placement^=top] { - margin-bottom: 12px +.el-breadcrumb__item:last-child .el-breadcrumb__separator { + display: none } -.el-tooltip__popper[x-placement^=top] .popper__arrow { - bottom: -6px; - border-top-color: #1e2226; - border-bottom-width: 0 +.el-form--label-left .el-form-item__label { + text-align: left } -.el-tooltip__popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -5px; - border-top-color: #1e2226; - border-bottom-width: 0 +.el-form--label-top .el-form-item__label { + float: none; + display: inline-block; + text-align: left; + padding: 0 0 10px 0 } -.el-tooltip__popper[x-placement^=bottom] { - margin-top: 12px +.el-form--inline .el-form-item { + display: inline-block; + margin-right: 10px; + vertical-align: top } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow { - top: -6px; - border-top-width: 0; - border-bottom-color: #1e2226 +.el-form--inline .el-form-item__label { + float: none; + display: inline-block } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -5px; - border-top-width: 0; - border-bottom-color: #1e2226 +.el-form--inline .el-form-item__content { + display: inline-block; + vertical-align: top } -.el-tooltip__popper[x-placement^=right] { - margin-left: 12px +.el-form--inline.el-form--label-top .el-form-item__content { + display: block } -.el-tooltip__popper[x-placement^=right] .popper__arrow { - left: -6px; - border-right-color: #1e2226; - border-left-width: 0 +.el-form-item { + margin-bottom: 22px } -.el-tooltip__popper[x-placement^=right] .popper__arrow::after { - bottom: -5px; - left: 1px; - border-right-color: #1e2226; - border-left-width: 0 +.el-form-item::after, +.el-form-item::before { + display: table; + content: "" } -.el-tooltip__popper[x-placement^=left] { - margin-right: 12px +.el-form-item::after { + clear: both } -.el-tooltip__popper[x-placement^=left] .popper__arrow { - right: -6px; - border-right-width: 0; - border-left-color: #1e2226 +.el-form-item .el-form-item { + margin-bottom: 0 } -.el-tooltip__popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -5px; - margin-left: -5px; - border-right-width: 0; - border-left-color: #1e2226 +.el-form-item .el-input__validateIcon { + display: none } -.el-tooltip__popper.is-dark { - background: #1e2226; - color: #fff +.el-form-item--medium .el-form-item__label { + line-height: 36px } -.el-tooltip__popper.is-light { - background: #fff; - border: 1px solid #1e2226 +.el-form-item--medium .el-form-item__content { + line-height: 36px } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { - border-top-color: #1e2226 +.el-form-item--small .el-form-item__label { + line-height: 32px } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { - border-top-color: #fff +.el-form-item--small .el-form-item__content { + line-height: 32px } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { - border-bottom-color: #1e2226 +.el-form-item--small.el-form-item { + margin-bottom: 18px } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { - border-bottom-color: #fff +.el-form-item--small .el-form-item__error { + padding-top: 2px } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { - border-left-color: #1e2226 +.el-form-item--mini .el-form-item__label { + line-height: 28px } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { - border-left-color: #fff +.el-form-item--mini .el-form-item__content { + line-height: 28px } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { - border-right-color: #1e2226 +.el-form-item--mini.el-form-item { + margin-bottom: 18px } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { - border-right-color: #fff +.el-form-item--mini .el-form-item__error { + padding-top: 1px } -.v-modal-enter { - -webkit-animation: v-modal-in .2s ease; - animation: v-modal-in .2s ease +.el-form-item__label-wrap { + float: left } -.v-modal-leave { - -webkit-animation: v-modal-out .2s ease forwards; - animation: v-modal-out .2s ease forwards +.el-form-item__label-wrap .el-form-item__label { + display: inline-block; + float: none } -@keyframes v-modal-in { - 0% { - opacity: 0 - } +.el-form-item__label { + text-align: right; + vertical-align: middle; + float: left; + font-size: 14px; + color: #606266; + line-height: 40px; + padding: 0 12px 0 0; + -webkit-box-sizing: border-box; + box-sizing: border-box } -@keyframes v-modal-out { - 100% { - opacity: 0 - } +.el-form-item__content { + line-height: 40px; + position: relative; + font-size: 14px } -.v-modal { - position: fixed; - left: 0; - top: 0; - width: 100%; - height: 100%; - opacity: .5; - background: #000 +.el-form-item__content::after, +.el-form-item__content::before { + display: table; + content: "" } -.el-popup-parent--hidden { - overflow: hidden +.el-form-item__content::after { + clear: both } -.el-button { - display: inline-block; +.el-form-item__content .el-input-group { + vertical-align: top +} + +.el-form-item__error { + color: #ff4d4f; + font-size: 12px; line-height: 1; - white-space: nowrap; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-color: #dfe2e6; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - -webkit-transition: .1s; - transition: .1s; - font-weight: 500; - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 4px + padding-top: 4px; + position: absolute; + top: 100%; + left: 0 } -.el-button+.el-button { +.el-form-item__error--inline { + position: relative; + top: auto; + left: auto; + display: inline-block; margin-left: 10px } -.el-button.is-round { - padding: 12px 20px +.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, +.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before { + content: '*'; + color: #ff4d4f; + margin-right: 4px } -.el-button:focus, -.el-button:hover { - color: #006aff; - border-color: #b3d2ff; - background-color: #e6f0ff +.el-form-item.is-error .el-input__inner, +.el-form-item.is-error .el-input__inner:focus, +.el-form-item.is-error .el-textarea__inner, +.el-form-item.is-error .el-textarea__inner:focus { + border-color: #ff4d4f } -.el-button:active { - color: #005fe6; - border-color: #005fe6; - outline: 0 +.el-form-item.is-error .el-input-group__append .el-input__inner, +.el-form-item.is-error .el-input-group__prepend .el-input__inner { + border-color: transparent } -.el-button::-moz-focus-inner { - border: 0 +.el-form-item.is-error .el-input__validateIcon { + color: #ff4d4f } -.el-button [class*=el-icon-]+span { - margin-left: 5px +.el-form-item--feedback .el-input__validateIcon { + display: inline-block } -.el-button.is-plain:focus, -.el-button.is-plain:hover { - background: #fff; - border-color: #006aff; - color: #006aff +.el-tabs__header { + padding: 0; + position: relative; + margin: 0 0 15px } -.el-button.is-plain:active { - background: #fff; - border-color: #005fe6; - color: #005fe6; - outline: 0 +.el-tabs__active-bar { + position: absolute; + bottom: 0; + left: 0; + height: 2px; + background-color: #006aff; + z-index: 1; + -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); + transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); + transition: transform .3s cubic-bezier(.645, .045, .355, 1); + transition: transform .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); + list-style: none } -.el-button.is-active { - color: #005fe6; - border-color: #005fe6 +.el-tabs__new-tab { + float: right; + border: 1px solid #d3dce6; + height: 18px; + width: 18px; + line-height: 18px; + margin: 12px 0 9px 10px; + border-radius: 3px; + text-align: center; + font-size: 12px; + color: #d3dce6; + cursor: pointer; + -webkit-transition: all .15s; + transition: all .15s } -.el-button.is-disabled, -.el-button.is-disabled:focus, -.el-button.is-disabled:hover { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5 +.el-tabs__new-tab .el-icon-plus { + -webkit-transform: scale(.8, .8); + transform: scale(.8, .8) } -.el-button.is-disabled.el-button--text { - background-color: transparent +.el-tabs__new-tab:hover { + color: #006aff } -.el-button.is-disabled.is-plain, -.el-button.is-disabled.is-plain:focus, -.el-button.is-disabled.is-plain:hover { - background-color: #fff; - border-color: #ebeef5; - color: #babdc2 +.el-tabs__nav-wrap { + overflow: hidden; + margin-bottom: -1px; + position: relative } -.el-button.is-loading { - position: relative; - pointer-events: none +.el-tabs__nav-wrap::after { + content: ""; + position: absolute; + left: 0; + bottom: 0; + width: 100%; + height: 2px; + background-color: #e4e7ed; + z-index: 1 } -.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-tabs__nav-wrap.is-scrollable { + padding: 0 20px; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button.is-round { - border-radius: 20px; - padding: 12px 23px +.el-tabs__nav-scroll { + overflow: hidden } -.el-button.is-circle { - border-radius: 50%; - padding: 12px +.el-tabs__nav-next, +.el-tabs__nav-prev { + position: absolute; + cursor: pointer; + line-height: 44px; + font-size: 12px; + color: #1e2226 } -.el-button--primary { - color: #fff; - background-color: #006aff; - border-color: #006aff +.el-tabs__nav-next { + right: 0 } -.el-button--primary:focus, -.el-button--primary:hover { - background: #38f; - border-color: #38f; - color: #fff +.el-tabs__nav-prev { + left: 0 } -.el-button--primary:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-tabs__nav { + white-space: nowrap; + position: relative; + -webkit-transition: -webkit-transform .3s; + transition: -webkit-transform .3s; + transition: transform .3s; + transition: transform .3s, -webkit-transform .3s; + float: left; + z-index: 2 } -.el-button--primary.is-active { - background: #005fe6; - border-color: #005fe6; - color: #fff +.el-tabs__nav.is-stretch { + min-width: 100%; + display: -webkit-box; + display: -ms-flexbox; + display: flex } -.el-button--primary.is-disabled, -.el-button--primary.is-disabled:active, -.el-button--primary.is-disabled:focus, -.el-button--primary.is-disabled:hover { - color: #fff; - background-color: #80b5ff; - border-color: #80b5ff +.el-tabs__nav.is-stretch>* { + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + text-align: center } -.el-button--primary.is-plain { - color: #006aff; - background: #e6f0ff; - border-color: #99c3ff +.el-tabs__item { + padding: 0 20px; + height: 40px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: 40px; + display: inline-block; + list-style: none; + font-size: 14px; + font-weight: 500; + color: #1e2226; + position: relative } -.el-button--primary.is-plain:focus, -.el-button--primary.is-plain:hover { - background: #006aff; - border-color: #006aff; - color: #fff +.el-tabs__item:focus, +.el-tabs__item:focus:active { + outline: 0 } -.el-button--primary.is-plain:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-tabs__item:focus.is-active.is-focus:not(:active) { + -webkit-box-shadow: 0 0 2px 2px #006aff inset; + box-shadow: 0 0 2px 2px #006aff inset; + border-radius: 3px } -.el-button--primary.is-plain.is-disabled, -.el-button--primary.is-plain.is-disabled:active, -.el-button--primary.is-plain.is-disabled:focus, -.el-button--primary.is-plain.is-disabled:hover { - color: #66a6ff; - background-color: #e6f0ff; - border-color: #cce1ff +.el-tabs__item .el-icon-close { + border-radius: 50%; + text-align: center; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + margin-left: 5px } -.el-button--success { - color: #fff; - background-color: #0daf49; - border-color: #0daf49 +.el-tabs__item .el-icon-close:before { + -webkit-transform: scale(.9); + transform: scale(.9); + display: inline-block } -.el-button--success:focus, -.el-button--success:hover { - background: #3dbf6d; - border-color: #3dbf6d; +.el-tabs__item .el-icon-close:hover { + background-color: #babdc2; color: #fff } -.el-button--success:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-tabs__item.is-active { + color: #006aff } -.el-button--success.is-active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff +.el-tabs__item:hover { + color: #006aff; + cursor: pointer } -.el-button--success.is-disabled, -.el-button--success.is-disabled:active, -.el-button--success.is-disabled:focus, -.el-button--success.is-disabled:hover { - color: #fff; - background-color: #86d7a4; - border-color: #86d7a4 +.el-tabs__item.is-disabled { + color: #babdc2; + cursor: default } -.el-button--success.is-plain { - color: #0daf49; - background: #e7f7ed; - border-color: #9edfb6 +.el-tabs__content { + overflow: hidden; + position: relative } -.el-button--success.is-plain:focus, -.el-button--success.is-plain:hover { - background: #0daf49; - border-color: #0daf49; - color: #fff +.el-tabs--card>.el-tabs__header { + border-bottom: 1px solid #e4e7ed } -.el-button--success.is-plain:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-tabs--card>.el-tabs__header .el-tabs__nav-wrap::after { + content: none } -.el-button--success.is-plain.is-disabled, -.el-button--success.is-plain.is-disabled:active, -.el-button--success.is-plain.is-disabled:focus, -.el-button--success.is-plain.is-disabled:hover { - color: #6ecf92; - background-color: #e7f7ed; - border-color: #cfefdb +.el-tabs--card>.el-tabs__header .el-tabs__nav { + border: 1px solid #e4e7ed; + border-bottom: none; + border-radius: 4px 4px 0 0; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button--warning { - color: #fff; - background-color: #f08614; - border-color: #f08614 +.el-tabs--card>.el-tabs__header .el-tabs__active-bar { + display: none } -.el-button--warning:focus, -.el-button--warning:hover { - background: #f39e43; - border-color: #f39e43; - color: #fff +.el-tabs--card>.el-tabs__header .el-tabs__item .el-icon-close { + position: relative; + font-size: 12px; + width: 0; + height: 14px; + vertical-align: middle; + line-height: 15px; + overflow: hidden; + top: -1px; + right: -2px; + -webkit-transform-origin: 100% 50%; + transform-origin: 100% 50% } -.el-button--warning:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-tabs--card>.el-tabs__header .el-tabs__item { + border-bottom: 1px solid transparent; + border-left: 1px solid #e4e7ed; + -webkit-transition: color .3s cubic-bezier(.645, .045, .355, 1), padding .3s cubic-bezier(.645, .045, .355, 1); + transition: color .3s cubic-bezier(.645, .045, .355, 1), padding .3s cubic-bezier(.645, .045, .355, 1) } -.el-button--warning.is-active { - background: #d87912; - border-color: #d87912; - color: #fff +.el-tabs--card>.el-tabs__header .el-tabs__item:first-child { + border-left: none } -.el-button--warning.is-disabled, -.el-button--warning.is-disabled:active, -.el-button--warning.is-disabled:focus, -.el-button--warning.is-disabled:hover { - color: #fff; - background-color: #f8c38a; - border-color: #f8c38a +.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover { + padding-left: 13px; + padding-right: 13px } -.el-button--warning.is-plain { - color: #f08614; - background: #fef3e8; - border-color: #f9cfa1 +.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover .el-icon-close { + width: 14px } -.el-button--warning.is-plain:focus, -.el-button--warning.is-plain:hover { - background: #f08614; - border-color: #f08614; - color: #fff +.el-tabs--card>.el-tabs__header .el-tabs__item.is-active { + border-bottom-color: #fff } -.el-button--warning.is-plain:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable { + padding-left: 20px; + padding-right: 20px } -.el-button--warning.is-plain.is-disabled, -.el-button--warning.is-plain.is-disabled:active, -.el-button--warning.is-plain.is-disabled:focus, -.el-button--warning.is-plain.is-disabled:hover { - color: #f6b672; - background-color: #fef3e8; - border-color: #fce7d0 +.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable .el-icon-close { + width: 14px } -.el-button--danger { - color: #fff; - background-color: #ff4d4f; - border-color: #ff4d4f +.el-tabs--border-card { + background: #fff; + border: 1px solid #dfe2e6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04); + box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04) } -.el-button--danger:focus, -.el-button--danger:hover { - background: #ff7172; - border-color: #ff7172; - color: #fff +.el-tabs--border-card>.el-tabs__content { + padding: 15px } -.el-button--danger:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-tabs--border-card>.el-tabs__header { + background-color: #f5f7fa; + border-bottom: 1px solid #e4e7ed; + margin: 0 } -.el-button--danger.is-active { - background: #e64547; - border-color: #e64547; - color: #fff +.el-tabs--border-card>.el-tabs__header .el-tabs__nav-wrap::after { + content: none } -.el-button--danger.is-disabled, -.el-button--danger.is-disabled:active, -.el-button--danger.is-disabled:focus, -.el-button--danger.is-disabled:hover { - color: #fff; - background-color: #ffa6a7; - border-color: #ffa6a7 +.el-tabs--border-card>.el-tabs__header .el-tabs__item { + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + border: 1px solid transparent; + margin-top: -1px; + color: #1e2226 } -.el-button--danger.is-plain { - color: #ff4d4f; - background: #ffeded; - border-color: #ffb8b9 +.el-tabs--border-card>.el-tabs__header .el-tabs__item:first-child { + margin-left: -1px } -.el-button--danger.is-plain:focus, -.el-button--danger.is-plain:hover { - background: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-tabs--border-card>.el-tabs__header .el-tabs__item+.el-tabs__item { + margin-left: -1px } -.el-button--danger.is-plain:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active { + color: #006aff; + background-color: #fff; + border-right-color: #dfe2e6; + border-left-color: #dfe2e6 } -.el-button--danger.is-plain.is-disabled, -.el-button--danger.is-plain.is-disabled:active, -.el-button--danger.is-plain.is-disabled:focus, -.el-button--danger.is-plain.is-disabled:hover { - color: #ff9495; - background-color: #ffeded; - border-color: #ffdbdc +.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover { + color: #006aff } -.el-button--info { - color: #fff; - background-color: #909399; - border-color: #909399 +.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-disabled { + color: #babdc2 } -.el-button--info:focus, -.el-button--info:hover { - background: #a6a9ad; - border-color: #a6a9ad; - color: #fff +.el-tabs--border-card>.el-tabs__header .is-scrollable .el-tabs__item:first-child { + margin-left: 0 } -.el-button--info:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2), +.el-tabs--bottom .el-tabs__item.is-top:nth-child(2), +.el-tabs--top .el-tabs__item.is-bottom:nth-child(2), +.el-tabs--top .el-tabs__item.is-top:nth-child(2) { + padding-left: 0 } -.el-button--info.is-active { - background: #82848a; - border-color: #82848a; - color: #fff +.el-tabs--bottom .el-tabs__item.is-bottom:last-child, +.el-tabs--bottom .el-tabs__item.is-top:last-child, +.el-tabs--top .el-tabs__item.is-bottom:last-child, +.el-tabs--top .el-tabs__item.is-top:last-child { + padding-right: 0 } -.el-button--info.is-disabled, -.el-button--info.is-disabled:active, -.el-button--info.is-disabled:focus, -.el-button--info.is-disabled:hover { - color: #fff; - background-color: #c8c9cc; - border-color: #c8c9cc +.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2), +.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2) { + padding-left: 20px } -.el-button--info.is-plain { - color: #909399; - background: #f4f4f5; - border-color: #d3d4d6 +.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child, +.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:last-child { + padding-right: 20px } -.el-button--info.is-plain:focus, -.el-button--info.is-plain:hover { - background: #909399; - border-color: #909399; - color: #fff +.el-tabs--bottom .el-tabs__header.is-bottom { + margin-bottom: 0; + margin-top: 10px } -.el-button--info.is-plain:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-tabs--bottom.el-tabs--border-card .el-tabs__header.is-bottom { + border-bottom: 0; + border-top: 1px solid #dfe2e6 } -.el-button--info.is-plain.is-disabled, -.el-button--info.is-plain.is-disabled:active, -.el-button--info.is-plain.is-disabled:focus, -.el-button--info.is-plain.is-disabled:hover { - color: #bcbec2; - background-color: #f4f4f5; - border-color: #e9e9eb +.el-tabs--bottom.el-tabs--border-card .el-tabs__nav-wrap.is-bottom { + margin-top: -1px; + margin-bottom: 0 } -.el-button--medium { - padding: 10px 20px; - font-size: 14px; - border-radius: 4px +.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom:not(.is-active) { + border: 1px solid transparent } -.el-button--medium.is-round { - padding: 10px 20px +.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom { + margin: 0 -1px -1px -1px } -.el-button--medium.is-circle { - padding: 10px +.el-tabs--left, +.el-tabs--right { + overflow: hidden } -.el-button--small { - padding: 9px 15px; - font-size: 12px; - border-radius: 3px +.el-tabs--left .el-tabs__header.is-left, +.el-tabs--left .el-tabs__header.is-right, +.el-tabs--left .el-tabs__nav-scroll, +.el-tabs--left .el-tabs__nav-wrap.is-left, +.el-tabs--left .el-tabs__nav-wrap.is-right, +.el-tabs--right .el-tabs__header.is-left, +.el-tabs--right .el-tabs__header.is-right, +.el-tabs--right .el-tabs__nav-scroll, +.el-tabs--right .el-tabs__nav-wrap.is-left, +.el-tabs--right .el-tabs__nav-wrap.is-right { + height: 100% } -.el-button--small.is-round { - padding: 9px 15px +.el-tabs--left .el-tabs__active-bar.is-left, +.el-tabs--left .el-tabs__active-bar.is-right, +.el-tabs--right .el-tabs__active-bar.is-left, +.el-tabs--right .el-tabs__active-bar.is-right { + top: 0; + bottom: auto; + width: 2px; + height: auto } -.el-button--small.is-circle { - padding: 9px +.el-tabs--left .el-tabs__nav-wrap.is-left, +.el-tabs--left .el-tabs__nav-wrap.is-right, +.el-tabs--right .el-tabs__nav-wrap.is-left, +.el-tabs--right .el-tabs__nav-wrap.is-right { + margin-bottom: 0 } -.el-button--mini { - padding: 7px 15px; - font-size: 12px; - border-radius: 3px +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev { + height: 30px; + line-height: 30px; + width: 100%; + text-align: center; + cursor: pointer } -.el-button--mini.is-round { - padding: 7px 15px +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i, +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i { + -webkit-transform: rotateZ(90deg); + transform: rotateZ(90deg) } -.el-button--mini.is-circle { - padding: 7px +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev { + left: auto; + top: 0 } -.el-button--text { - border-color: transparent; - color: #006aff; - background: 0 0; - padding-left: 0; - padding-right: 0 +.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, +.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, +.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, +.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next { + right: auto; + bottom: 0 } -.el-button--text:focus, -.el-button--text:hover { - color: #38f; - border-color: transparent; - background-color: transparent +.el-tabs--left .el-tabs__nav-wrap.is-left.is-scrollable, +.el-tabs--left .el-tabs__nav-wrap.is-right.is-scrollable, +.el-tabs--right .el-tabs__nav-wrap.is-left.is-scrollable, +.el-tabs--right .el-tabs__nav-wrap.is-right.is-scrollable { + padding: 30px 0 } -.el-button--text:active { - color: #005fe6; - border-color: transparent; - background-color: transparent +.el-tabs--left .el-tabs__nav-wrap.is-left::after, +.el-tabs--left .el-tabs__nav-wrap.is-right::after, +.el-tabs--right .el-tabs__nav-wrap.is-left::after, +.el-tabs--right .el-tabs__nav-wrap.is-right::after { + height: 100%; + width: 2px; + bottom: auto; + top: 0 } -.el-button--text.is-disabled, -.el-button--text.is-disabled:focus, -.el-button--text.is-disabled:hover { - border-color: transparent +.el-tabs--left .el-tabs__nav.is-left, +.el-tabs--left .el-tabs__nav.is-right, +.el-tabs--right .el-tabs__nav.is-left, +.el-tabs--right .el-tabs__nav.is-right { + float: none } -.el-button-group { - display: inline-block; - vertical-align: middle -} - -.el-button-group::after, -.el-button-group::before { - display: table; - content: "" -} - -.el-button-group::after { - clear: both +.el-tabs--left .el-tabs__item.is-left, +.el-tabs--left .el-tabs__item.is-right, +.el-tabs--right .el-tabs__item.is-left, +.el-tabs--right .el-tabs__item.is-right { + display: block } -.el-button-group>.el-button { +.el-tabs--left .el-tabs__header.is-left { float: left; - position: relative + margin-bottom: 0; + margin-right: 10px } -.el-button-group>.el-button+.el-button { - margin-left: 0 +.el-tabs--left .el-tabs__nav-wrap.is-left { + margin-right: -1px } -.el-button-group>.el-button.is-disabled { - z-index: 1 +.el-tabs--left .el-tabs__nav-wrap.is-left::after { + left: auto; + right: 0 } -.el-button-group>.el-button:first-child { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-tabs--left .el-tabs__active-bar.is-left { + right: 0; + left: auto } -.el-button-group>.el-button:last-child { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-tabs--left .el-tabs__item.is-left { + text-align: right } -.el-button-group>.el-button:first-child:last-child { - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - border-top-left-radius: 4px; - border-bottom-left-radius: 4px +.el-tabs--left.el-tabs--card .el-tabs__active-bar.is-left { + display: none } -.el-button-group>.el-button:first-child:last-child.is-round { - border-radius: 20px +.el-tabs--left.el-tabs--card .el-tabs__item.is-left { + border-left: none; + border-right: 1px solid #e4e7ed; + border-bottom: none; + border-top: 1px solid #e4e7ed; + text-align: left } -.el-button-group>.el-button:first-child:last-child.is-circle { - border-radius: 50% +.el-tabs--left.el-tabs--card .el-tabs__item.is-left:first-child { + border-right: 1px solid #e4e7ed; + border-top: none } -.el-button-group>.el-button:not(:first-child):not(:last-child) { - border-radius: 0 +.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active { + border: 1px solid #e4e7ed; + border-right-color: #fff; + border-left: none; + border-bottom: none } -.el-button-group>.el-button:not(:last-child) { - margin-right: -1px +.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:first-child { + border-top: none } -.el-button-group>.el-button:not(.is-disabled):active, -.el-button-group>.el-button:not(.is-disabled):focus, -.el-button-group>.el-button:not(.is-disabled):hover { - z-index: 1 +.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:last-child { + border-bottom: none } -.el-button-group>.el-button.is-active { - z-index: 1 +.el-tabs--left.el-tabs--card .el-tabs__nav { + border-radius: 4px 0 0 4px; + border-bottom: 1px solid #e4e7ed; + border-right: none } -.el-button-group>.el-dropdown>.el-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--left.el-tabs--card .el-tabs__new-tab { + float: none } -.el-button-group .el-button--primary:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--left.el-tabs--border-card .el-tabs__header.is-left { + border-right: 1px solid #dfe4ed } -.el-button-group .el-button--primary:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left { + border: 1px solid transparent; + margin: -1px 0 -1px -1px } -.el-button-group .el-button--primary:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left.is-active { + border-color: transparent; + border-top-color: #d1dbe5; + border-bottom-color: #d1dbe5 } -.el-button-group .el-button--success:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right .el-tabs__header.is-right { + float: right; + margin-bottom: 0; + margin-left: 10px } -.el-button-group .el-button--success:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--right .el-tabs__nav-wrap.is-right { + margin-left: -1px } -.el-button-group .el-button--success:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right .el-tabs__nav-wrap.is-right::after { + left: 0; + right: auto } -.el-button-group .el-button--warning:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right .el-tabs__active-bar.is-right { + left: 0 } -.el-button-group .el-button--warning:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__active-bar.is-right { + display: none } -.el-button-group .el-button--warning:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__item.is-right { + border-bottom: none; + border-top: 1px solid #e4e7ed } -.el-button-group .el-button--danger:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__item.is-right:first-child { + border-left: 1px solid #e4e7ed; + border-top: none } -.el-button-group .el-button--danger:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active { + border: 1px solid #e4e7ed; + border-left-color: #fff; + border-right: none; + border-bottom: none } -.el-button-group .el-button--danger:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:first-child { + border-top: none } -.el-button-group .el-button--info:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:last-child { + border-bottom: none } -.el-button-group .el-button--info:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--card .el-tabs__nav { + border-radius: 0 4px 4px 0; + border-bottom: 1px solid #e4e7ed; + border-left: none } -.el-button-group .el-button--info:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-tabs--right.el-tabs--border-card .el-tabs__header.is-right { + border-left: 1px solid #dfe4ed } -.el-textarea { - position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px +.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right { + border: 1px solid transparent; + margin: -1px -1px -1px 0 } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; - border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) +.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right.is-active { + border-color: transparent; + border-top-color: #d1dbe5; + border-bottom-color: #d1dbe5 } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.slideInLeft-transition, +.slideInRight-transition { + display: inline-block } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.slideInRight-enter { + -webkit-animation: slideInRight-enter .3s; + animation: slideInRight-enter .3s } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.slideInRight-leave { + position: absolute; + left: 0; + right: 0; + -webkit-animation: slideInRight-leave .3s; + animation: slideInRight-leave .3s } -.el-textarea__inner::placeholder { - color: #babdc2 +.slideInLeft-enter { + -webkit-animation: slideInLeft-enter .3s; + animation: slideInLeft-enter .3s } -.el-textarea__inner:hover { - border-color: #babdc2 +.slideInLeft-leave { + position: absolute; + left: 0; + right: 0; + -webkit-animation: slideInLeft-leave .3s; + animation: slideInLeft-leave .3s } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff -} +@-webkit-keyframes slideInRight-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%) + } -.el-textarea .el-input__count { - color: #909399; - background: #fff; - position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0) + } } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +@keyframes slideInRight-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%) + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0) + } } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +@-webkit-keyframes slideInRight-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1 + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + opacity: 0 + } } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +@keyframes slideInRight-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1 + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(100%); + transform: translateX(100%); + opacity: 0 + } } -.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +@-webkit-keyframes slideInLeft-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%) + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0) + } } -.el-textarea.is-disabled .el-textarea__inner::placeholder { - color: #babdc2 +@keyframes slideInLeft-enter { + 0% { + opacity: 0; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%) + } + + to { + opacity: 1; + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0) + } } -.el-textarea.is-exceed .el-textarea__inner { - border-color: #ff4d4f +@-webkit-keyframes slideInLeft-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1 + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + opacity: 0 + } } -.el-textarea.is-exceed .el-input__count { - color: #ff4d4f +@keyframes slideInLeft-leave { + 0% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(0); + transform: translateX(0); + opacity: 1 + } + + 100% { + -webkit-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); + opacity: 0 + } } -.el-input { - position: relative; - font-size: 14px; +.el-tag { + background-color: #e6f0ff; + border-color: #cce1ff; + color: #006aff; display: inline-block; - width: 100% + height: 32px; + padding: 0 10px; + line-height: 30px; + font-size: 12px; + color: #006aff; + border-width: 1px; + border-style: solid; + border-radius: 4px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + white-space: nowrap } -.el-input::-webkit-scrollbar { - z-index: 11; - width: 6px +.el-tag.is-hit { + border-color: #006aff } -.el-input::-webkit-scrollbar:horizontal { - height: 6px +.el-tag .el-tag__close { + color: #006aff } -.el-input::-webkit-scrollbar-thumb { - border-radius: 5px; - width: 6px; - background: #b4bccc +.el-tag .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-input::-webkit-scrollbar-corner { - background: #fff +.el-tag.el-tag--info { + background-color: #f4f4f5; + border-color: #e9e9eb; + color: #909399 } -.el-input::-webkit-scrollbar-track { - background: #fff +.el-tag.el-tag--info.is-hit { + border-color: #909399 } -.el-input::-webkit-scrollbar-track-piece { - background: #fff; - width: 6px +.el-tag.el-tag--info .el-tag__close { + color: #909399 } -.el-input .el-input__clear { - color: #babdc2; - font-size: 14px; - cursor: pointer; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1) +.el-tag.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-input .el-input__clear:hover { - color: #1e2226 +.el-tag.el-tag--success { + background-color: #e7f7ed; + border-color: #cfefdb; + color: #0daf49 } -.el-input .el-input__count { - height: 100%; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - color: #909399; - font-size: 12px +.el-tag.el-tag--success.is-hit { + border-color: #0daf49 } -.el-input .el-input__count .el-input__count-inner { - background: #fff; - line-height: initial; - display: inline-block; - padding: 0 5px +.el-tag.el-tag--success .el-tag__close { + color: #0daf49 } -.el-input__inner { - -webkit-appearance: none; - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - display: inline-block; - font-size: inherit; - height: 40px; - line-height: 40px; - outline: 0; - padding: 0 15px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - width: 100% +.el-tag.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-input__inner::-ms-reveal { - display: none +.el-tag.el-tag--warning { + background-color: #fef3e8; + border-color: #fce7d0; + color: #f08614 } -.el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-tag.el-tag--warning.is-hit { + border-color: #f08614 } -.el-input__inner::-moz-placeholder { - color: #babdc2 +.el-tag.el-tag--warning .el-tag__close { + color: #f08614 } -.el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-tag.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-input__inner::placeholder { - color: #babdc2 +.el-tag.el-tag--danger { + background-color: #ffeded; + border-color: #ffdbdc; + color: #ff4d4f } -.el-input__inner:hover { - border-color: #babdc2 -} - -.el-input__inner:focus { - outline: 0; - border-color: #006aff -} - -.el-input__suffix { - position: absolute; - height: 100%; - right: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s; - pointer-events: none +.el-tag.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-input__suffix-inner { - pointer-events: all +.el-tag.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-input__prefix { - position: absolute; - height: 100%; - left: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s +.el-tag.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-input__icon { - height: 100%; - width: 25px; +.el-tag .el-icon-close { + border-radius: 50%; text-align: center; - -webkit-transition: all .3s; - transition: all .3s; - line-height: 40px + position: relative; + cursor: pointer; + font-size: 12px; + height: 16px; + width: 16px; + line-height: 16px; + vertical-align: middle; + top: -1px; + right: -5px } -.el-input__icon:after { - content: ''; - height: 100%; - width: 0; - display: inline-block; - vertical-align: middle +.el-tag .el-icon-close::before { + display: block } -.el-input__validateIcon { - pointer-events: none +.el-tag--dark { + background-color: #006aff; + border-color: #006aff; + color: #fff } -.el-input.is-active .el-input__inner { - outline: 0; +.el-tag--dark.is-hit { border-color: #006aff } -.el-input.is-disabled .el-input__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-tag--dark .el-tag__close { + color: #fff } -.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-tag--dark .el-tag__close:hover { + color: #fff; + background-color: #38f } -.el-input.is-disabled .el-input__inner::-moz-placeholder { - color: #babdc2 +.el-tag--dark.el-tag--info { + background-color: #909399; + border-color: #909399; + color: #fff } -.el-input.is-disabled .el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-tag--dark.el-tag--info.is-hit { + border-color: #909399 } -.el-input.is-disabled .el-input__inner::placeholder { - color: #babdc2 +.el-tag--dark.el-tag--info .el-tag__close { + color: #fff } -.el-input.is-disabled .el-input__icon { - cursor: not-allowed +.el-tag--dark.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #a6a9ad } -.el-input.is-exceed .el-input__inner { - border-color: #ff4d4f +.el-tag--dark.el-tag--success { + background-color: #0daf49; + border-color: #0daf49; + color: #fff } -.el-input.is-exceed .el-input__suffix .el-input__count { - color: #ff4d4f +.el-tag--dark.el-tag--success.is-hit { + border-color: #0daf49 } -.el-input--suffix .el-input__inner { - padding-right: 30px +.el-tag--dark.el-tag--success .el-tag__close { + color: #fff } -.el-input--prefix .el-input__inner { - padding-left: 30px +.el-tag--dark.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #3dbf6d } -.el-input--medium { - font-size: 14px +.el-tag--dark.el-tag--warning { + background-color: #f08614; + border-color: #f08614; + color: #fff } -.el-input--medium .el-input__inner { - height: 36px; - line-height: 36px +.el-tag--dark.el-tag--warning.is-hit { + border-color: #f08614 } -.el-input--medium .el-input__icon { - line-height: 36px +.el-tag--dark.el-tag--warning .el-tag__close { + color: #fff } -.el-input--small { - font-size: 13px +.el-tag--dark.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f39e43 } -.el-input--small .el-input__inner { - height: 32px; - line-height: 32px +.el-tag--dark.el-tag--danger { + background-color: #ff4d4f; + border-color: #ff4d4f; + color: #fff } -.el-input--small .el-input__icon { - line-height: 32px +.el-tag--dark.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-input--mini { - font-size: 12px +.el-tag--dark.el-tag--danger .el-tag__close { + color: #fff } -.el-input--mini .el-input__inner { - height: 28px; - line-height: 28px +.el-tag--dark.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff7172 } -.el-input--mini .el-input__icon { - line-height: 28px +.el-tag--plain { + background-color: #fff; + border-color: #99c3ff; + color: #006aff } -.el-input-group { - line-height: normal; - display: inline-table; - width: 100%; - border-collapse: separate; - border-spacing: 0 +.el-tag--plain.is-hit { + border-color: #006aff } -.el-input-group>.el-input__inner { - vertical-align: middle; - display: table-cell +.el-tag--plain .el-tag__close { + color: #006aff } -.el-input-group__append, -.el-input-group__prepend { - background-color: #f5f7fa; - color: #909399; - vertical-align: middle; - display: table-cell; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 4px; - padding: 0 20px; - width: 1px; - white-space: nowrap +.el-tag--plain .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-input-group__append:focus, -.el-input-group__prepend:focus { - outline: 0 +.el-tag--plain.el-tag--info { + background-color: #fff; + border-color: #d3d4d6; + color: #909399 } -.el-input-group__append .el-button, -.el-input-group__append .el-select, -.el-input-group__prepend .el-button, -.el-input-group__prepend .el-select { - display: inline-block; - margin: -10px -20px +.el-tag--plain.el-tag--info.is-hit { + border-color: #909399 } -.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-tag--plain.el-tag--info .el-tag__close { + color: #909399 } -.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-tag--plain.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-input-group__prepend { - border-right: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-tag--plain.el-tag--success { + background-color: #fff; + border-color: #9edfb6; + color: #0daf49 } -.el-input-group__append { - border-left: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-tag--plain.el-tag--success.is-hit { + border-color: #0daf49 } -.el-input-group--prepend .el-input__inner { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-tag--plain.el-tag--success .el-tag__close { + color: #0daf49 } -.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-tag--plain.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-input-group--append .el-input__inner { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-tag--plain.el-tag--warning { + background-color: #fff; + border-color: #f9cfa1; + color: #f08614 } -.el-input-group--append .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-tag--plain.el-tag--warning.is-hit { + border-color: #f08614 } -.el-input__inner::-ms-clear { - display: none; - width: 0; - height: 0 +.el-tag--plain.el-tag--warning .el-tag__close { + color: #f08614 } -.el-message-box { - display: inline-block; - width: 420px; - padding-bottom: 10px; - vertical-align: middle; +.el-tag--plain.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 +} + +.el-tag--plain.el-tag--danger { background-color: #fff; - border-radius: 4px; - border: 1px solid #ebeef5; - font-size: 18px; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - text-align: left; - overflow: hidden; - -webkit-backface-visibility: hidden; - backface-visibility: hidden + border-color: #ffb8b9; + color: #ff4d4f } -.el-message-box__wrapper { - position: fixed; - top: 0; - bottom: 0; - left: 0; - right: 0; - text-align: center +.el-tag--plain.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-message-box__wrapper::after { - content: ""; - display: inline-block; - height: 100%; - width: 0; - vertical-align: middle +.el-tag--plain.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-message-box__header { - position: relative; - padding: 15px; - padding-bottom: 10px +.el-tag--plain.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-message-box__title { - padding-left: 0; - margin-bottom: 0; - font-size: 18px; - line-height: 1; - color: #1e2226 +.el-tag--medium { + height: 28px; + line-height: 26px } -.el-message-box__headerbtn { - position: absolute; - top: 15px; - right: 15px; - padding: 0; - border: none; - outline: 0; - background: 0 0; - font-size: 16px; - cursor: pointer +.el-tag--medium .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-message-box__headerbtn .el-message-box__close { - color: #909399 +.el-tag--small { + height: 24px; + padding: 0 8px; + line-height: 22px } -.el-message-box__headerbtn:focus .el-message-box__close, -.el-message-box__headerbtn:hover .el-message-box__close { - color: #006aff +.el-tag--small .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-message-box__content { - padding: 10px 15px; - color: #606266; - font-size: 14px +.el-tag--mini { + height: 20px; + padding: 0 5px; + line-height: 19px } -.el-message-box__container { - position: relative +.el-tag--mini .el-icon-close { + margin-left: -3px; + -webkit-transform: scale(.7); + transform: scale(.7) } -.el-message-box__input { - padding-top: 15px +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-message-box__input input.invalid { - border-color: #ff4d4f +.fade-in-linear-enter, +.fade-in-linear-leave, +.fade-in-linear-leave-active { + opacity: 0 } -.el-message-box__input input.invalid:focus { - border-color: #ff4d4f +.el-fade-in-linear-enter-active, +.el-fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-message-box__status { - position: absolute; - top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - font-size: 24px !important +.el-fade-in-linear-enter, +.el-fade-in-linear-leave, +.el-fade-in-linear-leave-active { + opacity: 0 } -.el-message-box__status::before { - padding-left: 1px +.el-fade-in-enter-active, +.el-fade-in-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-message-box__status+.el-message-box__message { - padding-left: 36px; - padding-right: 12px +.el-fade-in-enter, +.el-fade-in-leave-active { + opacity: 0 } -.el-message-box__status.el-icon-success { - color: #0daf49 +.el-zoom-in-center-enter-active, +.el-zoom-in-center-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-message-box__status.el-icon-info { - color: #909399 +.el-zoom-in-center-enter, +.el-zoom-in-center-leave-active { + opacity: 0; + -webkit-transform: scaleX(0); + transform: scaleX(0) } -.el-message-box__status.el-icon-warning { - color: #f08614 +.el-zoom-in-top-enter-active, +.el-zoom-in-top-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center top; + transform-origin: center top } -.el-message-box__status.el-icon-error { - color: #ff4d4f +.el-zoom-in-top-enter, +.el-zoom-in-top-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-message-box__message { - margin: 0 +.el-zoom-in-bottom-enter-active, +.el-zoom-in-bottom-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center bottom; + transform-origin: center bottom } -.el-message-box__message p { - margin: 0; - line-height: 24px +.el-zoom-in-bottom-enter, +.el-zoom-in-bottom-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-message-box__errormsg { - color: #ff4d4f; - font-size: 12px; - min-height: 18px; - margin-top: 2px +.el-zoom-in-left-enter-active, +.el-zoom-in-left-leave-active { + opacity: 1; + -webkit-transform: scale(1, 1); + transform: scale(1, 1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: top left; + transform-origin: top left } -.el-message-box__btns { - padding: 5px 15px 0; - text-align: right +.el-zoom-in-left-enter, +.el-zoom-in-left-leave-active { + opacity: 0; + -webkit-transform: scale(.45, .45); + transform: scale(.45, .45) } -.el-message-box__btns button:nth-child(2) { - margin-left: 10px +.collapse-transition { + -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; + transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out } -.el-message-box__btns-reverse { - -webkit-box-orient: horizontal; - -webkit-box-direction: reverse; - -ms-flex-direction: row-reverse; - flex-direction: row-reverse +.horizontal-collapse-transition { + -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; + transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out } -.el-message-box--center { - padding-bottom: 30px +.el-list-enter-active, +.el-list-leave-active { + -webkit-transition: all 1s; + transition: all 1s } -.el-message-box--center .el-message-box__header { - padding-top: 30px +.el-list-enter, +.el-list-leave-active { + opacity: 0; + -webkit-transform: translateY(-30px); + transform: translateY(-30px) } -.el-message-box--center .el-message-box__title { - position: relative; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center +.el-opacity-transition { + -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); + transition: opacity .3s cubic-bezier(.55, 0, .1, 1) } -.el-message-box--center .el-message-box__status { +.el-checkbox { + color: #606266; + font-weight: 500; + font-size: 14px; position: relative; - top: auto; - padding-right: 5px; - text-align: center; - -webkit-transform: translateY(-1px); - transform: translateY(-1px) + cursor: pointer; + display: inline-block; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + margin-right: 30px } -.el-message-box--center .el-message-box__message { - margin-left: 0 +.el-checkbox.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: normal; + height: 40px } -.el-message-box--center .el-message-box__btns, -.el-message-box--center .el-message-box__content { - text-align: center +.el-checkbox.is-bordered.is-checked { + border-color: #006aff } -.el-message-box--center .el-message-box__content { - padding-left: 27px; - padding-right: 27px +.el-checkbox.is-bordered.is-disabled { + border-color: #ebeef5; + cursor: not-allowed } -.msgbox-fade-enter-active { - -webkit-animation: msgbox-fade-in .3s; - animation: msgbox-fade-in .3s +.el-checkbox.is-bordered+.el-checkbox.is-bordered { + margin-left: 10px } -.msgbox-fade-leave-active { - -webkit-animation: msgbox-fade-out .3s; - animation: msgbox-fade-out .3s +.el-checkbox.is-bordered.el-checkbox--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px } -@-webkit-keyframes msgbox-fade-in { - 0% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } - - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { + line-height: 17px; + font-size: 14px } -@keyframes msgbox-fade-in { - 0% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } - - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { + height: 14px; + width: 14px } -@-webkit-keyframes msgbox-fade-out { - 0% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } - - 100% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-checkbox.is-bordered.el-checkbox--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px } -@keyframes msgbox-fade-out { - 0% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } - - 100% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { + line-height: 15px; + font-size: 12px } -.el-breadcrumb { - font-size: 14px; - line-height: 1 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { + height: 12px; + width: 12px } -.el-breadcrumb::after, -.el-breadcrumb::before { - display: table; - content: "" +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-breadcrumb::after { - clear: both +.el-checkbox.is-bordered.el-checkbox--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px } -.el-breadcrumb__separator { - margin: 0 9px; - font-weight: 700; - color: #babdc2 +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { + line-height: 12px; + font-size: 12px } -.el-breadcrumb__separator[class*=icon] { - margin: 0 6px; - font-weight: 400 +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { + height: 12px; + width: 12px } -.el-breadcrumb__item { - float: left +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-breadcrumb__inner { - color: #606266 +.el-checkbox__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-breadcrumb__inner a, -.el-breadcrumb__inner.is-link { - font-weight: 700; - text-decoration: none; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1); - color: #1e2226 +.el-checkbox__input.is-disabled .el-checkbox__inner { + background-color: #edf2fc; + border-color: #dfe2e6; + cursor: not-allowed } -.el-breadcrumb__inner a:hover, -.el-breadcrumb__inner.is-link:hover { - color: #006aff; - cursor: pointer +.el-checkbox__input.is-disabled .el-checkbox__inner::after { + cursor: not-allowed; + border-color: #babdc2 } -.el-breadcrumb__item:last-child .el-breadcrumb__inner, -.el-breadcrumb__item:last-child .el-breadcrumb__inner a, -.el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover, -.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover { - font-weight: 400; - color: #606266; - cursor: text +.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { + cursor: not-allowed } -.el-breadcrumb__item:last-child .el-breadcrumb__separator { - display: none +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-form--label-left .el-form-item__label { - text-align: left +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { + border-color: #babdc2 } -.el-form--label-top .el-form-item__label { - float: none; - display: inline-block; - text-align: left; - padding: 0 0 10px 0 +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-form--inline .el-form-item { - display: inline-block; - margin-right: 10px; - vertical-align: top +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { + background-color: #babdc2; + border-color: #babdc2 } -.el-form--inline .el-form-item__label { - float: none; - display: inline-block +.el-checkbox__input.is-disabled+span.el-checkbox__label { + color: #babdc2; + cursor: not-allowed } -.el-form--inline .el-form-item__content { - display: inline-block; - vertical-align: top +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-form--inline.el-form--label-top .el-form-item__content { - display: block +.el-checkbox__input.is-checked .el-checkbox__inner::after { + -webkit-transform: rotate(45deg) scaleY(1); + transform: rotate(45deg) scaleY(1) } -.el-form-item { - margin-bottom: 22px +.el-checkbox__input.is-checked+.el-checkbox__label { + color: #006aff } -.el-form-item::after, -.el-form-item::before { - display: table; - content: "" +.el-checkbox__input.is-focus .el-checkbox__inner { + border-color: #006aff } -.el-form-item::after { - clear: both +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-form-item .el-form-item { - margin-bottom: 0 +.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { + content: ''; + position: absolute; + display: block; + background-color: #fff; + height: 2px; + -webkit-transform: scale(.5); + transform: scale(.5); + left: 0; + right: 0; + top: 5px } -.el-form-item .el-input__validateIcon { +.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { display: none } -.el-form-item--medium .el-form-item__label { - line-height: 36px -} - -.el-form-item--medium .el-form-item__content { - line-height: 36px -} - -.el-form-item--small .el-form-item__label { - line-height: 32px -} - -.el-form-item--small .el-form-item__content { - line-height: 32px -} - -.el-form-item--small.el-form-item { - margin-bottom: 18px +.el-checkbox__inner { + display: inline-block; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 2px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 14px; + height: 14px; + background-color: #fff; + z-index: 1; + -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); + transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) } -.el-form-item--small .el-form-item__error { - padding-top: 2px +.el-checkbox__inner:hover { + border-color: #006aff } -.el-form-item--mini .el-form-item__label { - line-height: 28px +.el-checkbox__inner::after { + -webkit-box-sizing: content-box; + box-sizing: content-box; + content: ""; + border: 1px solid #fff; + border-left: 0; + border-top: 0; + height: 7px; + left: 4px; + position: absolute; + top: 1px; + -webkit-transform: rotate(45deg) scaleY(0); + transform: rotate(45deg) scaleY(0); + width: 3px; + -webkit-transition: -webkit-transform .15s ease-in .05s; + transition: -webkit-transform .15s ease-in .05s; + transition: transform .15s ease-in .05s; + transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; + -webkit-transform-origin: center; + transform-origin: center } -.el-form-item--mini .el-form-item__content { - line-height: 28px +.el-checkbox__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1 } -.el-form-item--mini.el-form-item { - margin-bottom: 18px +.el-checkbox__label { + display: inline-block; + padding-left: 10px; + line-height: 19px; + font-size: 14px } -.el-form-item--mini .el-form-item__error { - padding-top: 1px +.el-checkbox:last-of-type { + margin-right: 0 } -.el-form-item__label-wrap { - float: left +.el-checkbox-button { + position: relative; + display: inline-block } -.el-form-item__label-wrap .el-form-item__label { +.el-checkbox-button__inner { display: inline-block; - float: none -} - -.el-form-item__label { - text-align: right; + line-height: 1; + font-weight: 500; + white-space: nowrap; vertical-align: middle; - float: left; - font-size: 14px; + cursor: pointer; + background: #fff; + border: 1px solid #dfe2e6; + border-left: 0; color: #606266; - line-height: 40px; - padding: 0 12px 0 0; + -webkit-appearance: none; + text-align: center; -webkit-box-sizing: border-box; - box-sizing: border-box + box-sizing: border-box; + outline: 0; + margin: 0; + position: relative; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 0 } -.el-form-item__content { - line-height: 40px; - position: relative; - font-size: 14px +.el-checkbox-button__inner.is-round { + padding: 12px 20px } -.el-form-item__content::after, -.el-form-item__content::before { - display: table; - content: "" +.el-checkbox-button__inner:hover { + color: #006aff } -.el-form-item__content::after { - clear: both +.el-checkbox-button__inner [class*=el-icon-] { + line-height: .9 } -.el-form-item__content .el-input-group { - vertical-align: top +.el-checkbox-button__inner [class*=el-icon-]+span { + margin-left: 5px } -.el-form-item__error { - color: #ff4d4f; - font-size: 12px; - line-height: 1; - padding-top: 4px; +.el-checkbox-button__original { + opacity: 0; + outline: 0; position: absolute; - top: 100%; - left: 0 + margin: 0; + z-index: -1 } -.el-form-item__error--inline { - position: relative; - top: auto; - left: auto; - display: inline-block; - margin-left: 10px +.el-checkbox-button.is-checked .el-checkbox-button__inner { + color: #fff; + background-color: #006aff; + border-color: #006aff; + -webkit-box-shadow: -1px 0 0 0 #66a6ff; + box-shadow: -1px 0 0 0 #66a6ff } -.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, -.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before { - content: '*'; - color: #ff4d4f; - margin-right: 4px +.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { + border-left-color: #006aff } -.el-form-item.is-error .el-input__inner, -.el-form-item.is-error .el-input__inner:focus, -.el-form-item.is-error .el-textarea__inner, -.el-form-item.is-error .el-textarea__inner:focus { - border-color: #ff4d4f +.el-checkbox-button.is-disabled .el-checkbox-button__inner { + color: #babdc2; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; + -webkit-box-shadow: none; + box-shadow: none } -.el-form-item.is-error .el-input-group__append .el-input__inner, -.el-form-item.is-error .el-input-group__prepend .el-input__inner { - border-color: transparent +.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { + border-left-color: #ebeef5 } -.el-form-item.is-error .el-input__validateIcon { - color: #ff4d4f +.el-checkbox-button:first-child .el-checkbox-button__inner { + border-left: 1px solid #dfe2e6; + border-radius: 4px 0 0 4px; + -webkit-box-shadow: none !important; + box-shadow: none !important } -.el-form-item--feedback .el-input__validateIcon { - display: inline-block +.el-checkbox-button.is-focus .el-checkbox-button__inner { + border-color: #006aff } -.el-tabs__header { - padding: 0; - position: relative; - margin: 0 0 15px +.el-checkbox-button:last-child .el-checkbox-button__inner { + border-radius: 0 4px 4px 0 } -.el-tabs__active-bar { - position: absolute; - bottom: 0; - left: 0; - height: 2px; - background-color: #006aff; - z-index: 1; - -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); - transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); - transition: transform .3s cubic-bezier(.645, .045, .355, 1); - transition: transform .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); - list-style: none +.el-checkbox-button--medium .el-checkbox-button__inner { + padding: 10px 20px; + font-size: 14px; + border-radius: 0 } -.el-tabs__new-tab { - float: right; - border: 1px solid #d3dce6; - height: 18px; - width: 18px; - line-height: 18px; - margin: 12px 0 9px 10px; - border-radius: 3px; - text-align: center; +.el-checkbox-button--medium .el-checkbox-button__inner.is-round { + padding: 10px 20px +} + +.el-checkbox-button--small .el-checkbox-button__inner { + padding: 9px 15px; font-size: 12px; - color: #d3dce6; - cursor: pointer; - -webkit-transition: all .15s; - transition: all .15s + border-radius: 0 } -.el-tabs__new-tab .el-icon-plus { - -webkit-transform: scale(.8, .8); - transform: scale(.8, .8) +.el-checkbox-button--small .el-checkbox-button__inner.is-round { + padding: 9px 15px } -.el-tabs__new-tab:hover { - color: #006aff +.el-checkbox-button--mini .el-checkbox-button__inner { + padding: 7px 15px; + font-size: 12px; + border-radius: 0 } -.el-tabs__nav-wrap { - overflow: hidden; - margin-bottom: -1px; - position: relative +.el-checkbox-button--mini .el-checkbox-button__inner.is-round { + padding: 7px 15px } -.el-tabs__nav-wrap::after { - content: ""; - position: absolute; - left: 0; - bottom: 0; - width: 100%; - height: 2px; - background-color: #e4e7ed; - z-index: 1 +.el-checkbox-group { + font-size: 0 } -.el-tabs__nav-wrap.is-scrollable { - padding: 0 20px; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-tree { + position: relative; + cursor: default; + background: #fff; + color: #606266 } -.el-tabs__nav-scroll { - overflow: hidden +.el-tree__empty-block { + position: relative; + min-height: 60px; + text-align: center; + width: 100%; + height: 100% } -.el-tabs__nav-next, -.el-tabs__nav-prev { +.el-tree__empty-text { position: absolute; - cursor: pointer; - line-height: 44px; - font-size: 12px; - color: #1e2226 + left: 50%; + top: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + color: #1e2226; + font-size: 14px } -.el-tabs__nav-next { - right: 0 +.el-tree__drop-indicator { + position: absolute; + left: 0; + right: 0; + height: 1px; + background-color: #006aff } -.el-tabs__nav-prev { - left: 0 +.el-tree-node { + white-space: nowrap; + outline: 0 } -.el-tabs__nav { - white-space: nowrap; - position: relative; - -webkit-transition: -webkit-transform .3s; - transition: -webkit-transform .3s; - transition: transform .3s; - transition: transform .3s, -webkit-transform .3s; - float: left; - z-index: 2 +.el-tree-node:focus>.el-tree-node__content { + background-color: #f5f7fa } -.el-tabs__nav.is-stretch { - min-width: 100%; - display: -webkit-box; - display: -ms-flexbox; - display: flex +.el-tree-node.is-drop-inner>.el-tree-node__content .el-tree-node__label { + background-color: #006aff; + color: #fff } -.el-tabs__nav.is-stretch>* { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - text-align: center +.el-tree-node__content { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + height: 26px; + cursor: pointer } -.el-tabs__item { - padding: 0 20px; - height: 40px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - line-height: 40px; - display: inline-block; - list-style: none; - font-size: 14px; - font-weight: 500; - color: #1e2226; - position: relative +.el-tree-node__content>.el-tree-node__expand-icon { + padding: 6px } -.el-tabs__item:focus, -.el-tabs__item:focus:active { - outline: 0 +.el-tree-node__content>label.el-checkbox { + margin-right: 8px } -.el-tabs__item:focus.is-active.is-focus:not(:active) { - -webkit-box-shadow: 0 0 2px 2px #006aff inset; - box-shadow: 0 0 2px 2px #006aff inset; - border-radius: 3px +.el-tree-node__content:hover { + background-color: #f5f7fa } -.el-tabs__item .el-icon-close { - border-radius: 50%; - text-align: center; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - margin-left: 5px +.el-tree.is-dragging .el-tree-node__content { + cursor: move } -.el-tabs__item .el-icon-close:before { - -webkit-transform: scale(.9); - transform: scale(.9); - display: inline-block +.el-tree.is-dragging .el-tree-node__content * { + pointer-events: none } -.el-tabs__item .el-icon-close:hover { - background-color: #babdc2; - color: #fff +.el-tree.is-dragging.is-drop-not-allow .el-tree-node__content { + cursor: not-allowed } -.el-tabs__item.is-active { - color: #006aff +.el-tree-node__expand-icon { + cursor: pointer; + color: #babdc2; + font-size: 12px; + -webkit-transform: rotate(0); + transform: rotate(0); + -webkit-transition: -webkit-transform .3s ease-in-out; + transition: -webkit-transform .3s ease-in-out; + transition: transform .3s ease-in-out; + transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out } -.el-tabs__item:hover { - color: #006aff; - cursor: pointer +.el-tree-node__expand-icon.expanded { + -webkit-transform: rotate(90deg); + transform: rotate(90deg) } -.el-tabs__item.is-disabled { - color: #babdc2; +.el-tree-node__expand-icon.is-leaf { + color: transparent; cursor: default } -.el-tabs__content { - overflow: hidden; - position: relative +.el-tree-node__label { + font-size: 14px } -.el-tabs--card>.el-tabs__header { - border-bottom: 1px solid #e4e7ed +.el-tree-node__loading-icon { + margin-right: 8px; + font-size: 14px; + color: #babdc2 } -.el-tabs--card>.el-tabs__header .el-tabs__nav-wrap::after { - content: none +.el-tree-node>.el-tree-node__children { + overflow: hidden; + background-color: transparent } -.el-tabs--card>.el-tabs__header .el-tabs__nav { - border: 1px solid #e4e7ed; - border-bottom: none; - border-radius: 4px 4px 0 0; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-tree-node.is-expanded>.el-tree-node__children { + display: block } -.el-tabs--card>.el-tabs__header .el-tabs__active-bar { - display: none +.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { + background-color: #ebf3ff } -.el-tabs--card>.el-tabs__header .el-tabs__item .el-icon-close { +.el-alert { + width: 100%; + padding: 8px 16px; + margin: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-radius: 4px; position: relative; - font-size: 12px; - width: 0; - height: 14px; - vertical-align: middle; - line-height: 15px; + background-color: #fff; overflow: hidden; - top: -1px; - right: -2px; - -webkit-transform-origin: 100% 50%; - transform-origin: 100% 50% -} - -.el-tabs--card>.el-tabs__header .el-tabs__item { - border-bottom: 1px solid transparent; - border-left: 1px solid #e4e7ed; - -webkit-transition: color .3s cubic-bezier(.645, .045, .355, 1), padding .3s cubic-bezier(.645, .045, .355, 1); - transition: color .3s cubic-bezier(.645, .045, .355, 1), padding .3s cubic-bezier(.645, .045, .355, 1) + opacity: 1; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-transition: opacity .2s; + transition: opacity .2s } -.el-tabs--card>.el-tabs__header .el-tabs__item:first-child { - border-left: none +.el-alert.is-light .el-alert__closebtn { + color: #babdc2 } -.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover { - padding-left: 13px; - padding-right: 13px +.el-alert.is-dark .el-alert__closebtn { + color: #fff } -.el-tabs--card>.el-tabs__header .el-tabs__item.is-closable:hover .el-icon-close { - width: 14px +.el-alert.is-dark .el-alert__description { + color: #fff } -.el-tabs--card>.el-tabs__header .el-tabs__item.is-active { - border-bottom-color: #fff +.el-alert.is-center { + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center } -.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable { - padding-left: 20px; - padding-right: 20px +.el-alert--success.is-light { + background-color: #e7f7ed; + color: #0daf49 } -.el-tabs--card>.el-tabs__header .el-tabs__item.is-active.is-closable .el-icon-close { - width: 14px +.el-alert--success.is-light .el-alert__description { + color: #0daf49 } -.el-tabs--border-card { - background: #fff; - border: 1px solid #dfe2e6; - -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04); - box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04) +.el-alert--success.is-dark { + background-color: #0daf49; + color: #fff } -.el-tabs--border-card>.el-tabs__content { - padding: 15px +.el-alert--info.is-light { + background-color: #f4f4f5; + color: #909399 } -.el-tabs--border-card>.el-tabs__header { - background-color: #f5f7fa; - border-bottom: 1px solid #e4e7ed; - margin: 0 +.el-alert--info.is-dark { + background-color: #909399; + color: #fff } -.el-tabs--border-card>.el-tabs__header .el-tabs__nav-wrap::after { - content: none +.el-alert--info .el-alert__description { + color: #909399 } -.el-tabs--border-card>.el-tabs__header .el-tabs__item { - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - border: 1px solid transparent; - margin-top: -1px; - color: #1e2226 +.el-alert--warning.is-light { + background-color: #fef3e8; + color: #f08614 } -.el-tabs--border-card>.el-tabs__header .el-tabs__item:first-child { - margin-left: -1px +.el-alert--warning.is-light .el-alert__description { + color: #f08614 } -.el-tabs--border-card>.el-tabs__header .el-tabs__item+.el-tabs__item { - margin-left: -1px +.el-alert--warning.is-dark { + background-color: #f08614; + color: #fff } -.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active { - color: #006aff; - background-color: #fff; - border-right-color: #dfe2e6; - border-left-color: #dfe2e6 +.el-alert--error.is-light { + background-color: #ffeded; + color: #ff4d4f } -.el-tabs--border-card>.el-tabs__header .el-tabs__item:not(.is-disabled):hover { - color: #006aff +.el-alert--error.is-light .el-alert__description { + color: #ff4d4f } -.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-disabled { - color: #babdc2 +.el-alert--error.is-dark { + background-color: #ff4d4f; + color: #fff } -.el-tabs--border-card>.el-tabs__header .is-scrollable .el-tabs__item:first-child { - margin-left: 0 +.el-alert__content { + display: table-cell; + padding: 0 8px } -.el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2), -.el-tabs--bottom .el-tabs__item.is-top:nth-child(2), -.el-tabs--top .el-tabs__item.is-bottom:nth-child(2), -.el-tabs--top .el-tabs__item.is-top:nth-child(2) { - padding-left: 0 +.el-alert__icon { + font-size: 16px; + width: 16px } -.el-tabs--bottom .el-tabs__item.is-bottom:last-child, -.el-tabs--bottom .el-tabs__item.is-top:last-child, -.el-tabs--top .el-tabs__item.is-bottom:last-child, -.el-tabs--top .el-tabs__item.is-top:last-child { - padding-right: 0 +.el-alert__icon.is-big { + font-size: 28px; + width: 28px } -.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:nth-child(2), -.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:nth-child(2) { - padding-left: 20px +.el-alert__title { + font-size: 13px; + line-height: 18px } -.el-tabs--bottom .el-tabs--left>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--bottom .el-tabs--right>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--bottom.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--bottom.el-tabs--card>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--top .el-tabs--left>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--top .el-tabs--right>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--top.el-tabs--border-card>.el-tabs__header .el-tabs__item:last-child, -.el-tabs--top.el-tabs--card>.el-tabs__header .el-tabs__item:last-child { - padding-right: 20px +.el-alert__title.is-bold { + font-weight: 700 } -.el-tabs--bottom .el-tabs__header.is-bottom { - margin-bottom: 0; - margin-top: 10px +.el-alert .el-alert__description { + font-size: 12px; + margin: 5px 0 0 0 } -.el-tabs--bottom.el-tabs--border-card .el-tabs__header.is-bottom { - border-bottom: 0; - border-top: 1px solid #dfe2e6 +.el-alert__closebtn { + font-size: 12px; + opacity: 1; + position: absolute; + top: 12px; + right: 15px; + cursor: pointer } -.el-tabs--bottom.el-tabs--border-card .el-tabs__nav-wrap.is-bottom { - margin-top: -1px; - margin-bottom: 0 +.el-alert__closebtn.is-customed { + font-style: normal; + font-size: 13px; + top: 9px } -.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom:not(.is-active) { - border: 1px solid transparent +.el-alert-fade-enter, +.el-alert-fade-leave-active { + opacity: 0 } -.el-tabs--bottom.el-tabs--border-card .el-tabs__item.is-bottom { - margin: 0 -1px -1px -1px +.el-notification { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + width: 330px; + padding: 14px 26px 14px 13px; + border-radius: 8px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border: 1px solid #ebeef5; + position: fixed; + background-color: #fff; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + -webkit-transition: opacity .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; + transition: opacity .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; + transition: opacity .3s, transform .3s, left .3s, right .3s, top .4s, bottom .3s; + transition: opacity .3s, transform .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; + overflow: hidden } -.el-tabs--left, -.el-tabs--right { - overflow: hidden +.el-notification.right { + right: 16px } -.el-tabs--left .el-tabs__header.is-left, -.el-tabs--left .el-tabs__header.is-right, -.el-tabs--left .el-tabs__nav-scroll, -.el-tabs--left .el-tabs__nav-wrap.is-left, -.el-tabs--left .el-tabs__nav-wrap.is-right, -.el-tabs--right .el-tabs__header.is-left, -.el-tabs--right .el-tabs__header.is-right, -.el-tabs--right .el-tabs__nav-scroll, -.el-tabs--right .el-tabs__nav-wrap.is-left, -.el-tabs--right .el-tabs__nav-wrap.is-right { - height: 100% +.el-notification.left { + left: 16px } -.el-tabs--left .el-tabs__active-bar.is-left, -.el-tabs--left .el-tabs__active-bar.is-right, -.el-tabs--right .el-tabs__active-bar.is-left, -.el-tabs--right .el-tabs__active-bar.is-right { - top: 0; - bottom: auto; - width: 2px; - height: auto +.el-notification__group { + margin-left: 13px; + margin-right: 8px } -.el-tabs--left .el-tabs__nav-wrap.is-left, -.el-tabs--left .el-tabs__nav-wrap.is-right, -.el-tabs--right .el-tabs__nav-wrap.is-left, -.el-tabs--right .el-tabs__nav-wrap.is-right { - margin-bottom: 0 +.el-notification__title { + font-weight: 700; + font-size: 16px; + color: #1e2226; + margin: 0 } -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev { - height: 30px; - line-height: 30px; - width: 100%; - text-align: center; - cursor: pointer +.el-notification__content { + font-size: 14px; + line-height: 21px; + margin: 6px 0 0 0; + color: #606266; + text-align: justify } -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i, -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next i, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev i, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next i, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev i { - -webkit-transform: rotateZ(90deg); - transform: rotateZ(90deg) +.el-notification__content p { + margin: 0 } -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-prev, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-prev { - left: auto; - top: 0 +.el-notification__icon { + height: 24px; + width: 24px; + font-size: 24px } -.el-tabs--left .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, -.el-tabs--left .el-tabs__nav-wrap.is-right>.el-tabs__nav-next, -.el-tabs--right .el-tabs__nav-wrap.is-left>.el-tabs__nav-next, -.el-tabs--right .el-tabs__nav-wrap.is-right>.el-tabs__nav-next { - right: auto; - bottom: 0 +.el-notification__closeBtn { + position: absolute; + top: 18px; + right: 15px; + cursor: pointer; + color: #1e2226; + font-size: 16px } -.el-tabs--left .el-tabs__nav-wrap.is-left.is-scrollable, -.el-tabs--left .el-tabs__nav-wrap.is-right.is-scrollable, -.el-tabs--right .el-tabs__nav-wrap.is-left.is-scrollable, -.el-tabs--right .el-tabs__nav-wrap.is-right.is-scrollable { - padding: 30px 0 +.el-notification__closeBtn:hover { + color: #606266 } -.el-tabs--left .el-tabs__nav-wrap.is-left::after, -.el-tabs--left .el-tabs__nav-wrap.is-right::after, -.el-tabs--right .el-tabs__nav-wrap.is-left::after, -.el-tabs--right .el-tabs__nav-wrap.is-right::after { - height: 100%; - width: 2px; - bottom: auto; - top: 0 +.el-notification .el-icon-success { + color: #0daf49 } -.el-tabs--left .el-tabs__nav.is-left, -.el-tabs--left .el-tabs__nav.is-right, -.el-tabs--right .el-tabs__nav.is-left, -.el-tabs--right .el-tabs__nav.is-right { - float: none +.el-notification .el-icon-error { + color: #ff4d4f } -.el-tabs--left .el-tabs__item.is-left, -.el-tabs--left .el-tabs__item.is-right, -.el-tabs--right .el-tabs__item.is-left, -.el-tabs--right .el-tabs__item.is-right { - display: block +.el-notification .el-icon-info { + color: #909399 } -.el-tabs--left .el-tabs__header.is-left { - float: left; - margin-bottom: 0; - margin-right: 10px +.el-notification .el-icon-warning { + color: #f08614 } -.el-tabs--left .el-tabs__nav-wrap.is-left { - margin-right: -1px +.el-notification-fade-enter.right { + right: 0; + -webkit-transform: translateX(100%); + transform: translateX(100%) } -.el-tabs--left .el-tabs__nav-wrap.is-left::after { - left: auto; - right: 0 +.el-notification-fade-enter.left { + left: 0; + -webkit-transform: translateX(-100%); + transform: translateX(-100%) } -.el-tabs--left .el-tabs__active-bar.is-left { - right: 0; - left: auto +.el-notification-fade-leave-active { + opacity: 0 } -.el-tabs--left .el-tabs__item.is-left { - text-align: right +.el-textarea { + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: 14px } -.el-tabs--left.el-tabs--card .el-tabs__active-bar.is-left { - display: none +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-tabs--left.el-tabs--card .el-tabs__item.is-left { - border-left: none; - border-right: 1px solid #e4e7ed; - border-bottom: none; - border-top: 1px solid #e4e7ed; - text-align: left +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-tabs--left.el-tabs--card .el-tabs__item.is-left:first-child { - border-right: 1px solid #e4e7ed; - border-top: none +.el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active { - border: 1px solid #e4e7ed; - border-right-color: #fff; - border-left: none; - border-bottom: none +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:first-child { - border-top: none +.el-textarea__inner::placeholder { + color: #babdc2 } -.el-tabs--left.el-tabs--card .el-tabs__item.is-left.is-active:last-child { - border-bottom: none +.el-textarea__inner:hover { + border-color: #babdc2 } -.el-tabs--left.el-tabs--card .el-tabs__nav { - border-radius: 4px 0 0 4px; - border-bottom: 1px solid #e4e7ed; - border-right: none +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff } -.el-tabs--left.el-tabs--card .el-tabs__new-tab { - float: none +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px } -.el-tabs--left.el-tabs--border-card .el-tabs__header.is-left { - border-right: 1px solid #dfe4ed +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left { - border: 1px solid transparent; - margin: -1px 0 -1px -1px +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-tabs--left.el-tabs--border-card .el-tabs__item.is-left.is-active { - border-color: transparent; - border-top-color: #d1dbe5; - border-bottom-color: #d1dbe5 +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-tabs--right .el-tabs__header.is-right { - float: right; - margin-bottom: 0; - margin-left: 10px +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-tabs--right .el-tabs__nav-wrap.is-right { - margin-left: -1px +.el-textarea.is-disabled .el-textarea__inner::placeholder { + color: #babdc2 } -.el-tabs--right .el-tabs__nav-wrap.is-right::after { - left: 0; - right: auto +.el-textarea.is-exceed .el-textarea__inner { + border-color: #ff4d4f } -.el-tabs--right .el-tabs__active-bar.is-right { - left: 0 +.el-textarea.is-exceed .el-input__count { + color: #ff4d4f } -.el-tabs--right.el-tabs--card .el-tabs__active-bar.is-right { - display: none +.el-input { + position: relative; + font-size: 14px; + display: inline-block; + width: 100% } -.el-tabs--right.el-tabs--card .el-tabs__item.is-right { - border-bottom: none; - border-top: 1px solid #e4e7ed +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px } -.el-tabs--right.el-tabs--card .el-tabs__item.is-right:first-child { - border-left: 1px solid #e4e7ed; - border-top: none +.el-input::-webkit-scrollbar:horizontal { + height: 6px } -.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active { - border: 1px solid #e4e7ed; - border-left-color: #fff; - border-right: none; - border-bottom: none +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc } -.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:first-child { - border-top: none +.el-input::-webkit-scrollbar-corner { + background: #fff } -.el-tabs--right.el-tabs--card .el-tabs__item.is-right.is-active:last-child { - border-bottom: none +.el-input::-webkit-scrollbar-track { + background: #fff } -.el-tabs--right.el-tabs--card .el-tabs__nav { - border-radius: 0 4px 4px 0; - border-bottom: 1px solid #e4e7ed; - border-left: none +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px } -.el-tabs--right.el-tabs--border-card .el-tabs__header.is-right { - border-left: 1px solid #dfe4ed +.el-input .el-input__clear { + color: #babdc2; + font-size: 14px; + cursor: pointer; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1) } -.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right { - border: 1px solid transparent; - margin: -1px -1px -1px 0 +.el-input .el-input__clear:hover { + color: #1e2226 } -.el-tabs--right.el-tabs--border-card .el-tabs__item.is-right.is-active { - border-color: transparent; - border-top-color: #d1dbe5; - border-bottom-color: #d1dbe5 +.el-input .el-input__count { + height: 100%; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + color: #909399; + font-size: 12px } -.slideInLeft-transition, -.slideInRight-transition { - display: inline-block +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px } -.slideInRight-enter { - -webkit-animation: slideInRight-enter .3s; - animation: slideInRight-enter .3s +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + display: inline-block; + font-size: inherit; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + width: 100% } -.slideInRight-leave { - position: absolute; - left: 0; - right: 0; - -webkit-animation: slideInRight-leave .3s; - animation: slideInRight-leave .3s -} - -.slideInLeft-enter { - -webkit-animation: slideInLeft-enter .3s; - animation: slideInLeft-enter .3s +.el-input__inner::-ms-reveal { + display: none } -.slideInLeft-leave { - position: absolute; - left: 0; - right: 0; - -webkit-animation: slideInLeft-leave .3s; - animation: slideInLeft-leave .3s +.el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -@-webkit-keyframes slideInRight-enter { - 0% { - opacity: 0; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(100%); - transform: translateX(100%) - } - - to { - opacity: 1; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0) - } +.el-input__inner::-moz-placeholder { + color: #babdc2 } -@keyframes slideInRight-enter { - 0% { - opacity: 0; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(100%); - transform: translateX(100%) - } - - to { - opacity: 1; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0) - } +.el-input__inner::-ms-input-placeholder { + color: #babdc2 } -@-webkit-keyframes slideInRight-leave { - 0% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0); - opacity: 1 - } - - 100% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(100%); - transform: translateX(100%); - opacity: 0 - } +.el-input__inner::placeholder { + color: #babdc2 } -@keyframes slideInRight-leave { - 0% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0); - opacity: 1 - } - - 100% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(100%); - transform: translateX(100%); - opacity: 0 - } +.el-input__inner:hover { + border-color: #babdc2 } -@-webkit-keyframes slideInLeft-enter { - 0% { - opacity: 0; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(-100%); - transform: translateX(-100%) - } - - to { - opacity: 1; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0) - } +.el-input__inner:focus { + outline: 0; + border-color: #006aff } -@keyframes slideInLeft-enter { - 0% { - opacity: 0; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(-100%); - transform: translateX(-100%) - } - - to { - opacity: 1; - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0) - } +.el-input__suffix { + position: absolute; + height: 100%; + right: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s; + pointer-events: none } -@-webkit-keyframes slideInLeft-leave { - 0% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0); - opacity: 1 - } - - 100% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - opacity: 0 - } +.el-input__suffix-inner { + pointer-events: all } -@keyframes slideInLeft-leave { - 0% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(0); - transform: translateX(0); - opacity: 1 - } +.el-input__prefix { + position: absolute; + height: 100%; + left: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s +} - 100% { - -webkit-transform-origin: 0 0; - transform-origin: 0 0; - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - opacity: 0 - } +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all .3s; + transition: all .3s; + line-height: 40px } -.el-tag { - background-color: #e6f0ff; - border-color: #cce1ff; - color: #006aff; +.el-input__icon:after { + content: ''; + height: 100%; + width: 0; display: inline-block; - height: 32px; - padding: 0 10px; - line-height: 30px; - font-size: 12px; - color: #006aff; - border-width: 1px; - border-style: solid; - border-radius: 4px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - white-space: nowrap + vertical-align: middle } -.el-tag.is-hit { - border-color: #006aff +.el-input__validateIcon { + pointer-events: none } -.el-tag .el-tag__close { - color: #006aff +.el-input.is-active .el-input__inner { + outline: 0; + border-color: #006aff } -.el-tag .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-input.is-disabled .el-input__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-tag.el-tag--info { - background-color: #f4f4f5; - border-color: #e9e9eb; - color: #909399 +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-tag.el-tag--info.is-hit { - border-color: #909399 +.el-input.is-disabled .el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-tag.el-tag--info .el-tag__close { - color: #909399 +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.el-tag.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-input.is-disabled .el-input__inner::placeholder { + color: #babdc2 } -.el-tag.el-tag--success { - background-color: #e7f7ed; - border-color: #cfefdb; - color: #0daf49 +.el-input.is-disabled .el-input__icon { + cursor: not-allowed } -.el-tag.el-tag--success.is-hit { - border-color: #0daf49 +.el-input.is-exceed .el-input__inner { + border-color: #ff4d4f } -.el-tag.el-tag--success .el-tag__close { - color: #0daf49 +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #ff4d4f } -.el-tag.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-input--suffix .el-input__inner { + padding-right: 30px } -.el-tag.el-tag--warning { - background-color: #fef3e8; - border-color: #fce7d0; - color: #f08614 -} - -.el-tag.el-tag--warning.is-hit { - border-color: #f08614 -} - -.el-tag.el-tag--warning .el-tag__close { - color: #f08614 +.el-input--prefix .el-input__inner { + padding-left: 30px } -.el-tag.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-input--medium { + font-size: 14px } -.el-tag.el-tag--danger { - background-color: #ffeded; - border-color: #ffdbdc; - color: #ff4d4f +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px } -.el-tag.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-input--medium .el-input__icon { + line-height: 36px } -.el-tag.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-input--small { + font-size: 13px } -.el-tag.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px } -.el-tag .el-icon-close { - border-radius: 50%; - text-align: center; - position: relative; - cursor: pointer; - font-size: 12px; - height: 16px; - width: 16px; - line-height: 16px; - vertical-align: middle; - top: -1px; - right: -5px +.el-input--small .el-input__icon { + line-height: 32px } -.el-tag .el-icon-close::before { - display: block +.el-input--mini { + font-size: 12px } -.el-tag--dark { - background-color: #006aff; - border-color: #006aff; - color: #fff +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px } -.el-tag--dark.is-hit { - border-color: #006aff +.el-input--mini .el-input__icon { + line-height: 28px } -.el-tag--dark .el-tag__close { - color: #fff +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0 } -.el-tag--dark .el-tag__close:hover { - color: #fff; - background-color: #38f +.el-input-group>.el-input__inner { + vertical-align: middle; + display: table-cell } -.el-tag--dark.el-tag--info { - background-color: #909399; - border-color: #909399; - color: #fff +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap } -.el-tag--dark.el-tag--info.is-hit { - border-color: #909399 +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0 } -.el-tag--dark.el-tag--info .el-tag__close { - color: #fff +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px } -.el-tag--dark.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #a6a9ad +.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-tag--dark.el-tag--success { - background-color: #0daf49; - border-color: #0daf49; - color: #fff +.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-tag--dark.el-tag--success.is-hit { - border-color: #0daf49 +.el-input-group__prepend { + border-right: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-tag--dark.el-tag--success .el-tag__close { - color: #fff +.el-input-group__append { + border-left: 0; + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-tag--dark.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #3dbf6d +.el-input-group--prepend .el-input__inner { + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-tag--dark.el-tag--warning { - background-color: #f08614; - border-color: #f08614; - color: #fff +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-tag--dark.el-tag--warning.is-hit { - border-color: #f08614 +.el-input-group--append .el-input__inner { + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-tag--dark.el-tag--warning .el-tag__close { - color: #fff +.el-input-group--append .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-tag--dark.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f39e43 +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0 } -.el-tag--dark.el-tag--danger { - background-color: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-input-number { + position: relative; + display: inline-block; + width: 180px; + line-height: 38px } -.el-tag--dark.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-input-number .el-input { + display: block } -.el-tag--dark.el-tag--danger .el-tag__close { - color: #fff +.el-input-number .el-input__inner { + -webkit-appearance: none; + padding-left: 50px; + padding-right: 50px; + text-align: center } -.el-tag--dark.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff7172 +.el-input-number__decrease, +.el-input-number__increase { + position: absolute; + z-index: 1; + top: 1px; + width: 40px; + height: auto; + text-align: center; + background: #f5f7fa; + color: #606266; + cursor: pointer; + font-size: 13px } -.el-tag--plain { - background-color: #fff; - border-color: #99c3ff; +.el-input-number__decrease:hover, +.el-input-number__increase:hover { color: #006aff } -.el-tag--plain.is-hit { +.el-input-number__decrease:hover:not(.is-disabled)~.el-input .el-input__inner:not(.is-disabled), +.el-input-number__increase:hover:not(.is-disabled)~.el-input .el-input__inner:not(.is-disabled) { border-color: #006aff } -.el-tag--plain .el-tag__close { - color: #006aff -} - -.el-tag--plain .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-input-number__decrease.is-disabled, +.el-input-number__increase.is-disabled { + color: #babdc2; + cursor: not-allowed } -.el-tag--plain.el-tag--info { - background-color: #fff; - border-color: #d3d4d6; - color: #909399 +.el-input-number__increase { + right: 1px; + border-radius: 0 4px 4px 0; + border-left: 1px solid #dfe2e6 } -.el-tag--plain.el-tag--info.is-hit { - border-color: #909399 +.el-input-number__decrease { + left: 1px; + border-radius: 4px 0 0 4px; + border-right: 1px solid #dfe2e6 } -.el-tag--plain.el-tag--info .el-tag__close { - color: #909399 +.el-input-number.is-disabled .el-input-number__decrease, +.el-input-number.is-disabled .el-input-number__increase { + border-color: #e4e7ed; + color: #e4e7ed } -.el-tag--plain.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-input-number.is-disabled .el-input-number__decrease:hover, +.el-input-number.is-disabled .el-input-number__increase:hover { + color: #e4e7ed; + cursor: not-allowed } -.el-tag--plain.el-tag--success { - background-color: #fff; - border-color: #9edfb6; - color: #0daf49 -} - -.el-tag--plain.el-tag--success.is-hit { - border-color: #0daf49 +.el-input-number--medium { + width: 200px; + line-height: 34px } -.el-tag--plain.el-tag--success .el-tag__close { - color: #0daf49 +.el-input-number--medium .el-input-number__decrease, +.el-input-number--medium .el-input-number__increase { + width: 36px; + font-size: 14px } -.el-tag--plain.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-input-number--medium .el-input__inner { + padding-left: 43px; + padding-right: 43px } -.el-tag--plain.el-tag--warning { - background-color: #fff; - border-color: #f9cfa1; - color: #f08614 +.el-input-number--small { + width: 130px; + line-height: 30px } -.el-tag--plain.el-tag--warning.is-hit { - border-color: #f08614 +.el-input-number--small .el-input-number__decrease, +.el-input-number--small .el-input-number__increase { + width: 32px; + font-size: 13px } -.el-tag--plain.el-tag--warning .el-tag__close { - color: #f08614 +.el-input-number--small .el-input-number__decrease [class*=el-icon], +.el-input-number--small .el-input-number__increase [class*=el-icon] { + -webkit-transform: scale(.9); + transform: scale(.9) } -.el-tag--plain.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-input-number--small .el-input__inner { + padding-left: 39px; + padding-right: 39px } -.el-tag--plain.el-tag--danger { - background-color: #fff; - border-color: #ffb8b9; - color: #ff4d4f +.el-input-number--mini { + width: 130px; + line-height: 26px } -.el-tag--plain.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-input-number--mini .el-input-number__decrease, +.el-input-number--mini .el-input-number__increase { + width: 28px; + font-size: 12px } -.el-tag--plain.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-input-number--mini .el-input-number__decrease [class*=el-icon], +.el-input-number--mini .el-input-number__increase [class*=el-icon] { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-tag--plain.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-input-number--mini .el-input__inner { + padding-left: 35px; + padding-right: 35px } -.el-tag--medium { - height: 28px; - line-height: 26px +.el-input-number.is-without-controls .el-input__inner { + padding-left: 15px; + padding-right: 15px } -.el-tag--medium .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-input-number.is-controls-right .el-input__inner { + padding-left: 15px; + padding-right: 50px } -.el-tag--small { - height: 24px; - padding: 0 8px; - line-height: 22px +.el-input-number.is-controls-right .el-input-number__decrease, +.el-input-number.is-controls-right .el-input-number__increase { + height: auto; + line-height: 19px } -.el-tag--small .el-icon-close { +.el-input-number.is-controls-right .el-input-number__decrease [class*=el-icon], +.el-input-number.is-controls-right .el-input-number__increase [class*=el-icon] { -webkit-transform: scale(.8); transform: scale(.8) } -.el-tag--mini { - height: 20px; - padding: 0 5px; - line-height: 19px +.el-input-number.is-controls-right .el-input-number__increase { + border-radius: 0 4px 0 0; + border-bottom: 1px solid #dfe2e6 } -.el-tag--mini .el-icon-close { - margin-left: -3px; - -webkit-transform: scale(.7); - transform: scale(.7) +.el-input-number.is-controls-right .el-input-number__decrease { + right: 1px; + bottom: 1px; + top: auto; + left: auto; + border-right: none; + border-left: 1px solid #dfe2e6; + border-radius: 0 0 4px 0 } -.fade-in-linear-enter-active, -.fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-input-number.is-controls-right[class*=medium] [class*=decrease], +.el-input-number.is-controls-right[class*=medium] [class*=increase] { + line-height: 17px } -.fade-in-linear-enter, -.fade-in-linear-leave, -.fade-in-linear-leave-active { - opacity: 0 +.el-input-number.is-controls-right[class*=small] [class*=decrease], +.el-input-number.is-controls-right[class*=small] [class*=increase] { + line-height: 15px } -.el-fade-in-linear-enter-active, -.el-fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-input-number.is-controls-right[class*=mini] [class*=decrease], +.el-input-number.is-controls-right[class*=mini] [class*=increase] { + line-height: 13px } -.el-fade-in-linear-enter, -.el-fade-in-linear-leave, -.el-fade-in-linear-leave-active { - opacity: 0 +.el-tooltip:focus:hover, +.el-tooltip:focus:not(.focusing) { + outline-width: 0 } -.el-fade-in-enter-active, -.el-fade-in-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-tooltip__popper { + position: absolute; + border-radius: 4px; + padding: 10px; + z-index: 2000; + font-size: 12px; + line-height: 1.2; + min-width: 10px; + word-wrap: break-word } -.el-fade-in-enter, -.el-fade-in-leave-active { - opacity: 0 +.el-tooltip__popper .popper__arrow, +.el-tooltip__popper .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-zoom-in-center-enter-active, -.el-zoom-in-center-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-tooltip__popper .popper__arrow { + border-width: 6px } -.el-zoom-in-center-enter, -.el-zoom-in-center-leave-active { - opacity: 0; - -webkit-transform: scaleX(0); - transform: scaleX(0) +.el-tooltip__popper .popper__arrow::after { + content: " "; + border-width: 5px } -.el-zoom-in-top-enter-active, -.el-zoom-in-top-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center top; - transform-origin: center top +.el-tooltip__popper[x-placement^=top] { + margin-bottom: 12px } -.el-zoom-in-top-enter, -.el-zoom-in-top-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-tooltip__popper[x-placement^=top] .popper__arrow { + bottom: -6px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-zoom-in-bottom-enter-active, -.el-zoom-in-bottom-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center bottom; - transform-origin: center bottom +.el-tooltip__popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -5px; + border-top-color: #1e2226; + border-bottom-width: 0 } -.el-zoom-in-bottom-enter, -.el-zoom-in-bottom-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-tooltip__popper[x-placement^=bottom] { + margin-top: 12px } -.el-zoom-in-left-enter-active, -.el-zoom-in-left-leave-active { - opacity: 1; - -webkit-transform: scale(1, 1); - transform: scale(1, 1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: top left; - transform-origin: top left +.el-tooltip__popper[x-placement^=bottom] .popper__arrow { + top: -6px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.el-zoom-in-left-enter, -.el-zoom-in-left-leave-active { - opacity: 0; - -webkit-transform: scale(.45, .45); - transform: scale(.45, .45) +.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -5px; + border-top-width: 0; + border-bottom-color: #1e2226 } -.collapse-transition { - -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; - transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out +.el-tooltip__popper[x-placement^=right] { + margin-left: 12px } -.horizontal-collapse-transition { - -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; - transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out -} - -.el-list-enter-active, -.el-list-leave-active { - -webkit-transition: all 1s; - transition: all 1s +.el-tooltip__popper[x-placement^=right] .popper__arrow { + left: -6px; + border-right-color: #1e2226; + border-left-width: 0 } -.el-list-enter, -.el-list-leave-active { - opacity: 0; - -webkit-transform: translateY(-30px); - transform: translateY(-30px) +.el-tooltip__popper[x-placement^=right] .popper__arrow::after { + bottom: -5px; + left: 1px; + border-right-color: #1e2226; + border-left-width: 0 } -.el-opacity-transition { - -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); - transition: opacity .3s cubic-bezier(.55, 0, .1, 1) +.el-tooltip__popper[x-placement^=left] { + margin-right: 12px } -.el-checkbox { - color: #606266; - font-weight: 500; - font-size: 14px; - position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - margin-right: 30px +.el-tooltip__popper[x-placement^=left] .popper__arrow { + right: -6px; + border-right-width: 0; + border-left-color: #1e2226 } -.el-checkbox.is-bordered { - padding: 9px 20px 9px 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - line-height: normal; - height: 40px +.el-tooltip__popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -5px; + margin-left: -5px; + border-right-width: 0; + border-left-color: #1e2226 } -.el-checkbox.is-bordered.is-checked { - border-color: #006aff +.el-tooltip__popper.is-dark { + background: #1e2226; + color: #fff } -.el-checkbox.is-bordered.is-disabled { - border-color: #ebeef5; - cursor: not-allowed +.el-tooltip__popper.is-light { + background: #fff; + border: 1px solid #1e2226 } -.el-checkbox.is-bordered+.el-checkbox.is-bordered { - margin-left: 10px +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { + border-top-color: #1e2226 } -.el-checkbox.is-bordered.el-checkbox--medium { - padding: 7px 20px 7px 10px; - border-radius: 4px; - height: 36px +.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { + border-top-color: #fff } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { - line-height: 17px; - font-size: 14px +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { + border-bottom-color: #1e2226 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { - height: 14px; - width: 14px +.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { + border-bottom-color: #fff } -.el-checkbox.is-bordered.el-checkbox--small { - padding: 5px 15px 5px 10px; - border-radius: 3px; - height: 32px +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { + border-left-color: #1e2226 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { - line-height: 15px; - font-size: 12px +.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { + border-left-color: #fff } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { - height: 12px; - width: 12px +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { + border-right-color: #1e2226 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { + border-right-color: #fff } -.el-checkbox.is-bordered.el-checkbox--mini { - padding: 3px 15px 3px 10px; - border-radius: 3px; - height: 28px +.el-slider::after, +.el-slider::before { + display: table; + content: "" } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { - line-height: 12px; - font-size: 12px +.el-slider::after { + clear: both } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { - height: 12px; - width: 12px +.el-slider__runway { + width: 100%; + height: 6px; + margin: 16px 0; + background-color: #e4e7ed; + border-radius: 3px; + position: relative; + cursor: pointer; + vertical-align: middle } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-slider__runway.show-input { + margin-right: 160px; + width: auto } -.el-checkbox__input { - white-space: nowrap; - cursor: pointer; - outline: 0; - display: inline-block; - line-height: 1; - position: relative; - vertical-align: middle +.el-slider__runway.disabled { + cursor: default } -.el-checkbox__input.is-disabled .el-checkbox__inner { - background-color: #edf2fc; - border-color: #dfe2e6; - cursor: not-allowed +.el-slider__runway.disabled .el-slider__bar { + background-color: #babdc2 } -.el-checkbox__input.is-disabled .el-checkbox__inner::after { - cursor: not-allowed; +.el-slider__runway.disabled .el-slider__button { border-color: #babdc2 } -.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { +.el-slider__runway.disabled .el-slider__button-wrapper.hover, +.el-slider__runway.disabled .el-slider__button-wrapper:hover { cursor: not-allowed } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 -} - -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { - border-color: #babdc2 +.el-slider__runway.disabled .el-slider__button-wrapper.dragging { + cursor: not-allowed } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-slider__runway.disabled .el-slider__button.dragging, +.el-slider__runway.disabled .el-slider__button.hover, +.el-slider__runway.disabled .el-slider__button:hover { + -webkit-transform: scale(1); + transform: scale(1) } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { - background-color: #babdc2; - border-color: #babdc2 +.el-slider__runway.disabled .el-slider__button.hover, +.el-slider__runway.disabled .el-slider__button:hover { + cursor: not-allowed } -.el-checkbox__input.is-disabled+span.el-checkbox__label { - color: #babdc2; +.el-slider__runway.disabled .el-slider__button.dragging { cursor: not-allowed } -.el-checkbox__input.is-checked .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-slider__input { + float: right; + margin-top: 3px; + width: 130px } -.el-checkbox__input.is-checked .el-checkbox__inner::after { - -webkit-transform: rotate(45deg) scaleY(1); - transform: rotate(45deg) scaleY(1) +.el-slider__input.el-input-number--mini { + margin-top: 5px } -.el-checkbox__input.is-checked+.el-checkbox__label { - color: #006aff +.el-slider__input.el-input-number--medium { + margin-top: 0 } -.el-checkbox__input.is-focus .el-checkbox__inner { - border-color: #006aff +.el-slider__input.el-input-number--large { + margin-top: -2px } -.el-checkbox__input.is-indeterminate .el-checkbox__inner { +.el-slider__bar { + height: 6px; background-color: #006aff; - border-color: #006aff + border-top-left-radius: 3px; + border-bottom-left-radius: 3px; + position: absolute } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { - content: ''; +.el-slider__button-wrapper { + height: 36px; + width: 36px; position: absolute; - display: block; - background-color: #fff; - height: 2px; - -webkit-transform: scale(.5); - transform: scale(.5); - left: 0; - right: 0; - top: 5px + z-index: 1001; + top: -15px; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + background-color: transparent; + text-align: center; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + line-height: normal } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { - display: none +.el-slider__button-wrapper::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-checkbox__inner { - display: inline-block; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 2px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 14px; - height: 14px; - background-color: #fff; - z-index: 1; - -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); - transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) +.el-slider__button-wrapper .el-tooltip { + vertical-align: middle; + display: inline-block } -.el-checkbox__inner:hover { - border-color: #006aff +.el-slider__button-wrapper.hover, +.el-slider__button-wrapper:hover { + cursor: -webkit-grab; + cursor: grab } -.el-checkbox__inner::after { - -webkit-box-sizing: content-box; - box-sizing: content-box; - content: ""; - border: 1px solid #fff; - border-left: 0; - border-top: 0; - height: 7px; - left: 4px; - position: absolute; - top: 1px; - -webkit-transform: rotate(45deg) scaleY(0); - transform: rotate(45deg) scaleY(0); - width: 3px; - -webkit-transition: -webkit-transform .15s ease-in .05s; - transition: -webkit-transform .15s ease-in .05s; - transition: transform .15s ease-in .05s; - transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; - -webkit-transform-origin: center; - transform-origin: center +.el-slider__button-wrapper.dragging { + cursor: -webkit-grabbing; + cursor: grabbing } -.el-checkbox__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - width: 0; - height: 0; - z-index: -1 +.el-slider__button { + width: 16px; + height: 16px; + border: solid 2px #006aff; + background-color: #fff; + border-radius: 50%; + -webkit-transition: .2s; + transition: .2s; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none } -.el-checkbox__label { - display: inline-block; - padding-left: 10px; - line-height: 19px; - font-size: 14px +.el-slider__button.dragging, +.el-slider__button.hover, +.el-slider__button:hover { + -webkit-transform: scale(1.2); + transform: scale(1.2) } -.el-checkbox:last-of-type { - margin-right: 0 +.el-slider__button.hover, +.el-slider__button:hover { + cursor: -webkit-grab; + cursor: grab } -.el-checkbox-button { - position: relative; - display: inline-block +.el-slider__button.dragging { + cursor: -webkit-grabbing; + cursor: grabbing } -.el-checkbox-button__inner { - display: inline-block; - line-height: 1; - font-weight: 500; - white-space: nowrap; - vertical-align: middle; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-left: 0; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - position: relative; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 0 +.el-slider__stop { + position: absolute; + height: 6px; + width: 6px; + border-radius: 100%; + background-color: #fff; + -webkit-transform: translateX(-50%); + transform: translateX(-50%) } -.el-checkbox-button__inner.is-round { - padding: 12px 20px +.el-slider__marks { + top: 0; + left: 12px; + width: 18px; + height: 100% } -.el-checkbox-button__inner:hover { - color: #006aff +.el-slider__marks-text { + position: absolute; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + font-size: 14px; + color: #909399; + margin-top: 15px } -.el-checkbox-button__inner [class*=el-icon-] { - line-height: .9 +.el-slider.is-vertical { + position: relative } -.el-checkbox-button__inner [class*=el-icon-]+span { - margin-left: 5px +.el-slider.is-vertical .el-slider__runway { + width: 6px; + height: 100%; + margin: 0 16px } -.el-checkbox-button__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - z-index: -1 +.el-slider.is-vertical .el-slider__bar { + width: 6px; + height: auto; + border-radius: 0 0 3px 3px } -.el-checkbox-button.is-checked .el-checkbox-button__inner { - color: #fff; - background-color: #006aff; - border-color: #006aff; - -webkit-box-shadow: -1px 0 0 0 #66a6ff; - box-shadow: -1px 0 0 0 #66a6ff +.el-slider.is-vertical .el-slider__button-wrapper { + top: auto; + left: -15px; + -webkit-transform: translateY(50%); + transform: translateY(50%) } -.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { - border-left-color: #006aff +.el-slider.is-vertical .el-slider__stop { + -webkit-transform: translateY(50%); + transform: translateY(50%) } -.el-checkbox-button.is-disabled .el-checkbox-button__inner { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5; - -webkit-box-shadow: none; - box-shadow: none +.el-slider.is-vertical.el-slider--with-input { + padding-bottom: 58px } -.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { - border-left-color: #ebeef5 +.el-slider.is-vertical.el-slider--with-input .el-slider__input { + overflow: visible; + float: none; + position: absolute; + bottom: 22px; + width: 36px; + margin-top: 15px } -.el-checkbox-button:first-child .el-checkbox-button__inner { - border-left: 1px solid #dfe2e6; - border-radius: 4px 0 0 4px; - -webkit-box-shadow: none !important; - box-shadow: none !important +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input__inner { + text-align: center; + padding-left: 5px; + padding-right: 5px } -.el-checkbox-button.is-focus .el-checkbox-button__inner { - border-color: #006aff +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease, +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase { + top: 32px; + margin-top: -1px; + border: 1px solid #dfe2e6; + line-height: 20px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-checkbox-button:last-child .el-checkbox-button__inner { - border-radius: 0 4px 4px 0 +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease { + width: 18px; + right: 18px; + border-bottom-left-radius: 4px } -.el-checkbox-button--medium .el-checkbox-button__inner { - padding: 10px 20px; - font-size: 14px; - border-radius: 0 +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase { + width: 19px; + border-bottom-right-radius: 4px } -.el-checkbox-button--medium .el-checkbox-button__inner.is-round { - padding: 10px 20px +.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase~.el-input .el-input__inner { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0 } -.el-checkbox-button--small .el-checkbox-button__inner { - padding: 9px 15px; - font-size: 12px; - border-radius: 0 +.el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__decrease, +.el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__increase { + border-color: #babdc2 } -.el-checkbox-button--small .el-checkbox-button__inner.is-round { - padding: 9px 15px +.el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__decrease, +.el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__increase { + border-color: #006aff } -.el-checkbox-button--mini .el-checkbox-button__inner { - padding: 7px 15px; - font-size: 12px; - border-radius: 0 +.el-slider.is-vertical .el-slider__marks-text { + margin-top: 0; + left: 15px; + -webkit-transform: translateY(50%); + transform: translateY(50%) } -.el-checkbox-button--mini .el-checkbox-button__inner.is-round { - padding: 7px 15px +.el-loading-parent--relative { + position: relative !important } -.el-checkbox-group { - font-size: 0 +.el-loading-parent--hidden { + overflow: hidden !important } -.el-tree { - position: relative; - cursor: default; - background: #fff; - color: #606266 -} - -.el-tree__empty-block { - position: relative; - min-height: 60px; - text-align: center; - width: 100%; - height: 100% -} - -.el-tree__empty-text { - position: absolute; - left: 50%; - top: 50%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); - color: #1e2226; - font-size: 14px -} - -.el-tree__drop-indicator { +.el-loading-mask { position: absolute; - left: 0; + z-index: 2000; + background-color: rgba(255, 255, 255, .9); + margin: 0; + top: 0; right: 0; - height: 1px; - background-color: #006aff + bottom: 0; + left: 0; + -webkit-transition: opacity .3s; + transition: opacity .3s } -.el-tree-node { - white-space: nowrap; - outline: 0 +.el-loading-mask.is-fullscreen { + position: fixed } -.el-tree-node:focus>.el-tree-node__content { - background-color: #f5f7fa +.el-loading-mask.is-fullscreen .el-loading-spinner { + margin-top: -25px } -.el-tree-node.is-drop-inner>.el-tree-node__content .el-tree-node__label { - background-color: #006aff; - color: #fff +.el-loading-mask.is-fullscreen .el-loading-spinner .circular { + height: 50px; + width: 50px } -.el-tree-node__content { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 26px; - cursor: pointer +.el-loading-spinner { + top: 50%; + margin-top: -21px; + width: 100%; + text-align: center; + position: absolute } -.el-tree-node__content>.el-tree-node__expand-icon { - padding: 6px +.el-loading-spinner .el-loading-text { + color: #006aff; + margin: 3px 0; + font-size: 14px } -.el-tree-node__content>label.el-checkbox { - margin-right: 8px +.el-loading-spinner .circular { + height: 42px; + width: 42px; + -webkit-animation: loading-rotate 2s linear infinite; + animation: loading-rotate 2s linear infinite } -.el-tree-node__content:hover { - background-color: #f5f7fa +.el-loading-spinner .path { + -webkit-animation: loading-dash 1.5s ease-in-out infinite; + animation: loading-dash 1.5s ease-in-out infinite; + stroke-dasharray: 90, 150; + stroke-dashoffset: 0; + stroke-width: 2; + stroke: #006AFF; + stroke-linecap: round } -.el-tree.is-dragging .el-tree-node__content { - cursor: move +.el-loading-spinner i { + color: #006aff } -.el-tree.is-dragging .el-tree-node__content * { - pointer-events: none +.el-loading-fade-enter, +.el-loading-fade-leave-active { + opacity: 0 } -.el-tree.is-dragging.is-drop-not-allow .el-tree-node__content { - cursor: not-allowed +@-webkit-keyframes loading-rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg) + } } -.el-tree-node__expand-icon { - cursor: pointer; - color: #babdc2; - font-size: 12px; - -webkit-transform: rotate(0); - transform: rotate(0); - -webkit-transition: -webkit-transform .3s ease-in-out; - transition: -webkit-transform .3s ease-in-out; - transition: transform .3s ease-in-out; - transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out +@keyframes loading-rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg) + } } -.el-tree-node__expand-icon.expanded { - -webkit-transform: rotate(90deg); - transform: rotate(90deg) -} +@-webkit-keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0 + } -.el-tree-node__expand-icon.is-leaf { - color: transparent; - cursor: default -} + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px + } -.el-tree-node__label { - font-size: 14px + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px + } } -.el-tree-node__loading-icon { - margin-right: 8px; - font-size: 14px; - color: #babdc2 -} +@keyframes loading-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0 + } -.el-tree-node>.el-tree-node__children { - overflow: hidden; - background-color: transparent -} + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -40px + } -.el-tree-node.is-expanded>.el-tree-node__children { - display: block + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -120px + } } -.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { - background-color: #ebf3ff +.el-row { + position: relative; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-alert { - width: 100%; - padding: 8px 16px; - margin: 0; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-radius: 4px; - position: relative; - background-color: #fff; - overflow: hidden; - opacity: 1; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-transition: opacity .2s; - transition: opacity .2s +.el-row::after, +.el-row::before { + display: table; + content: "" } -.el-alert.is-light .el-alert__closebtn { - color: #babdc2 +.el-row::after { + clear: both } -.el-alert.is-dark .el-alert__closebtn { - color: #fff +.el-row--flex { + display: -webkit-box; + display: -ms-flexbox; + display: flex } -.el-alert.is-dark .el-alert__description { - color: #fff +.el-row--flex:after, +.el-row--flex:before { + display: none } -.el-alert.is-center { +.el-row--flex.is-justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } -.el-alert--success.is-light { - background-color: #e7f7ed; - color: #0daf49 -} - -.el-alert--success.is-light .el-alert__description { - color: #0daf49 +.el-row--flex.is-justify-end { + -webkit-box-pack: end; + -ms-flex-pack: end; + justify-content: flex-end } -.el-alert--success.is-dark { - background-color: #0daf49; - color: #fff +.el-row--flex.is-justify-space-between { + -webkit-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between } -.el-alert--info.is-light { - background-color: #f4f4f5; - color: #909399 +.el-row--flex.is-justify-space-around { + -ms-flex-pack: distribute; + justify-content: space-around } -.el-alert--info.is-dark { - background-color: #909399; - color: #fff +.el-row--flex.is-align-top { + -webkit-box-align: start; + -ms-flex-align: start; + align-items: flex-start } -.el-alert--info .el-alert__description { - color: #909399 +.el-row--flex.is-align-middle { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-alert--warning.is-light { - background-color: #fef3e8; - color: #f08614 +.el-row--flex.is-align-bottom { + -webkit-box-align: end; + -ms-flex-align: end; + align-items: flex-end } -.el-alert--warning.is-light .el-alert__description { - color: #f08614 +[class*=el-col-] { + float: left; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-alert--warning.is-dark { - background-color: #f08614; - color: #fff +.el-col-0 { + display: none } -.el-alert--error.is-light { - background-color: #ffeded; - color: #ff4d4f +.el-col-0 { + width: 0% } -.el-alert--error.is-light .el-alert__description { - color: #ff4d4f +.el-col-offset-0 { + margin-left: 0 } -.el-alert--error.is-dark { - background-color: #ff4d4f; - color: #fff +.el-col-pull-0 { + position: relative; + right: 0 } -.el-alert__content { - display: table-cell; - padding: 0 8px +.el-col-push-0 { + position: relative; + left: 0 } -.el-alert__icon { - font-size: 16px; - width: 16px +.el-col-1 { + width: 4.16667% } -.el-alert__icon.is-big { - font-size: 28px; - width: 28px +.el-col-offset-1 { + margin-left: 4.16667% } -.el-alert__title { - font-size: 13px; - line-height: 18px +.el-col-pull-1 { + position: relative; + right: 4.16667% } -.el-alert__title.is-bold { - font-weight: 700 +.el-col-push-1 { + position: relative; + left: 4.16667% } -.el-alert .el-alert__description { - font-size: 12px; - margin: 5px 0 0 0 +.el-col-2 { + width: 8.33333% } -.el-alert__closebtn { - font-size: 12px; - opacity: 1; - position: absolute; - top: 12px; - right: 15px; - cursor: pointer +.el-col-offset-2 { + margin-left: 8.33333% } -.el-alert__closebtn.is-customed { - font-style: normal; - font-size: 13px; - top: 9px +.el-col-pull-2 { + position: relative; + right: 8.33333% } -.el-alert-fade-enter, -.el-alert-fade-leave-active { - opacity: 0 +.el-col-push-2 { + position: relative; + left: 8.33333% } -.el-notification { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - width: 330px; - padding: 14px 26px 14px 13px; - border-radius: 8px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border: 1px solid #ebeef5; - position: fixed; - background-color: #fff; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - -webkit-transition: opacity .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; - transition: opacity .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; - transition: opacity .3s, transform .3s, left .3s, right .3s, top .4s, bottom .3s; - transition: opacity .3s, transform .3s, left .3s, right .3s, top .4s, bottom .3s, -webkit-transform .3s; - overflow: hidden +.el-col-3 { + width: 12.5% } -.el-notification.right { - right: 16px +.el-col-offset-3 { + margin-left: 12.5% } -.el-notification.left { - left: 16px +.el-col-pull-3 { + position: relative; + right: 12.5% } -.el-notification__group { - margin-left: 13px; - margin-right: 8px +.el-col-push-3 { + position: relative; + left: 12.5% } -.el-notification__title { - font-weight: 700; - font-size: 16px; - color: #1e2226; - margin: 0 +.el-col-4 { + width: 16.66667% } -.el-notification__content { - font-size: 14px; - line-height: 21px; - margin: 6px 0 0 0; - color: #606266; - text-align: justify +.el-col-offset-4 { + margin-left: 16.66667% } -.el-notification__content p { - margin: 0 +.el-col-pull-4 { + position: relative; + right: 16.66667% } -.el-notification__icon { - height: 24px; - width: 24px; - font-size: 24px +.el-col-push-4 { + position: relative; + left: 16.66667% } -.el-notification__closeBtn { - position: absolute; - top: 18px; - right: 15px; - cursor: pointer; - color: #1e2226; - font-size: 16px +.el-col-5 { + width: 20.83333% } -.el-notification__closeBtn:hover { - color: #606266 +.el-col-offset-5 { + margin-left: 20.83333% } -.el-notification .el-icon-success { - color: #0daf49 +.el-col-pull-5 { + position: relative; + right: 20.83333% } -.el-notification .el-icon-error { - color: #ff4d4f +.el-col-push-5 { + position: relative; + left: 20.83333% } -.el-notification .el-icon-info { - color: #909399 +.el-col-6 { + width: 25% } -.el-notification .el-icon-warning { - color: #f08614 +.el-col-offset-6 { + margin-left: 25% } -.el-notification-fade-enter.right { - right: 0; - -webkit-transform: translateX(100%); - transform: translateX(100%) +.el-col-pull-6 { + position: relative; + right: 25% } -.el-notification-fade-enter.left { - left: 0; - -webkit-transform: translateX(-100%); - transform: translateX(-100%) +.el-col-push-6 { + position: relative; + left: 25% } -.el-notification-fade-leave-active { - opacity: 0 +.el-col-7 { + width: 29.16667% } -.el-textarea { - position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px +.el-col-offset-7 { + margin-left: 29.16667% } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; - border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) +.el-col-pull-7 { + position: relative; + right: 29.16667% } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-col-push-7 { + position: relative; + left: 29.16667% } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-col-8 { + width: 33.33333% } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-col-offset-8 { + margin-left: 33.33333% } -.el-textarea__inner::placeholder { - color: #babdc2 +.el-col-pull-8 { + position: relative; + right: 33.33333% } -.el-textarea__inner:hover { - border-color: #babdc2 +.el-col-push-8 { + position: relative; + left: 33.33333% } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff +.el-col-9 { + width: 37.5% } -.el-textarea .el-input__count { - color: #909399; - background: #fff; - position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px +.el-col-offset-9 { + margin-left: 37.5% } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-col-pull-9 { + position: relative; + right: 37.5% } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-col-push-9 { + position: relative; + left: 37.5% } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-col-10 { + width: 41.66667% } -.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-col-offset-10 { + margin-left: 41.66667% } -.el-textarea.is-disabled .el-textarea__inner::placeholder { - color: #babdc2 +.el-col-pull-10 { + position: relative; + right: 41.66667% } -.el-textarea.is-exceed .el-textarea__inner { - border-color: #ff4d4f +.el-col-push-10 { + position: relative; + left: 41.66667% } -.el-textarea.is-exceed .el-input__count { - color: #ff4d4f +.el-col-11 { + width: 45.83333% } -.el-input { - position: relative; - font-size: 14px; - display: inline-block; - width: 100% +.el-col-offset-11 { + margin-left: 45.83333% } -.el-input::-webkit-scrollbar { - z-index: 11; - width: 6px +.el-col-pull-11 { + position: relative; + right: 45.83333% } -.el-input::-webkit-scrollbar:horizontal { - height: 6px +.el-col-push-11 { + position: relative; + left: 45.83333% } -.el-input::-webkit-scrollbar-thumb { - border-radius: 5px; - width: 6px; - background: #b4bccc +.el-col-12 { + width: 50% } -.el-input::-webkit-scrollbar-corner { - background: #fff +.el-col-offset-12 { + margin-left: 50% } -.el-input::-webkit-scrollbar-track { - background: #fff +.el-col-pull-12 { + position: relative; + right: 50% } -.el-input::-webkit-scrollbar-track-piece { - background: #fff; - width: 6px +.el-col-push-12 { + position: relative; + left: 50% } -.el-input .el-input__clear { - color: #babdc2; - font-size: 14px; - cursor: pointer; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1) +.el-col-13 { + width: 54.16667% } -.el-input .el-input__clear:hover { - color: #1e2226 +.el-col-offset-13 { + margin-left: 54.16667% } -.el-input .el-input__count { - height: 100%; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - color: #909399; - font-size: 12px +.el-col-pull-13 { + position: relative; + right: 54.16667% } -.el-input .el-input__count .el-input__count-inner { - background: #fff; - line-height: initial; - display: inline-block; - padding: 0 5px +.el-col-push-13 { + position: relative; + left: 54.16667% } -.el-input__inner { - -webkit-appearance: none; - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - display: inline-block; - font-size: inherit; - height: 40px; - line-height: 40px; - outline: 0; - padding: 0 15px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - width: 100% +.el-col-14 { + width: 58.33333% } -.el-input__inner::-ms-reveal { - display: none +.el-col-offset-14 { + margin-left: 58.33333% } -.el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-col-pull-14 { + position: relative; + right: 58.33333% } -.el-input__inner::-moz-placeholder { - color: #babdc2 +.el-col-push-14 { + position: relative; + left: 58.33333% } -.el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-col-15 { + width: 62.5% } -.el-input__inner::placeholder { - color: #babdc2 +.el-col-offset-15 { + margin-left: 62.5% } -.el-input__inner:hover { - border-color: #babdc2 +.el-col-pull-15 { + position: relative; + right: 62.5% } -.el-input__inner:focus { - outline: 0; - border-color: #006aff +.el-col-push-15 { + position: relative; + left: 62.5% } -.el-input__suffix { - position: absolute; - height: 100%; - right: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s; - pointer-events: none +.el-col-16 { + width: 66.66667% } -.el-input__suffix-inner { - pointer-events: all +.el-col-offset-16 { + margin-left: 66.66667% } -.el-input__prefix { - position: absolute; - height: 100%; - left: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s +.el-col-pull-16 { + position: relative; + right: 66.66667% } -.el-input__icon { - height: 100%; - width: 25px; - text-align: center; - -webkit-transition: all .3s; - transition: all .3s; - line-height: 40px +.el-col-push-16 { + position: relative; + left: 66.66667% } -.el-input__icon:after { - content: ''; - height: 100%; - width: 0; - display: inline-block; - vertical-align: middle +.el-col-17 { + width: 70.83333% } -.el-input__validateIcon { - pointer-events: none +.el-col-offset-17 { + margin-left: 70.83333% } -.el-input.is-active .el-input__inner { - outline: 0; - border-color: #006aff +.el-col-pull-17 { + position: relative; + right: 70.83333% } -.el-input.is-disabled .el-input__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-col-push-17 { + position: relative; + left: 70.83333% } -.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-col-18 { + width: 75% } -.el-input.is-disabled .el-input__inner::-moz-placeholder { - color: #babdc2 +.el-col-offset-18 { + margin-left: 75% } -.el-input.is-disabled .el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-col-pull-18 { + position: relative; + right: 75% } -.el-input.is-disabled .el-input__inner::placeholder { - color: #babdc2 +.el-col-push-18 { + position: relative; + left: 75% } -.el-input.is-disabled .el-input__icon { - cursor: not-allowed +.el-col-19 { + width: 79.16667% } -.el-input.is-exceed .el-input__inner { - border-color: #ff4d4f +.el-col-offset-19 { + margin-left: 79.16667% } -.el-input.is-exceed .el-input__suffix .el-input__count { - color: #ff4d4f +.el-col-pull-19 { + position: relative; + right: 79.16667% } -.el-input--suffix .el-input__inner { - padding-right: 30px -} - -.el-input--prefix .el-input__inner { - padding-left: 30px -} - -.el-input--medium { - font-size: 14px +.el-col-push-19 { + position: relative; + left: 79.16667% } -.el-input--medium .el-input__inner { - height: 36px; - line-height: 36px +.el-col-20 { + width: 83.33333% } -.el-input--medium .el-input__icon { - line-height: 36px +.el-col-offset-20 { + margin-left: 83.33333% } -.el-input--small { - font-size: 13px +.el-col-pull-20 { + position: relative; + right: 83.33333% } -.el-input--small .el-input__inner { - height: 32px; - line-height: 32px +.el-col-push-20 { + position: relative; + left: 83.33333% } -.el-input--small .el-input__icon { - line-height: 32px +.el-col-21 { + width: 87.5% } -.el-input--mini { - font-size: 12px +.el-col-offset-21 { + margin-left: 87.5% } -.el-input--mini .el-input__inner { - height: 28px; - line-height: 28px +.el-col-pull-21 { + position: relative; + right: 87.5% } -.el-input--mini .el-input__icon { - line-height: 28px +.el-col-push-21 { + position: relative; + left: 87.5% } -.el-input-group { - line-height: normal; - display: inline-table; - width: 100%; - border-collapse: separate; - border-spacing: 0 +.el-col-22 { + width: 91.66667% } -.el-input-group>.el-input__inner { - vertical-align: middle; - display: table-cell +.el-col-offset-22 { + margin-left: 91.66667% } -.el-input-group__append, -.el-input-group__prepend { - background-color: #f5f7fa; - color: #909399; - vertical-align: middle; - display: table-cell; +.el-col-pull-22 { position: relative; - border: 1px solid #dfe2e6; - border-radius: 4px; - padding: 0 20px; - width: 1px; - white-space: nowrap + right: 91.66667% } -.el-input-group__append:focus, -.el-input-group__prepend:focus { - outline: 0 +.el-col-push-22 { + position: relative; + left: 91.66667% } -.el-input-group__append .el-button, -.el-input-group__append .el-select, -.el-input-group__prepend .el-button, -.el-input-group__prepend .el-select { - display: inline-block; - margin: -10px -20px +.el-col-23 { + width: 95.83333% } -.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-col-offset-23 { + margin-left: 95.83333% } -.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-col-pull-23 { + position: relative; + right: 95.83333% } -.el-input-group__prepend { - border-right: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-col-push-23 { + position: relative; + left: 95.83333% } -.el-input-group__append { - border-left: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-col-24 { + width: 100% } -.el-input-group--prepend .el-input__inner { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-col-offset-24 { + margin-left: 100% } -.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-col-pull-24 { + position: relative; + right: 100% } -.el-input-group--append .el-input__inner { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-col-push-24 { + position: relative; + left: 100% } -.el-input-group--append .el-select .el-input.is-focus .el-input__inner { - border-color: transparent -} +@media only screen and (max-width:767px) { + .el-col-xs-0 { + display: none + } -.el-input__inner::-ms-clear { - display: none; - width: 0; - height: 0 -} + .el-col-xs-0 { + width: 0% + } -.el-input-number { - position: relative; - display: inline-block; - width: 180px; - line-height: 38px -} + .el-col-xs-offset-0 { + margin-left: 0 + } -.el-input-number .el-input { - display: block -} + .el-col-xs-pull-0 { + position: relative; + right: 0 + } -.el-input-number .el-input__inner { - -webkit-appearance: none; - padding-left: 50px; - padding-right: 50px; - text-align: center -} + .el-col-xs-push-0 { + position: relative; + left: 0 + } -.el-input-number__decrease, -.el-input-number__increase { - position: absolute; - z-index: 1; - top: 1px; - width: 40px; - height: auto; - text-align: center; - background: #f5f7fa; - color: #606266; - cursor: pointer; - font-size: 13px -} + .el-col-xs-1 { + width: 4.16667% + } -.el-input-number__decrease:hover, -.el-input-number__increase:hover { - color: #006aff -} + .el-col-xs-offset-1 { + margin-left: 4.16667% + } -.el-input-number__decrease:hover:not(.is-disabled)~.el-input .el-input__inner:not(.is-disabled), -.el-input-number__increase:hover:not(.is-disabled)~.el-input .el-input__inner:not(.is-disabled) { - border-color: #006aff -} + .el-col-xs-pull-1 { + position: relative; + right: 4.16667% + } -.el-input-number__decrease.is-disabled, -.el-input-number__increase.is-disabled { - color: #babdc2; - cursor: not-allowed -} + .el-col-xs-push-1 { + position: relative; + left: 4.16667% + } -.el-input-number__increase { - right: 1px; - border-radius: 0 4px 4px 0; - border-left: 1px solid #dfe2e6 -} + .el-col-xs-2 { + width: 8.33333% + } -.el-input-number__decrease { - left: 1px; - border-radius: 4px 0 0 4px; - border-right: 1px solid #dfe2e6 -} + .el-col-xs-offset-2 { + margin-left: 8.33333% + } -.el-input-number.is-disabled .el-input-number__decrease, -.el-input-number.is-disabled .el-input-number__increase { - border-color: #e4e7ed; - color: #e4e7ed -} + .el-col-xs-pull-2 { + position: relative; + right: 8.33333% + } -.el-input-number.is-disabled .el-input-number__decrease:hover, -.el-input-number.is-disabled .el-input-number__increase:hover { - color: #e4e7ed; - cursor: not-allowed -} + .el-col-xs-push-2 { + position: relative; + left: 8.33333% + } -.el-input-number--medium { - width: 200px; - line-height: 34px -} - -.el-input-number--medium .el-input-number__decrease, -.el-input-number--medium .el-input-number__increase { - width: 36px; - font-size: 14px -} + .el-col-xs-3 { + width: 12.5% + } -.el-input-number--medium .el-input__inner { - padding-left: 43px; - padding-right: 43px -} + .el-col-xs-offset-3 { + margin-left: 12.5% + } -.el-input-number--small { - width: 130px; - line-height: 30px -} + .el-col-xs-pull-3 { + position: relative; + right: 12.5% + } -.el-input-number--small .el-input-number__decrease, -.el-input-number--small .el-input-number__increase { - width: 32px; - font-size: 13px -} + .el-col-xs-push-3 { + position: relative; + left: 12.5% + } -.el-input-number--small .el-input-number__decrease [class*=el-icon], -.el-input-number--small .el-input-number__increase [class*=el-icon] { - -webkit-transform: scale(.9); - transform: scale(.9) -} + .el-col-xs-4 { + width: 16.66667% + } -.el-input-number--small .el-input__inner { - padding-left: 39px; - padding-right: 39px -} + .el-col-xs-offset-4 { + margin-left: 16.66667% + } -.el-input-number--mini { - width: 130px; - line-height: 26px -} + .el-col-xs-pull-4 { + position: relative; + right: 16.66667% + } -.el-input-number--mini .el-input-number__decrease, -.el-input-number--mini .el-input-number__increase { - width: 28px; - font-size: 12px -} + .el-col-xs-push-4 { + position: relative; + left: 16.66667% + } -.el-input-number--mini .el-input-number__decrease [class*=el-icon], -.el-input-number--mini .el-input-number__increase [class*=el-icon] { - -webkit-transform: scale(.8); - transform: scale(.8) -} + .el-col-xs-5 { + width: 20.83333% + } -.el-input-number--mini .el-input__inner { - padding-left: 35px; - padding-right: 35px -} + .el-col-xs-offset-5 { + margin-left: 20.83333% + } -.el-input-number.is-without-controls .el-input__inner { - padding-left: 15px; - padding-right: 15px -} + .el-col-xs-pull-5 { + position: relative; + right: 20.83333% + } -.el-input-number.is-controls-right .el-input__inner { - padding-left: 15px; - padding-right: 50px -} + .el-col-xs-push-5 { + position: relative; + left: 20.83333% + } -.el-input-number.is-controls-right .el-input-number__decrease, -.el-input-number.is-controls-right .el-input-number__increase { - height: auto; - line-height: 19px -} + .el-col-xs-6 { + width: 25% + } -.el-input-number.is-controls-right .el-input-number__decrease [class*=el-icon], -.el-input-number.is-controls-right .el-input-number__increase [class*=el-icon] { - -webkit-transform: scale(.8); - transform: scale(.8) -} + .el-col-xs-offset-6 { + margin-left: 25% + } -.el-input-number.is-controls-right .el-input-number__increase { - border-radius: 0 4px 0 0; - border-bottom: 1px solid #dfe2e6 -} + .el-col-xs-pull-6 { + position: relative; + right: 25% + } -.el-input-number.is-controls-right .el-input-number__decrease { - right: 1px; - bottom: 1px; - top: auto; - left: auto; - border-right: none; - border-left: 1px solid #dfe2e6; - border-radius: 0 0 4px 0 -} + .el-col-xs-push-6 { + position: relative; + left: 25% + } -.el-input-number.is-controls-right[class*=medium] [class*=decrease], -.el-input-number.is-controls-right[class*=medium] [class*=increase] { - line-height: 17px -} + .el-col-xs-7 { + width: 29.16667% + } -.el-input-number.is-controls-right[class*=small] [class*=decrease], -.el-input-number.is-controls-right[class*=small] [class*=increase] { - line-height: 15px -} + .el-col-xs-offset-7 { + margin-left: 29.16667% + } -.el-input-number.is-controls-right[class*=mini] [class*=decrease], -.el-input-number.is-controls-right[class*=mini] [class*=increase] { - line-height: 13px -} + .el-col-xs-pull-7 { + position: relative; + right: 29.16667% + } -.el-tooltip:focus:hover, -.el-tooltip:focus:not(.focusing) { - outline-width: 0 -} + .el-col-xs-push-7 { + position: relative; + left: 29.16667% + } -.el-tooltip__popper { - position: absolute; - border-radius: 4px; - padding: 10px; - z-index: 2000; - font-size: 12px; - line-height: 1.2; - min-width: 10px; - word-wrap: break-word -} + .el-col-xs-8 { + width: 33.33333% + } -.el-tooltip__popper .popper__arrow, -.el-tooltip__popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid -} + .el-col-xs-offset-8 { + margin-left: 33.33333% + } -.el-tooltip__popper .popper__arrow { - border-width: 6px -} + .el-col-xs-pull-8 { + position: relative; + right: 33.33333% + } -.el-tooltip__popper .popper__arrow::after { - content: " "; - border-width: 5px -} + .el-col-xs-push-8 { + position: relative; + left: 33.33333% + } -.el-tooltip__popper[x-placement^=top] { - margin-bottom: 12px -} + .el-col-xs-9 { + width: 37.5% + } -.el-tooltip__popper[x-placement^=top] .popper__arrow { - bottom: -6px; - border-top-color: #1e2226; - border-bottom-width: 0 -} + .el-col-xs-offset-9 { + margin-left: 37.5% + } -.el-tooltip__popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -5px; - border-top-color: #1e2226; - border-bottom-width: 0 -} + .el-col-xs-pull-9 { + position: relative; + right: 37.5% + } -.el-tooltip__popper[x-placement^=bottom] { - margin-top: 12px -} + .el-col-xs-push-9 { + position: relative; + left: 37.5% + } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow { - top: -6px; - border-top-width: 0; - border-bottom-color: #1e2226 -} + .el-col-xs-10 { + width: 41.66667% + } -.el-tooltip__popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -5px; - border-top-width: 0; - border-bottom-color: #1e2226 -} + .el-col-xs-offset-10 { + margin-left: 41.66667% + } -.el-tooltip__popper[x-placement^=right] { - margin-left: 12px -} + .el-col-xs-pull-10 { + position: relative; + right: 41.66667% + } -.el-tooltip__popper[x-placement^=right] .popper__arrow { - left: -6px; - border-right-color: #1e2226; - border-left-width: 0 -} + .el-col-xs-push-10 { + position: relative; + left: 41.66667% + } -.el-tooltip__popper[x-placement^=right] .popper__arrow::after { - bottom: -5px; - left: 1px; - border-right-color: #1e2226; - border-left-width: 0 -} + .el-col-xs-11 { + width: 45.83333% + } -.el-tooltip__popper[x-placement^=left] { - margin-right: 12px -} + .el-col-xs-offset-11 { + margin-left: 45.83333% + } -.el-tooltip__popper[x-placement^=left] .popper__arrow { - right: -6px; - border-right-width: 0; - border-left-color: #1e2226 -} + .el-col-xs-pull-11 { + position: relative; + right: 45.83333% + } -.el-tooltip__popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -5px; - margin-left: -5px; - border-right-width: 0; - border-left-color: #1e2226 -} + .el-col-xs-push-11 { + position: relative; + left: 45.83333% + } -.el-tooltip__popper.is-dark { - background: #1e2226; - color: #fff -} + .el-col-xs-12 { + width: 50% + } -.el-tooltip__popper.is-light { - background: #fff; - border: 1px solid #1e2226 -} + .el-col-xs-offset-12 { + margin-left: 50% + } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow { - border-top-color: #1e2226 -} + .el-col-xs-pull-12 { + position: relative; + right: 50% + } -.el-tooltip__popper.is-light[x-placement^=top] .popper__arrow::after { - border-top-color: #fff -} + .el-col-xs-push-12 { + position: relative; + left: 50% + } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow { - border-bottom-color: #1e2226 -} + .el-col-xs-13 { + width: 54.16667% + } -.el-tooltip__popper.is-light[x-placement^=bottom] .popper__arrow::after { - border-bottom-color: #fff -} + .el-col-xs-offset-13 { + margin-left: 54.16667% + } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow { - border-left-color: #1e2226 -} + .el-col-xs-pull-13 { + position: relative; + right: 54.16667% + } -.el-tooltip__popper.is-light[x-placement^=left] .popper__arrow::after { - border-left-color: #fff -} + .el-col-xs-push-13 { + position: relative; + left: 54.16667% + } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow { - border-right-color: #1e2226 -} + .el-col-xs-14 { + width: 58.33333% + } -.el-tooltip__popper.is-light[x-placement^=right] .popper__arrow::after { - border-right-color: #fff -} + .el-col-xs-offset-14 { + margin-left: 58.33333% + } -.el-slider::after, -.el-slider::before { - display: table; - content: "" -} + .el-col-xs-pull-14 { + position: relative; + right: 58.33333% + } -.el-slider::after { - clear: both -} + .el-col-xs-push-14 { + position: relative; + left: 58.33333% + } -.el-slider__runway { - width: 100%; - height: 6px; - margin: 16px 0; - background-color: #e4e7ed; - border-radius: 3px; - position: relative; - cursor: pointer; - vertical-align: middle -} + .el-col-xs-15 { + width: 62.5% + } -.el-slider__runway.show-input { - margin-right: 160px; - width: auto -} + .el-col-xs-offset-15 { + margin-left: 62.5% + } -.el-slider__runway.disabled { - cursor: default -} + .el-col-xs-pull-15 { + position: relative; + right: 62.5% + } -.el-slider__runway.disabled .el-slider__bar { - background-color: #babdc2 -} + .el-col-xs-push-15 { + position: relative; + left: 62.5% + } -.el-slider__runway.disabled .el-slider__button { - border-color: #babdc2 -} + .el-col-xs-16 { + width: 66.66667% + } -.el-slider__runway.disabled .el-slider__button-wrapper.hover, -.el-slider__runway.disabled .el-slider__button-wrapper:hover { - cursor: not-allowed -} + .el-col-xs-offset-16 { + margin-left: 66.66667% + } -.el-slider__runway.disabled .el-slider__button-wrapper.dragging { - cursor: not-allowed -} + .el-col-xs-pull-16 { + position: relative; + right: 66.66667% + } -.el-slider__runway.disabled .el-slider__button.dragging, -.el-slider__runway.disabled .el-slider__button.hover, -.el-slider__runway.disabled .el-slider__button:hover { - -webkit-transform: scale(1); - transform: scale(1) -} + .el-col-xs-push-16 { + position: relative; + left: 66.66667% + } -.el-slider__runway.disabled .el-slider__button.hover, -.el-slider__runway.disabled .el-slider__button:hover { - cursor: not-allowed -} + .el-col-xs-17 { + width: 70.83333% + } -.el-slider__runway.disabled .el-slider__button.dragging { - cursor: not-allowed -} + .el-col-xs-offset-17 { + margin-left: 70.83333% + } -.el-slider__input { - float: right; - margin-top: 3px; - width: 130px -} + .el-col-xs-pull-17 { + position: relative; + right: 70.83333% + } -.el-slider__input.el-input-number--mini { - margin-top: 5px -} + .el-col-xs-push-17 { + position: relative; + left: 70.83333% + } -.el-slider__input.el-input-number--medium { - margin-top: 0 -} + .el-col-xs-18 { + width: 75% + } -.el-slider__input.el-input-number--large { - margin-top: -2px -} + .el-col-xs-offset-18 { + margin-left: 75% + } -.el-slider__bar { - height: 6px; - background-color: #006aff; - border-top-left-radius: 3px; - border-bottom-left-radius: 3px; - position: absolute -} + .el-col-xs-pull-18 { + position: relative; + right: 75% + } -.el-slider__button-wrapper { - height: 36px; - width: 36px; - position: absolute; - z-index: 1001; - top: -15px; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - background-color: transparent; - text-align: center; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - line-height: normal -} + .el-col-xs-push-18 { + position: relative; + left: 75% + } -.el-slider__button-wrapper::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle -} + .el-col-xs-19 { + width: 79.16667% + } -.el-slider__button-wrapper .el-tooltip { - vertical-align: middle; - display: inline-block -} + .el-col-xs-offset-19 { + margin-left: 79.16667% + } -.el-slider__button-wrapper.hover, -.el-slider__button-wrapper:hover { - cursor: -webkit-grab; - cursor: grab -} + .el-col-xs-pull-19 { + position: relative; + right: 79.16667% + } -.el-slider__button-wrapper.dragging { - cursor: -webkit-grabbing; - cursor: grabbing -} + .el-col-xs-push-19 { + position: relative; + left: 79.16667% + } -.el-slider__button { - width: 16px; - height: 16px; - border: solid 2px #006aff; - background-color: #fff; - border-radius: 50%; - -webkit-transition: .2s; - transition: .2s; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none -} + .el-col-xs-20 { + width: 83.33333% + } -.el-slider__button.dragging, -.el-slider__button.hover, -.el-slider__button:hover { - -webkit-transform: scale(1.2); - transform: scale(1.2) -} + .el-col-xs-offset-20 { + margin-left: 83.33333% + } -.el-slider__button.hover, -.el-slider__button:hover { - cursor: -webkit-grab; - cursor: grab -} + .el-col-xs-pull-20 { + position: relative; + right: 83.33333% + } -.el-slider__button.dragging { - cursor: -webkit-grabbing; - cursor: grabbing -} + .el-col-xs-push-20 { + position: relative; + left: 83.33333% + } -.el-slider__stop { - position: absolute; - height: 6px; - width: 6px; - border-radius: 100%; - background-color: #fff; - -webkit-transform: translateX(-50%); - transform: translateX(-50%) -} + .el-col-xs-21 { + width: 87.5% + } -.el-slider__marks { - top: 0; - left: 12px; - width: 18px; - height: 100% -} + .el-col-xs-offset-21 { + margin-left: 87.5% + } -.el-slider__marks-text { - position: absolute; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - font-size: 14px; - color: #909399; - margin-top: 15px -} + .el-col-xs-pull-21 { + position: relative; + right: 87.5% + } -.el-slider.is-vertical { - position: relative -} + .el-col-xs-push-21 { + position: relative; + left: 87.5% + } -.el-slider.is-vertical .el-slider__runway { - width: 6px; - height: 100%; - margin: 0 16px -} + .el-col-xs-22 { + width: 91.66667% + } -.el-slider.is-vertical .el-slider__bar { - width: 6px; - height: auto; - border-radius: 0 0 3px 3px -} + .el-col-xs-offset-22 { + margin-left: 91.66667% + } -.el-slider.is-vertical .el-slider__button-wrapper { - top: auto; - left: -15px; - -webkit-transform: translateY(50%); - transform: translateY(50%) -} + .el-col-xs-pull-22 { + position: relative; + right: 91.66667% + } -.el-slider.is-vertical .el-slider__stop { - -webkit-transform: translateY(50%); - transform: translateY(50%) -} + .el-col-xs-push-22 { + position: relative; + left: 91.66667% + } -.el-slider.is-vertical.el-slider--with-input { - padding-bottom: 58px -} + .el-col-xs-23 { + width: 95.83333% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input { - overflow: visible; - float: none; - position: absolute; - bottom: 22px; - width: 36px; - margin-top: 15px -} + .el-col-xs-offset-23 { + margin-left: 95.83333% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input__inner { - text-align: center; - padding-left: 5px; - padding-right: 5px -} + .el-col-xs-pull-23 { + position: relative; + right: 95.83333% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease, -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase { - top: 32px; - margin-top: -1px; - border: 1px solid #dfe2e6; - line-height: 20px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) -} + .el-col-xs-push-23 { + position: relative; + left: 95.83333% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__decrease { - width: 18px; - right: 18px; - border-bottom-left-radius: 4px -} + .el-col-xs-24 { + width: 100% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase { - width: 19px; - border-bottom-right-radius: 4px -} + .el-col-xs-offset-24 { + margin-left: 100% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input .el-input-number__increase~.el-input .el-input__inner { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0 -} + .el-col-xs-pull-24 { + position: relative; + right: 100% + } -.el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__decrease, -.el-slider.is-vertical.el-slider--with-input .el-slider__input:hover .el-input-number__increase { - border-color: #babdc2 + .el-col-xs-push-24 { + position: relative; + left: 100% + } } -.el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__decrease, -.el-slider.is-vertical.el-slider--with-input .el-slider__input:active .el-input-number__increase { - border-color: #006aff -} +@media only screen and (min-width:768px) { + .el-col-sm-0 { + display: none + } -.el-slider.is-vertical .el-slider__marks-text { - margin-top: 0; - left: 15px; - -webkit-transform: translateY(50%); - transform: translateY(50%) -} + .el-col-sm-0 { + width: 0% + } -.el-loading-parent--relative { - position: relative !important -} + .el-col-sm-offset-0 { + margin-left: 0 + } -.el-loading-parent--hidden { - overflow: hidden !important -} + .el-col-sm-pull-0 { + position: relative; + right: 0 + } -.el-loading-mask { - position: absolute; - z-index: 2000; - background-color: rgba(255, 255, 255, .9); - margin: 0; - top: 0; - right: 0; - bottom: 0; - left: 0; - -webkit-transition: opacity .3s; - transition: opacity .3s -} + .el-col-sm-push-0 { + position: relative; + left: 0 + } -.el-loading-mask.is-fullscreen { - position: fixed -} + .el-col-sm-1 { + width: 4.16667% + } -.el-loading-mask.is-fullscreen .el-loading-spinner { - margin-top: -25px -} + .el-col-sm-offset-1 { + margin-left: 4.16667% + } -.el-loading-mask.is-fullscreen .el-loading-spinner .circular { - height: 50px; - width: 50px -} + .el-col-sm-pull-1 { + position: relative; + right: 4.16667% + } -.el-loading-spinner { - top: 50%; - margin-top: -21px; - width: 100%; - text-align: center; - position: absolute -} + .el-col-sm-push-1 { + position: relative; + left: 4.16667% + } -.el-loading-spinner .el-loading-text { - color: #006aff; - margin: 3px 0; - font-size: 14px -} + .el-col-sm-2 { + width: 8.33333% + } -.el-loading-spinner .circular { - height: 42px; - width: 42px; - -webkit-animation: loading-rotate 2s linear infinite; - animation: loading-rotate 2s linear infinite -} + .el-col-sm-offset-2 { + margin-left: 8.33333% + } -.el-loading-spinner .path { - -webkit-animation: loading-dash 1.5s ease-in-out infinite; - animation: loading-dash 1.5s ease-in-out infinite; - stroke-dasharray: 90, 150; - stroke-dashoffset: 0; - stroke-width: 2; - stroke: #006AFF; - stroke-linecap: round -} + .el-col-sm-pull-2 { + position: relative; + right: 8.33333% + } -.el-loading-spinner i { - color: #006aff -} + .el-col-sm-push-2 { + position: relative; + left: 8.33333% + } -.el-loading-fade-enter, -.el-loading-fade-leave-active { - opacity: 0 -} + .el-col-sm-3 { + width: 12.5% + } -@-webkit-keyframes loading-rotate { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg) + .el-col-sm-offset-3 { + margin-left: 12.5% } -} -@keyframes loading-rotate { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg) + .el-col-sm-pull-3 { + position: relative; + right: 12.5% } -} -@-webkit-keyframes loading-dash { - 0% { - stroke-dasharray: 1, 200; - stroke-dashoffset: 0 + .el-col-sm-push-3 { + position: relative; + left: 12.5% } - 50% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -40px + .el-col-sm-4 { + width: 16.66667% } - 100% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -120px + .el-col-sm-offset-4 { + margin-left: 16.66667% } -} -@keyframes loading-dash { - 0% { - stroke-dasharray: 1, 200; - stroke-dashoffset: 0 + .el-col-sm-pull-4 { + position: relative; + right: 16.66667% } - 50% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -40px + .el-col-sm-push-4 { + position: relative; + left: 16.66667% } - 100% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -120px + .el-col-sm-5 { + width: 20.83333% } -} -.el-row { - position: relative; - -webkit-box-sizing: border-box; - box-sizing: border-box -} + .el-col-sm-offset-5 { + margin-left: 20.83333% + } -.el-row::after, -.el-row::before { - display: table; - content: "" -} + .el-col-sm-pull-5 { + position: relative; + right: 20.83333% + } -.el-row::after { - clear: both -} + .el-col-sm-push-5 { + position: relative; + left: 20.83333% + } -.el-row--flex { - display: -webkit-box; - display: -ms-flexbox; - display: flex -} + .el-col-sm-6 { + width: 25% + } -.el-row--flex:after, -.el-row--flex:before { - display: none -} + .el-col-sm-offset-6 { + margin-left: 25% + } -.el-row--flex.is-justify-center { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center -} + .el-col-sm-pull-6 { + position: relative; + right: 25% + } -.el-row--flex.is-justify-end { - -webkit-box-pack: end; - -ms-flex-pack: end; - justify-content: flex-end -} + .el-col-sm-push-6 { + position: relative; + left: 25% + } -.el-row--flex.is-justify-space-between { - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between -} + .el-col-sm-7 { + width: 29.16667% + } -.el-row--flex.is-justify-space-around { - -ms-flex-pack: distribute; - justify-content: space-around -} + .el-col-sm-offset-7 { + margin-left: 29.16667% + } -.el-row--flex.is-align-top { - -webkit-box-align: start; - -ms-flex-align: start; - align-items: flex-start -} + .el-col-sm-pull-7 { + position: relative; + right: 29.16667% + } -.el-row--flex.is-align-middle { - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center -} + .el-col-sm-push-7 { + position: relative; + left: 29.16667% + } -.el-row--flex.is-align-bottom { - -webkit-box-align: end; - -ms-flex-align: end; - align-items: flex-end -} + .el-col-sm-8 { + width: 33.33333% + } -[class*=el-col-] { - float: left; - -webkit-box-sizing: border-box; - box-sizing: border-box -} + .el-col-sm-offset-8 { + margin-left: 33.33333% + } -.el-col-0 { - display: none -} - -.el-col-0 { - width: 0% -} + .el-col-sm-pull-8 { + position: relative; + right: 33.33333% + } -.el-col-offset-0 { - margin-left: 0 -} + .el-col-sm-push-8 { + position: relative; + left: 33.33333% + } -.el-col-pull-0 { - position: relative; - right: 0 -} + .el-col-sm-9 { + width: 37.5% + } -.el-col-push-0 { - position: relative; - left: 0 -} + .el-col-sm-offset-9 { + margin-left: 37.5% + } -.el-col-1 { - width: 4.16667% -} + .el-col-sm-pull-9 { + position: relative; + right: 37.5% + } -.el-col-offset-1 { - margin-left: 4.16667% -} + .el-col-sm-push-9 { + position: relative; + left: 37.5% + } -.el-col-pull-1 { - position: relative; - right: 4.16667% -} + .el-col-sm-10 { + width: 41.66667% + } -.el-col-push-1 { - position: relative; - left: 4.16667% -} + .el-col-sm-offset-10 { + margin-left: 41.66667% + } -.el-col-2 { - width: 8.33333% -} + .el-col-sm-pull-10 { + position: relative; + right: 41.66667% + } -.el-col-offset-2 { - margin-left: 8.33333% -} + .el-col-sm-push-10 { + position: relative; + left: 41.66667% + } -.el-col-pull-2 { - position: relative; - right: 8.33333% -} + .el-col-sm-11 { + width: 45.83333% + } -.el-col-push-2 { - position: relative; - left: 8.33333% -} + .el-col-sm-offset-11 { + margin-left: 45.83333% + } -.el-col-3 { - width: 12.5% -} + .el-col-sm-pull-11 { + position: relative; + right: 45.83333% + } -.el-col-offset-3 { - margin-left: 12.5% -} + .el-col-sm-push-11 { + position: relative; + left: 45.83333% + } -.el-col-pull-3 { - position: relative; - right: 12.5% -} + .el-col-sm-12 { + width: 50% + } -.el-col-push-3 { - position: relative; - left: 12.5% -} + .el-col-sm-offset-12 { + margin-left: 50% + } -.el-col-4 { - width: 16.66667% -} + .el-col-sm-pull-12 { + position: relative; + right: 50% + } -.el-col-offset-4 { - margin-left: 16.66667% -} + .el-col-sm-push-12 { + position: relative; + left: 50% + } -.el-col-pull-4 { - position: relative; - right: 16.66667% -} + .el-col-sm-13 { + width: 54.16667% + } -.el-col-push-4 { - position: relative; - left: 16.66667% -} + .el-col-sm-offset-13 { + margin-left: 54.16667% + } -.el-col-5 { - width: 20.83333% -} + .el-col-sm-pull-13 { + position: relative; + right: 54.16667% + } -.el-col-offset-5 { - margin-left: 20.83333% -} + .el-col-sm-push-13 { + position: relative; + left: 54.16667% + } -.el-col-pull-5 { - position: relative; - right: 20.83333% -} + .el-col-sm-14 { + width: 58.33333% + } -.el-col-push-5 { - position: relative; - left: 20.83333% -} + .el-col-sm-offset-14 { + margin-left: 58.33333% + } -.el-col-6 { - width: 25% -} + .el-col-sm-pull-14 { + position: relative; + right: 58.33333% + } -.el-col-offset-6 { - margin-left: 25% -} + .el-col-sm-push-14 { + position: relative; + left: 58.33333% + } -.el-col-pull-6 { - position: relative; - right: 25% -} + .el-col-sm-15 { + width: 62.5% + } -.el-col-push-6 { - position: relative; - left: 25% -} + .el-col-sm-offset-15 { + margin-left: 62.5% + } -.el-col-7 { - width: 29.16667% -} + .el-col-sm-pull-15 { + position: relative; + right: 62.5% + } -.el-col-offset-7 { - margin-left: 29.16667% -} + .el-col-sm-push-15 { + position: relative; + left: 62.5% + } -.el-col-pull-7 { - position: relative; - right: 29.16667% -} + .el-col-sm-16 { + width: 66.66667% + } -.el-col-push-7 { - position: relative; - left: 29.16667% -} + .el-col-sm-offset-16 { + margin-left: 66.66667% + } -.el-col-8 { - width: 33.33333% -} + .el-col-sm-pull-16 { + position: relative; + right: 66.66667% + } -.el-col-offset-8 { - margin-left: 33.33333% -} + .el-col-sm-push-16 { + position: relative; + left: 66.66667% + } -.el-col-pull-8 { - position: relative; - right: 33.33333% -} + .el-col-sm-17 { + width: 70.83333% + } -.el-col-push-8 { - position: relative; - left: 33.33333% -} + .el-col-sm-offset-17 { + margin-left: 70.83333% + } -.el-col-9 { - width: 37.5% -} + .el-col-sm-pull-17 { + position: relative; + right: 70.83333% + } -.el-col-offset-9 { - margin-left: 37.5% -} + .el-col-sm-push-17 { + position: relative; + left: 70.83333% + } -.el-col-pull-9 { - position: relative; - right: 37.5% -} + .el-col-sm-18 { + width: 75% + } -.el-col-push-9 { - position: relative; - left: 37.5% -} + .el-col-sm-offset-18 { + margin-left: 75% + } -.el-col-10 { - width: 41.66667% -} + .el-col-sm-pull-18 { + position: relative; + right: 75% + } -.el-col-offset-10 { - margin-left: 41.66667% -} + .el-col-sm-push-18 { + position: relative; + left: 75% + } -.el-col-pull-10 { - position: relative; - right: 41.66667% -} + .el-col-sm-19 { + width: 79.16667% + } -.el-col-push-10 { - position: relative; - left: 41.66667% -} + .el-col-sm-offset-19 { + margin-left: 79.16667% + } -.el-col-11 { - width: 45.83333% -} + .el-col-sm-pull-19 { + position: relative; + right: 79.16667% + } -.el-col-offset-11 { - margin-left: 45.83333% -} + .el-col-sm-push-19 { + position: relative; + left: 79.16667% + } -.el-col-pull-11 { - position: relative; - right: 45.83333% -} + .el-col-sm-20 { + width: 83.33333% + } -.el-col-push-11 { - position: relative; - left: 45.83333% -} + .el-col-sm-offset-20 { + margin-left: 83.33333% + } -.el-col-12 { - width: 50% -} + .el-col-sm-pull-20 { + position: relative; + right: 83.33333% + } -.el-col-offset-12 { - margin-left: 50% -} + .el-col-sm-push-20 { + position: relative; + left: 83.33333% + } -.el-col-pull-12 { - position: relative; - right: 50% -} + .el-col-sm-21 { + width: 87.5% + } -.el-col-push-12 { - position: relative; - left: 50% -} + .el-col-sm-offset-21 { + margin-left: 87.5% + } -.el-col-13 { - width: 54.16667% -} + .el-col-sm-pull-21 { + position: relative; + right: 87.5% + } -.el-col-offset-13 { - margin-left: 54.16667% -} + .el-col-sm-push-21 { + position: relative; + left: 87.5% + } -.el-col-pull-13 { - position: relative; - right: 54.16667% -} + .el-col-sm-22 { + width: 91.66667% + } -.el-col-push-13 { - position: relative; - left: 54.16667% -} + .el-col-sm-offset-22 { + margin-left: 91.66667% + } -.el-col-14 { - width: 58.33333% -} + .el-col-sm-pull-22 { + position: relative; + right: 91.66667% + } -.el-col-offset-14 { - margin-left: 58.33333% -} + .el-col-sm-push-22 { + position: relative; + left: 91.66667% + } -.el-col-pull-14 { - position: relative; - right: 58.33333% -} + .el-col-sm-23 { + width: 95.83333% + } -.el-col-push-14 { - position: relative; - left: 58.33333% -} + .el-col-sm-offset-23 { + margin-left: 95.83333% + } -.el-col-15 { - width: 62.5% -} + .el-col-sm-pull-23 { + position: relative; + right: 95.83333% + } -.el-col-offset-15 { - margin-left: 62.5% -} + .el-col-sm-push-23 { + position: relative; + left: 95.83333% + } -.el-col-pull-15 { - position: relative; - right: 62.5% -} + .el-col-sm-24 { + width: 100% + } -.el-col-push-15 { - position: relative; - left: 62.5% -} + .el-col-sm-offset-24 { + margin-left: 100% + } -.el-col-16 { - width: 66.66667% -} + .el-col-sm-pull-24 { + position: relative; + right: 100% + } -.el-col-offset-16 { - margin-left: 66.66667% + .el-col-sm-push-24 { + position: relative; + left: 100% + } } -.el-col-pull-16 { - position: relative; - right: 66.66667% -} +@media only screen and (min-width:992px) { + .el-col-md-0 { + display: none + } -.el-col-push-16 { - position: relative; - left: 66.66667% -} + .el-col-md-0 { + width: 0% + } -.el-col-17 { - width: 70.83333% -} + .el-col-md-offset-0 { + margin-left: 0 + } -.el-col-offset-17 { - margin-left: 70.83333% -} + .el-col-md-pull-0 { + position: relative; + right: 0 + } -.el-col-pull-17 { - position: relative; - right: 70.83333% -} + .el-col-md-push-0 { + position: relative; + left: 0 + } -.el-col-push-17 { - position: relative; - left: 70.83333% -} + .el-col-md-1 { + width: 4.16667% + } -.el-col-18 { - width: 75% -} + .el-col-md-offset-1 { + margin-left: 4.16667% + } -.el-col-offset-18 { - margin-left: 75% -} - -.el-col-pull-18 { - position: relative; - right: 75% -} - -.el-col-push-18 { - position: relative; - left: 75% -} - -.el-col-19 { - width: 79.16667% -} - -.el-col-offset-19 { - margin-left: 79.16667% -} - -.el-col-pull-19 { - position: relative; - right: 79.16667% -} - -.el-col-push-19 { - position: relative; - left: 79.16667% -} - -.el-col-20 { - width: 83.33333% -} - -.el-col-offset-20 { - margin-left: 83.33333% -} - -.el-col-pull-20 { - position: relative; - right: 83.33333% -} - -.el-col-push-20 { - position: relative; - left: 83.33333% -} - -.el-col-21 { - width: 87.5% -} - -.el-col-offset-21 { - margin-left: 87.5% -} - -.el-col-pull-21 { - position: relative; - right: 87.5% -} - -.el-col-push-21 { - position: relative; - left: 87.5% -} - -.el-col-22 { - width: 91.66667% -} - -.el-col-offset-22 { - margin-left: 91.66667% -} - -.el-col-pull-22 { - position: relative; - right: 91.66667% -} - -.el-col-push-22 { - position: relative; - left: 91.66667% -} - -.el-col-23 { - width: 95.83333% -} - -.el-col-offset-23 { - margin-left: 95.83333% -} - -.el-col-pull-23 { - position: relative; - right: 95.83333% -} - -.el-col-push-23 { - position: relative; - left: 95.83333% -} - -.el-col-24 { - width: 100% -} - -.el-col-offset-24 { - margin-left: 100% -} - -.el-col-pull-24 { - position: relative; - right: 100% -} - -.el-col-push-24 { - position: relative; - left: 100% -} - -@media only screen and (max-width:767px) { - .el-col-xs-0 { - display: none - } - - .el-col-xs-0 { - width: 0% - } - - .el-col-xs-offset-0 { - margin-left: 0 - } - - .el-col-xs-pull-0 { - position: relative; - right: 0 - } - - .el-col-xs-push-0 { - position: relative; - left: 0 - } - - .el-col-xs-1 { - width: 4.16667% - } - - .el-col-xs-offset-1 { - margin-left: 4.16667% - } - - .el-col-xs-pull-1 { + .el-col-md-pull-1 { position: relative; right: 4.16667% } - .el-col-xs-push-1 { + .el-col-md-push-1 { position: relative; left: 4.16667% } - .el-col-xs-2 { + .el-col-md-2 { width: 8.33333% } - .el-col-xs-offset-2 { + .el-col-md-offset-2 { margin-left: 8.33333% } - .el-col-xs-pull-2 { + .el-col-md-pull-2 { position: relative; right: 8.33333% } - .el-col-xs-push-2 { + .el-col-md-push-2 { position: relative; left: 8.33333% } - .el-col-xs-3 { + .el-col-md-3 { width: 12.5% } - .el-col-xs-offset-3 { + .el-col-md-offset-3 { margin-left: 12.5% } - .el-col-xs-pull-3 { + .el-col-md-pull-3 { position: relative; right: 12.5% } - .el-col-xs-push-3 { + .el-col-md-push-3 { position: relative; left: 12.5% } - .el-col-xs-4 { + .el-col-md-4 { width: 16.66667% } - .el-col-xs-offset-4 { + .el-col-md-offset-4 { margin-left: 16.66667% } - .el-col-xs-pull-4 { + .el-col-md-pull-4 { position: relative; right: 16.66667% } - .el-col-xs-push-4 { + .el-col-md-push-4 { position: relative; left: 16.66667% } - .el-col-xs-5 { + .el-col-md-5 { width: 20.83333% } - .el-col-xs-offset-5 { + .el-col-md-offset-5 { margin-left: 20.83333% } - .el-col-xs-pull-5 { + .el-col-md-pull-5 { position: relative; right: 20.83333% } - .el-col-xs-push-5 { + .el-col-md-push-5 { position: relative; left: 20.83333% } - .el-col-xs-6 { + .el-col-md-6 { width: 25% } - .el-col-xs-offset-6 { + .el-col-md-offset-6 { margin-left: 25% } - .el-col-xs-pull-6 { + .el-col-md-pull-6 { position: relative; right: 25% } - .el-col-xs-push-6 { + .el-col-md-push-6 { position: relative; left: 25% } - .el-col-xs-7 { + .el-col-md-7 { width: 29.16667% } - .el-col-xs-offset-7 { + .el-col-md-offset-7 { margin-left: 29.16667% } - .el-col-xs-pull-7 { + .el-col-md-pull-7 { position: relative; right: 29.16667% } - .el-col-xs-push-7 { + .el-col-md-push-7 { position: relative; left: 29.16667% } - .el-col-xs-8 { + .el-col-md-8 { width: 33.33333% } - .el-col-xs-offset-8 { + .el-col-md-offset-8 { margin-left: 33.33333% } - .el-col-xs-pull-8 { + .el-col-md-pull-8 { position: relative; right: 33.33333% } - .el-col-xs-push-8 { + .el-col-md-push-8 { position: relative; left: 33.33333% } - .el-col-xs-9 { + .el-col-md-9 { width: 37.5% } - .el-col-xs-offset-9 { + .el-col-md-offset-9 { margin-left: 37.5% } - .el-col-xs-pull-9 { + .el-col-md-pull-9 { position: relative; right: 37.5% } - .el-col-xs-push-9 { + .el-col-md-push-9 { position: relative; left: 37.5% } - .el-col-xs-10 { + .el-col-md-10 { width: 41.66667% } - .el-col-xs-offset-10 { + .el-col-md-offset-10 { margin-left: 41.66667% } - .el-col-xs-pull-10 { + .el-col-md-pull-10 { position: relative; right: 41.66667% } - .el-col-xs-push-10 { + .el-col-md-push-10 { position: relative; left: 41.66667% } - .el-col-xs-11 { + .el-col-md-11 { width: 45.83333% } - .el-col-xs-offset-11 { + .el-col-md-offset-11 { margin-left: 45.83333% } - .el-col-xs-pull-11 { + .el-col-md-pull-11 { position: relative; right: 45.83333% } - .el-col-xs-push-11 { + .el-col-md-push-11 { position: relative; left: 45.83333% } - .el-col-xs-12 { + .el-col-md-12 { width: 50% } - .el-col-xs-offset-12 { + .el-col-md-offset-12 { margin-left: 50% } - .el-col-xs-pull-12 { + .el-col-md-pull-12 { position: relative; right: 50% } - .el-col-xs-push-12 { + .el-col-md-push-12 { position: relative; left: 50% } - .el-col-xs-13 { + .el-col-md-13 { width: 54.16667% } - .el-col-xs-offset-13 { + .el-col-md-offset-13 { margin-left: 54.16667% } - .el-col-xs-pull-13 { + .el-col-md-pull-13 { position: relative; right: 54.16667% } - .el-col-xs-push-13 { + .el-col-md-push-13 { position: relative; left: 54.16667% } - .el-col-xs-14 { + .el-col-md-14 { width: 58.33333% } - .el-col-xs-offset-14 { + .el-col-md-offset-14 { margin-left: 58.33333% } - .el-col-xs-pull-14 { + .el-col-md-pull-14 { position: relative; right: 58.33333% } - .el-col-xs-push-14 { + .el-col-md-push-14 { position: relative; left: 58.33333% } - .el-col-xs-15 { + .el-col-md-15 { width: 62.5% } - .el-col-xs-offset-15 { + .el-col-md-offset-15 { margin-left: 62.5% } - .el-col-xs-pull-15 { + .el-col-md-pull-15 { position: relative; right: 62.5% } - .el-col-xs-push-15 { + .el-col-md-push-15 { position: relative; left: 62.5% } - .el-col-xs-16 { + .el-col-md-16 { width: 66.66667% } - .el-col-xs-offset-16 { + .el-col-md-offset-16 { margin-left: 66.66667% } - .el-col-xs-pull-16 { + .el-col-md-pull-16 { position: relative; right: 66.66667% } - .el-col-xs-push-16 { + .el-col-md-push-16 { position: relative; left: 66.66667% } - .el-col-xs-17 { + .el-col-md-17 { width: 70.83333% } - .el-col-xs-offset-17 { + .el-col-md-offset-17 { margin-left: 70.83333% } - .el-col-xs-pull-17 { + .el-col-md-pull-17 { position: relative; right: 70.83333% } - .el-col-xs-push-17 { + .el-col-md-push-17 { position: relative; left: 70.83333% } - .el-col-xs-18 { + .el-col-md-18 { width: 75% } - .el-col-xs-offset-18 { + .el-col-md-offset-18 { margin-left: 75% } - .el-col-xs-pull-18 { + .el-col-md-pull-18 { position: relative; right: 75% } - .el-col-xs-push-18 { + .el-col-md-push-18 { position: relative; left: 75% } - .el-col-xs-19 { + .el-col-md-19 { width: 79.16667% } - .el-col-xs-offset-19 { + .el-col-md-offset-19 { margin-left: 79.16667% } - .el-col-xs-pull-19 { + .el-col-md-pull-19 { position: relative; right: 79.16667% } - .el-col-xs-push-19 { + .el-col-md-push-19 { position: relative; left: 79.16667% } - .el-col-xs-20 { + .el-col-md-20 { width: 83.33333% } - .el-col-xs-offset-20 { + .el-col-md-offset-20 { margin-left: 83.33333% } - .el-col-xs-pull-20 { + .el-col-md-pull-20 { position: relative; right: 83.33333% } - .el-col-xs-push-20 { + .el-col-md-push-20 { position: relative; left: 83.33333% } - .el-col-xs-21 { + .el-col-md-21 { width: 87.5% } - .el-col-xs-offset-21 { + .el-col-md-offset-21 { margin-left: 87.5% } - .el-col-xs-pull-21 { + .el-col-md-pull-21 { position: relative; right: 87.5% } - .el-col-xs-push-21 { + .el-col-md-push-21 { position: relative; left: 87.5% } - .el-col-xs-22 { + .el-col-md-22 { width: 91.66667% } - .el-col-xs-offset-22 { + .el-col-md-offset-22 { margin-left: 91.66667% } - .el-col-xs-pull-22 { + .el-col-md-pull-22 { position: relative; right: 91.66667% } - .el-col-xs-push-22 { + .el-col-md-push-22 { position: relative; left: 91.66667% } - .el-col-xs-23 { + .el-col-md-23 { width: 95.83333% } - .el-col-xs-offset-23 { + .el-col-md-offset-23 { margin-left: 95.83333% } - .el-col-xs-pull-23 { + .el-col-md-pull-23 { position: relative; right: 95.83333% } - .el-col-xs-push-23 { + .el-col-md-push-23 { position: relative; left: 95.83333% } - .el-col-xs-24 { + .el-col-md-24 { width: 100% } - .el-col-xs-offset-24 { + .el-col-md-offset-24 { margin-left: 100% } - .el-col-xs-pull-24 { + .el-col-md-pull-24 { position: relative; right: 100% } - .el-col-xs-push-24 { + .el-col-md-push-24 { position: relative; left: 100% } } -@media only screen and (min-width:768px) { - .el-col-sm-0 { +@media only screen and (min-width:1200px) { + .el-col-lg-0 { display: none } - .el-col-sm-0 { + .el-col-lg-0 { width: 0% } - .el-col-sm-offset-0 { + .el-col-lg-offset-0 { margin-left: 0 } - .el-col-sm-pull-0 { + .el-col-lg-pull-0 { position: relative; right: 0 } - .el-col-sm-push-0 { + .el-col-lg-push-0 { position: relative; left: 0 } - .el-col-sm-1 { + .el-col-lg-1 { width: 4.16667% } - .el-col-sm-offset-1 { + .el-col-lg-offset-1 { margin-left: 4.16667% } - .el-col-sm-pull-1 { + .el-col-lg-pull-1 { position: relative; right: 4.16667% } - .el-col-sm-push-1 { + .el-col-lg-push-1 { position: relative; left: 4.16667% } - .el-col-sm-2 { + .el-col-lg-2 { width: 8.33333% } - .el-col-sm-offset-2 { + .el-col-lg-offset-2 { margin-left: 8.33333% } - .el-col-sm-pull-2 { + .el-col-lg-pull-2 { position: relative; right: 8.33333% } - .el-col-sm-push-2 { + .el-col-lg-push-2 { position: relative; left: 8.33333% } - .el-col-sm-3 { + .el-col-lg-3 { width: 12.5% } - .el-col-sm-offset-3 { + .el-col-lg-offset-3 { margin-left: 12.5% } - .el-col-sm-pull-3 { + .el-col-lg-pull-3 { position: relative; right: 12.5% } - .el-col-sm-push-3 { + .el-col-lg-push-3 { position: relative; left: 12.5% } - .el-col-sm-4 { + .el-col-lg-4 { width: 16.66667% } - .el-col-sm-offset-4 { + .el-col-lg-offset-4 { margin-left: 16.66667% } - .el-col-sm-pull-4 { + .el-col-lg-pull-4 { position: relative; right: 16.66667% } - .el-col-sm-push-4 { + .el-col-lg-push-4 { position: relative; left: 16.66667% } - .el-col-sm-5 { + .el-col-lg-5 { width: 20.83333% } - .el-col-sm-offset-5 { + .el-col-lg-offset-5 { margin-left: 20.83333% } - .el-col-sm-pull-5 { + .el-col-lg-pull-5 { position: relative; right: 20.83333% } - .el-col-sm-push-5 { + .el-col-lg-push-5 { position: relative; left: 20.83333% } - .el-col-sm-6 { + .el-col-lg-6 { width: 25% } - .el-col-sm-offset-6 { + .el-col-lg-offset-6 { margin-left: 25% } - .el-col-sm-pull-6 { + .el-col-lg-pull-6 { position: relative; right: 25% } - .el-col-sm-push-6 { + .el-col-lg-push-6 { position: relative; left: 25% } - .el-col-sm-7 { + .el-col-lg-7 { width: 29.16667% } - .el-col-sm-offset-7 { + .el-col-lg-offset-7 { margin-left: 29.16667% } - .el-col-sm-pull-7 { + .el-col-lg-pull-7 { position: relative; right: 29.16667% } - .el-col-sm-push-7 { + .el-col-lg-push-7 { position: relative; left: 29.16667% } - .el-col-sm-8 { + .el-col-lg-8 { width: 33.33333% } - .el-col-sm-offset-8 { + .el-col-lg-offset-8 { margin-left: 33.33333% } - .el-col-sm-pull-8 { + .el-col-lg-pull-8 { position: relative; right: 33.33333% } - .el-col-sm-push-8 { + .el-col-lg-push-8 { position: relative; left: 33.33333% } - .el-col-sm-9 { + .el-col-lg-9 { width: 37.5% } - .el-col-sm-offset-9 { + .el-col-lg-offset-9 { margin-left: 37.5% } - .el-col-sm-pull-9 { + .el-col-lg-pull-9 { position: relative; right: 37.5% } - .el-col-sm-push-9 { + .el-col-lg-push-9 { position: relative; left: 37.5% } - .el-col-sm-10 { + .el-col-lg-10 { width: 41.66667% } - .el-col-sm-offset-10 { + .el-col-lg-offset-10 { margin-left: 41.66667% } - .el-col-sm-pull-10 { + .el-col-lg-pull-10 { position: relative; right: 41.66667% } - .el-col-sm-push-10 { + .el-col-lg-push-10 { position: relative; left: 41.66667% } - .el-col-sm-11 { + .el-col-lg-11 { width: 45.83333% } - .el-col-sm-offset-11 { + .el-col-lg-offset-11 { margin-left: 45.83333% } - .el-col-sm-pull-11 { + .el-col-lg-pull-11 { position: relative; right: 45.83333% } - .el-col-sm-push-11 { + .el-col-lg-push-11 { position: relative; left: 45.83333% } - .el-col-sm-12 { + .el-col-lg-12 { width: 50% } - .el-col-sm-offset-12 { + .el-col-lg-offset-12 { margin-left: 50% } - .el-col-sm-pull-12 { + .el-col-lg-pull-12 { position: relative; right: 50% } - .el-col-sm-push-12 { + .el-col-lg-push-12 { position: relative; left: 50% } - .el-col-sm-13 { + .el-col-lg-13 { width: 54.16667% } - .el-col-sm-offset-13 { + .el-col-lg-offset-13 { margin-left: 54.16667% } - .el-col-sm-pull-13 { + .el-col-lg-pull-13 { position: relative; right: 54.16667% } - .el-col-sm-push-13 { + .el-col-lg-push-13 { position: relative; left: 54.16667% } - .el-col-sm-14 { + .el-col-lg-14 { width: 58.33333% } - .el-col-sm-offset-14 { + .el-col-lg-offset-14 { margin-left: 58.33333% } - .el-col-sm-pull-14 { + .el-col-lg-pull-14 { position: relative; right: 58.33333% } - .el-col-sm-push-14 { + .el-col-lg-push-14 { position: relative; left: 58.33333% } - .el-col-sm-15 { + .el-col-lg-15 { width: 62.5% } - .el-col-sm-offset-15 { + .el-col-lg-offset-15 { margin-left: 62.5% } - .el-col-sm-pull-15 { + .el-col-lg-pull-15 { position: relative; right: 62.5% } - .el-col-sm-push-15 { + .el-col-lg-push-15 { position: relative; left: 62.5% } - .el-col-sm-16 { + .el-col-lg-16 { width: 66.66667% } - .el-col-sm-offset-16 { + .el-col-lg-offset-16 { margin-left: 66.66667% } - .el-col-sm-pull-16 { + .el-col-lg-pull-16 { position: relative; right: 66.66667% } - .el-col-sm-push-16 { + .el-col-lg-push-16 { position: relative; left: 66.66667% } - .el-col-sm-17 { + .el-col-lg-17 { width: 70.83333% } - .el-col-sm-offset-17 { - margin-left: 70.83333% - } - - .el-col-sm-pull-17 { - position: relative; - right: 70.83333% - } - - .el-col-sm-push-17 { - position: relative; - left: 70.83333% - } - - .el-col-sm-18 { - width: 75% - } - - .el-col-sm-offset-18 { - margin-left: 75% - } - - .el-col-sm-pull-18 { - position: relative; - right: 75% - } - - .el-col-sm-push-18 { - position: relative; - left: 75% - } - - .el-col-sm-19 { - width: 79.16667% - } - - .el-col-sm-offset-19 { - margin-left: 79.16667% - } - - .el-col-sm-pull-19 { - position: relative; - right: 79.16667% - } - - .el-col-sm-push-19 { - position: relative; - left: 79.16667% - } - - .el-col-sm-20 { - width: 83.33333% - } - - .el-col-sm-offset-20 { - margin-left: 83.33333% - } - - .el-col-sm-pull-20 { - position: relative; - right: 83.33333% - } - - .el-col-sm-push-20 { - position: relative; - left: 83.33333% - } - - .el-col-sm-21 { - width: 87.5% - } - - .el-col-sm-offset-21 { - margin-left: 87.5% - } - - .el-col-sm-pull-21 { - position: relative; - right: 87.5% - } - - .el-col-sm-push-21 { - position: relative; - left: 87.5% - } - - .el-col-sm-22 { - width: 91.66667% - } - - .el-col-sm-offset-22 { - margin-left: 91.66667% - } - - .el-col-sm-pull-22 { - position: relative; - right: 91.66667% - } - - .el-col-sm-push-22 { - position: relative; - left: 91.66667% - } - - .el-col-sm-23 { - width: 95.83333% - } - - .el-col-sm-offset-23 { - margin-left: 95.83333% - } - - .el-col-sm-pull-23 { - position: relative; - right: 95.83333% - } - - .el-col-sm-push-23 { - position: relative; - left: 95.83333% - } - - .el-col-sm-24 { - width: 100% - } - - .el-col-sm-offset-24 { - margin-left: 100% - } - - .el-col-sm-pull-24 { - position: relative; - right: 100% - } - - .el-col-sm-push-24 { - position: relative; - left: 100% - } -} - -@media only screen and (min-width:992px) { - .el-col-md-0 { - display: none - } - - .el-col-md-0 { - width: 0% - } - - .el-col-md-offset-0 { - margin-left: 0 - } - - .el-col-md-pull-0 { - position: relative; - right: 0 - } - - .el-col-md-push-0 { - position: relative; - left: 0 - } - - .el-col-md-1 { - width: 4.16667% - } - - .el-col-md-offset-1 { - margin-left: 4.16667% - } - - .el-col-md-pull-1 { - position: relative; - right: 4.16667% - } - - .el-col-md-push-1 { - position: relative; - left: 4.16667% - } - - .el-col-md-2 { - width: 8.33333% - } - - .el-col-md-offset-2 { - margin-left: 8.33333% - } - - .el-col-md-pull-2 { - position: relative; - right: 8.33333% - } - - .el-col-md-push-2 { - position: relative; - left: 8.33333% - } - - .el-col-md-3 { - width: 12.5% - } - - .el-col-md-offset-3 { - margin-left: 12.5% - } - - .el-col-md-pull-3 { - position: relative; - right: 12.5% - } - - .el-col-md-push-3 { - position: relative; - left: 12.5% - } - - .el-col-md-4 { - width: 16.66667% - } - - .el-col-md-offset-4 { - margin-left: 16.66667% - } - - .el-col-md-pull-4 { - position: relative; - right: 16.66667% - } - - .el-col-md-push-4 { - position: relative; - left: 16.66667% - } - - .el-col-md-5 { - width: 20.83333% - } - - .el-col-md-offset-5 { - margin-left: 20.83333% - } - - .el-col-md-pull-5 { - position: relative; - right: 20.83333% - } - - .el-col-md-push-5 { - position: relative; - left: 20.83333% - } - - .el-col-md-6 { - width: 25% - } - - .el-col-md-offset-6 { - margin-left: 25% - } - - .el-col-md-pull-6 { - position: relative; - right: 25% - } - - .el-col-md-push-6 { - position: relative; - left: 25% - } - - .el-col-md-7 { - width: 29.16667% - } - - .el-col-md-offset-7 { - margin-left: 29.16667% - } - - .el-col-md-pull-7 { - position: relative; - right: 29.16667% - } - - .el-col-md-push-7 { - position: relative; - left: 29.16667% - } - - .el-col-md-8 { - width: 33.33333% - } - - .el-col-md-offset-8 { - margin-left: 33.33333% - } - - .el-col-md-pull-8 { - position: relative; - right: 33.33333% - } - - .el-col-md-push-8 { - position: relative; - left: 33.33333% - } - - .el-col-md-9 { - width: 37.5% - } - - .el-col-md-offset-9 { - margin-left: 37.5% - } - - .el-col-md-pull-9 { - position: relative; - right: 37.5% - } - - .el-col-md-push-9 { - position: relative; - left: 37.5% - } - - .el-col-md-10 { - width: 41.66667% - } - - .el-col-md-offset-10 { - margin-left: 41.66667% - } - - .el-col-md-pull-10 { - position: relative; - right: 41.66667% - } - - .el-col-md-push-10 { - position: relative; - left: 41.66667% - } - - .el-col-md-11 { - width: 45.83333% - } - - .el-col-md-offset-11 { - margin-left: 45.83333% - } - - .el-col-md-pull-11 { - position: relative; - right: 45.83333% - } - - .el-col-md-push-11 { - position: relative; - left: 45.83333% - } - - .el-col-md-12 { - width: 50% - } - - .el-col-md-offset-12 { - margin-left: 50% - } - - .el-col-md-pull-12 { - position: relative; - right: 50% - } - - .el-col-md-push-12 { - position: relative; - left: 50% - } - - .el-col-md-13 { - width: 54.16667% - } - - .el-col-md-offset-13 { - margin-left: 54.16667% - } - - .el-col-md-pull-13 { - position: relative; - right: 54.16667% - } - - .el-col-md-push-13 { - position: relative; - left: 54.16667% - } - - .el-col-md-14 { - width: 58.33333% - } - - .el-col-md-offset-14 { - margin-left: 58.33333% - } - - .el-col-md-pull-14 { - position: relative; - right: 58.33333% - } - - .el-col-md-push-14 { - position: relative; - left: 58.33333% - } - - .el-col-md-15 { - width: 62.5% - } - - .el-col-md-offset-15 { - margin-left: 62.5% - } - - .el-col-md-pull-15 { - position: relative; - right: 62.5% - } - - .el-col-md-push-15 { - position: relative; - left: 62.5% - } - - .el-col-md-16 { - width: 66.66667% - } - - .el-col-md-offset-16 { - margin-left: 66.66667% - } - - .el-col-md-pull-16 { - position: relative; - right: 66.66667% - } - - .el-col-md-push-16 { - position: relative; - left: 66.66667% - } - - .el-col-md-17 { - width: 70.83333% - } - - .el-col-md-offset-17 { - margin-left: 70.83333% - } - - .el-col-md-pull-17 { - position: relative; - right: 70.83333% - } - - .el-col-md-push-17 { - position: relative; - left: 70.83333% - } - - .el-col-md-18 { - width: 75% - } - - .el-col-md-offset-18 { - margin-left: 75% - } - - .el-col-md-pull-18 { - position: relative; - right: 75% - } - - .el-col-md-push-18 { - position: relative; - left: 75% - } - - .el-col-md-19 { - width: 79.16667% - } - - .el-col-md-offset-19 { - margin-left: 79.16667% - } - - .el-col-md-pull-19 { - position: relative; - right: 79.16667% - } - - .el-col-md-push-19 { - position: relative; - left: 79.16667% - } - - .el-col-md-20 { - width: 83.33333% - } - - .el-col-md-offset-20 { - margin-left: 83.33333% - } - - .el-col-md-pull-20 { - position: relative; - right: 83.33333% - } - - .el-col-md-push-20 { - position: relative; - left: 83.33333% - } - - .el-col-md-21 { - width: 87.5% - } - - .el-col-md-offset-21 { - margin-left: 87.5% - } - - .el-col-md-pull-21 { - position: relative; - right: 87.5% - } - - .el-col-md-push-21 { - position: relative; - left: 87.5% - } - - .el-col-md-22 { - width: 91.66667% - } - - .el-col-md-offset-22 { - margin-left: 91.66667% - } - - .el-col-md-pull-22 { - position: relative; - right: 91.66667% - } - - .el-col-md-push-22 { - position: relative; - left: 91.66667% - } - - .el-col-md-23 { - width: 95.83333% - } - - .el-col-md-offset-23 { - margin-left: 95.83333% - } - - .el-col-md-pull-23 { - position: relative; - right: 95.83333% - } - - .el-col-md-push-23 { - position: relative; - left: 95.83333% - } - - .el-col-md-24 { - width: 100% - } - - .el-col-md-offset-24 { - margin-left: 100% - } - - .el-col-md-pull-24 { - position: relative; - right: 100% - } - - .el-col-md-push-24 { - position: relative; - left: 100% - } -} - -@media only screen and (min-width:1200px) { - .el-col-lg-0 { - display: none - } - - .el-col-lg-0 { - width: 0% - } - - .el-col-lg-offset-0 { - margin-left: 0 - } - - .el-col-lg-pull-0 { - position: relative; - right: 0 - } - - .el-col-lg-push-0 { - position: relative; - left: 0 - } - - .el-col-lg-1 { - width: 4.16667% - } - - .el-col-lg-offset-1 { - margin-left: 4.16667% - } - - .el-col-lg-pull-1 { - position: relative; - right: 4.16667% - } - - .el-col-lg-push-1 { - position: relative; - left: 4.16667% - } - - .el-col-lg-2 { - width: 8.33333% - } - - .el-col-lg-offset-2 { - margin-left: 8.33333% - } - - .el-col-lg-pull-2 { - position: relative; - right: 8.33333% - } - - .el-col-lg-push-2 { - position: relative; - left: 8.33333% - } - - .el-col-lg-3 { - width: 12.5% - } - - .el-col-lg-offset-3 { - margin-left: 12.5% - } - - .el-col-lg-pull-3 { - position: relative; - right: 12.5% - } - - .el-col-lg-push-3 { - position: relative; - left: 12.5% - } - - .el-col-lg-4 { - width: 16.66667% - } - - .el-col-lg-offset-4 { - margin-left: 16.66667% - } - - .el-col-lg-pull-4 { - position: relative; - right: 16.66667% - } - - .el-col-lg-push-4 { - position: relative; - left: 16.66667% - } - - .el-col-lg-5 { - width: 20.83333% - } - - .el-col-lg-offset-5 { - margin-left: 20.83333% - } - - .el-col-lg-pull-5 { - position: relative; - right: 20.83333% - } - - .el-col-lg-push-5 { - position: relative; - left: 20.83333% - } - - .el-col-lg-6 { - width: 25% - } - - .el-col-lg-offset-6 { - margin-left: 25% - } - - .el-col-lg-pull-6 { - position: relative; - right: 25% - } - - .el-col-lg-push-6 { - position: relative; - left: 25% - } - - .el-col-lg-7 { - width: 29.16667% - } - - .el-col-lg-offset-7 { - margin-left: 29.16667% - } - - .el-col-lg-pull-7 { - position: relative; - right: 29.16667% - } - - .el-col-lg-push-7 { - position: relative; - left: 29.16667% - } - - .el-col-lg-8 { - width: 33.33333% - } - - .el-col-lg-offset-8 { - margin-left: 33.33333% - } - - .el-col-lg-pull-8 { - position: relative; - right: 33.33333% - } - - .el-col-lg-push-8 { - position: relative; - left: 33.33333% - } - - .el-col-lg-9 { - width: 37.5% - } - - .el-col-lg-offset-9 { - margin-left: 37.5% - } - - .el-col-lg-pull-9 { - position: relative; - right: 37.5% - } - - .el-col-lg-push-9 { - position: relative; - left: 37.5% - } - - .el-col-lg-10 { - width: 41.66667% - } - - .el-col-lg-offset-10 { - margin-left: 41.66667% - } - - .el-col-lg-pull-10 { - position: relative; - right: 41.66667% - } - - .el-col-lg-push-10 { - position: relative; - left: 41.66667% - } - - .el-col-lg-11 { - width: 45.83333% - } - - .el-col-lg-offset-11 { - margin-left: 45.83333% - } - - .el-col-lg-pull-11 { - position: relative; - right: 45.83333% - } - - .el-col-lg-push-11 { - position: relative; - left: 45.83333% - } - - .el-col-lg-12 { - width: 50% - } - - .el-col-lg-offset-12 { - margin-left: 50% - } - - .el-col-lg-pull-12 { - position: relative; - right: 50% - } - - .el-col-lg-push-12 { - position: relative; - left: 50% - } - - .el-col-lg-13 { - width: 54.16667% - } - - .el-col-lg-offset-13 { - margin-left: 54.16667% - } - - .el-col-lg-pull-13 { - position: relative; - right: 54.16667% - } - - .el-col-lg-push-13 { - position: relative; - left: 54.16667% - } - - .el-col-lg-14 { - width: 58.33333% - } - - .el-col-lg-offset-14 { - margin-left: 58.33333% - } - - .el-col-lg-pull-14 { - position: relative; - right: 58.33333% - } - - .el-col-lg-push-14 { - position: relative; - left: 58.33333% - } - - .el-col-lg-15 { - width: 62.5% - } - - .el-col-lg-offset-15 { - margin-left: 62.5% - } - - .el-col-lg-pull-15 { - position: relative; - right: 62.5% - } - - .el-col-lg-push-15 { - position: relative; - left: 62.5% - } - - .el-col-lg-16 { - width: 66.66667% - } - - .el-col-lg-offset-16 { - margin-left: 66.66667% - } - - .el-col-lg-pull-16 { - position: relative; - right: 66.66667% - } - - .el-col-lg-push-16 { - position: relative; - left: 66.66667% - } - - .el-col-lg-17 { - width: 70.83333% - } - - .el-col-lg-offset-17 { - margin-left: 70.83333% - } - - .el-col-lg-pull-17 { - position: relative; - right: 70.83333% - } - - .el-col-lg-push-17 { - position: relative; - left: 70.83333% - } - - .el-col-lg-18 { - width: 75% - } - - .el-col-lg-offset-18 { - margin-left: 75% - } - - .el-col-lg-pull-18 { - position: relative; - right: 75% - } - - .el-col-lg-push-18 { - position: relative; - left: 75% - } - - .el-col-lg-19 { - width: 79.16667% - } - - .el-col-lg-offset-19 { - margin-left: 79.16667% - } - - .el-col-lg-pull-19 { - position: relative; - right: 79.16667% - } - - .el-col-lg-push-19 { - position: relative; - left: 79.16667% - } - - .el-col-lg-20 { - width: 83.33333% - } - - .el-col-lg-offset-20 { - margin-left: 83.33333% - } - - .el-col-lg-pull-20 { - position: relative; - right: 83.33333% - } - - .el-col-lg-push-20 { - position: relative; - left: 83.33333% - } - - .el-col-lg-21 { - width: 87.5% - } - - .el-col-lg-offset-21 { - margin-left: 87.5% - } - - .el-col-lg-pull-21 { - position: relative; - right: 87.5% - } - - .el-col-lg-push-21 { - position: relative; - left: 87.5% - } - - .el-col-lg-22 { - width: 91.66667% - } - - .el-col-lg-offset-22 { - margin-left: 91.66667% - } - - .el-col-lg-pull-22 { - position: relative; - right: 91.66667% - } - - .el-col-lg-push-22 { - position: relative; - left: 91.66667% - } - - .el-col-lg-23 { - width: 95.83333% - } - - .el-col-lg-offset-23 { - margin-left: 95.83333% - } - - .el-col-lg-pull-23 { - position: relative; - right: 95.83333% - } - - .el-col-lg-push-23 { - position: relative; - left: 95.83333% - } - - .el-col-lg-24 { - width: 100% - } - - .el-col-lg-offset-24 { - margin-left: 100% - } - - .el-col-lg-pull-24 { - position: relative; - right: 100% - } - - .el-col-lg-push-24 { - position: relative; - left: 100% - } -} - -@media only screen and (min-width:1920px) { - .el-col-xl-0 { - display: none - } - - .el-col-xl-0 { - width: 0% - } - - .el-col-xl-offset-0 { - margin-left: 0 - } - - .el-col-xl-pull-0 { - position: relative; - right: 0 - } - - .el-col-xl-push-0 { - position: relative; - left: 0 - } - - .el-col-xl-1 { - width: 4.16667% - } - - .el-col-xl-offset-1 { - margin-left: 4.16667% - } - - .el-col-xl-pull-1 { - position: relative; - right: 4.16667% - } - - .el-col-xl-push-1 { - position: relative; - left: 4.16667% - } - - .el-col-xl-2 { - width: 8.33333% - } - - .el-col-xl-offset-2 { - margin-left: 8.33333% - } - - .el-col-xl-pull-2 { - position: relative; - right: 8.33333% - } - - .el-col-xl-push-2 { - position: relative; - left: 8.33333% - } - - .el-col-xl-3 { - width: 12.5% - } - - .el-col-xl-offset-3 { - margin-left: 12.5% - } - - .el-col-xl-pull-3 { - position: relative; - right: 12.5% - } - - .el-col-xl-push-3 { - position: relative; - left: 12.5% - } - - .el-col-xl-4 { - width: 16.66667% - } - - .el-col-xl-offset-4 { - margin-left: 16.66667% - } - - .el-col-xl-pull-4 { - position: relative; - right: 16.66667% - } - - .el-col-xl-push-4 { - position: relative; - left: 16.66667% - } - - .el-col-xl-5 { - width: 20.83333% - } - - .el-col-xl-offset-5 { - margin-left: 20.83333% - } - - .el-col-xl-pull-5 { - position: relative; - right: 20.83333% - } - - .el-col-xl-push-5 { - position: relative; - left: 20.83333% - } - - .el-col-xl-6 { - width: 25% - } - - .el-col-xl-offset-6 { - margin-left: 25% - } - - .el-col-xl-pull-6 { - position: relative; - right: 25% - } - - .el-col-xl-push-6 { - position: relative; - left: 25% - } - - .el-col-xl-7 { - width: 29.16667% - } - - .el-col-xl-offset-7 { - margin-left: 29.16667% - } - - .el-col-xl-pull-7 { - position: relative; - right: 29.16667% - } - - .el-col-xl-push-7 { - position: relative; - left: 29.16667% - } - - .el-col-xl-8 { - width: 33.33333% - } - - .el-col-xl-offset-8 { - margin-left: 33.33333% - } - - .el-col-xl-pull-8 { - position: relative; - right: 33.33333% - } - - .el-col-xl-push-8 { - position: relative; - left: 33.33333% - } - - .el-col-xl-9 { - width: 37.5% - } - - .el-col-xl-offset-9 { - margin-left: 37.5% - } - - .el-col-xl-pull-9 { - position: relative; - right: 37.5% - } - - .el-col-xl-push-9 { - position: relative; - left: 37.5% - } - - .el-col-xl-10 { - width: 41.66667% - } - - .el-col-xl-offset-10 { - margin-left: 41.66667% - } - - .el-col-xl-pull-10 { - position: relative; - right: 41.66667% - } - - .el-col-xl-push-10 { - position: relative; - left: 41.66667% - } - - .el-col-xl-11 { - width: 45.83333% - } - - .el-col-xl-offset-11 { - margin-left: 45.83333% - } - - .el-col-xl-pull-11 { - position: relative; - right: 45.83333% - } - - .el-col-xl-push-11 { - position: relative; - left: 45.83333% - } - - .el-col-xl-12 { - width: 50% - } - - .el-col-xl-offset-12 { - margin-left: 50% - } - - .el-col-xl-pull-12 { - position: relative; - right: 50% - } - - .el-col-xl-push-12 { - position: relative; - left: 50% - } - - .el-col-xl-13 { - width: 54.16667% - } - - .el-col-xl-offset-13 { - margin-left: 54.16667% - } - - .el-col-xl-pull-13 { - position: relative; - right: 54.16667% - } - - .el-col-xl-push-13 { - position: relative; - left: 54.16667% - } - - .el-col-xl-14 { - width: 58.33333% - } - - .el-col-xl-offset-14 { - margin-left: 58.33333% - } - - .el-col-xl-pull-14 { - position: relative; - right: 58.33333% - } - - .el-col-xl-push-14 { - position: relative; - left: 58.33333% - } - - .el-col-xl-15 { - width: 62.5% - } - - .el-col-xl-offset-15 { - margin-left: 62.5% - } - - .el-col-xl-pull-15 { - position: relative; - right: 62.5% - } - - .el-col-xl-push-15 { - position: relative; - left: 62.5% - } - - .el-col-xl-16 { - width: 66.66667% - } - - .el-col-xl-offset-16 { - margin-left: 66.66667% - } - - .el-col-xl-pull-16 { - position: relative; - right: 66.66667% - } - - .el-col-xl-push-16 { - position: relative; - left: 66.66667% - } - - .el-col-xl-17 { - width: 70.83333% - } - - .el-col-xl-offset-17 { - margin-left: 70.83333% - } - - .el-col-xl-pull-17 { - position: relative; - right: 70.83333% - } - - .el-col-xl-push-17 { - position: relative; - left: 70.83333% - } - - .el-col-xl-18 { - width: 75% - } - - .el-col-xl-offset-18 { - margin-left: 75% - } - - .el-col-xl-pull-18 { - position: relative; - right: 75% - } - - .el-col-xl-push-18 { - position: relative; - left: 75% - } - - .el-col-xl-19 { - width: 79.16667% - } - - .el-col-xl-offset-19 { - margin-left: 79.16667% - } - - .el-col-xl-pull-19 { - position: relative; - right: 79.16667% - } - - .el-col-xl-push-19 { - position: relative; - left: 79.16667% - } - - .el-col-xl-20 { - width: 83.33333% - } - - .el-col-xl-offset-20 { - margin-left: 83.33333% - } - - .el-col-xl-pull-20 { - position: relative; - right: 83.33333% - } - - .el-col-xl-push-20 { - position: relative; - left: 83.33333% - } - - .el-col-xl-21 { - width: 87.5% - } - - .el-col-xl-offset-21 { - margin-left: 87.5% - } - - .el-col-xl-pull-21 { - position: relative; - right: 87.5% - } - - .el-col-xl-push-21 { - position: relative; - left: 87.5% - } - - .el-col-xl-22 { - width: 91.66667% - } - - .el-col-xl-offset-22 { - margin-left: 91.66667% - } - - .el-col-xl-pull-22 { - position: relative; - right: 91.66667% - } - - .el-col-xl-push-22 { - position: relative; - left: 91.66667% - } - - .el-col-xl-23 { - width: 95.83333% - } - - .el-col-xl-offset-23 { - margin-left: 95.83333% - } - - .el-col-xl-pull-23 { - position: relative; - right: 95.83333% - } - - .el-col-xl-push-23 { - position: relative; - left: 95.83333% - } - - .el-col-xl-24 { - width: 100% - } - - .el-col-xl-offset-24 { - margin-left: 100% - } - - .el-col-xl-pull-24 { - position: relative; - right: 100% - } - - .el-col-xl-push-24 { - position: relative; - left: 100% - } -} - -.el-progress { - position: relative; - line-height: 1 -} - -.el-progress__text { - font-size: 14px; - color: #606266; - display: inline-block; - vertical-align: middle; - margin-left: 10px; - line-height: 1 -} - -.el-progress__text i { - vertical-align: middle; - display: block -} - -.el-progress--circle, -.el-progress--dashboard { - display: inline-block -} - -.el-progress--circle .el-progress__text, -.el-progress--dashboard .el-progress__text { - position: absolute; - top: 50%; - left: 0; - width: 100%; - text-align: center; - margin: 0; - -webkit-transform: translate(0, -50%); - transform: translate(0, -50%) -} - -.el-progress--circle .el-progress__text i, -.el-progress--dashboard .el-progress__text i { - vertical-align: middle; - display: inline-block -} - -.el-progress--without-text .el-progress__text { - display: none -} - -.el-progress--without-text .el-progress-bar { - padding-right: 0; - margin-right: 0; - display: block -} - -.el-progress--text-inside .el-progress-bar { - padding-right: 0; - margin-right: 0 -} - -.el-progress.is-success .el-progress-bar__inner { - background-color: #0daf49 -} - -.el-progress.is-success .el-progress__text { - color: #0daf49 -} - -.el-progress.is-warning .el-progress-bar__inner { - background-color: #f08614 -} - -.el-progress.is-warning .el-progress__text { - color: #f08614 -} - -.el-progress.is-exception .el-progress-bar__inner { - background-color: #ff4d4f -} - -.el-progress.is-exception .el-progress__text { - color: #ff4d4f -} - -.el-progress-bar { - padding-right: 50px; - display: inline-block; - vertical-align: middle; - width: 100%; - margin-right: -55px; - -webkit-box-sizing: border-box; - box-sizing: border-box -} - -.el-progress-bar__outer { - height: 6px; - border-radius: 100px; - background-color: #ebeef5; - overflow: hidden; - position: relative; - vertical-align: middle -} - -.el-progress-bar__inner { - position: absolute; - left: 0; - top: 0; - height: 100%; - background-color: #006aff; - text-align: right; - border-radius: 100px; - line-height: 1; - white-space: nowrap; - -webkit-transition: width .6s ease; - transition: width .6s ease -} - -.el-progress-bar__inner::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle -} - -.el-progress-bar__innerText { - display: inline-block; - vertical-align: middle; - color: #fff; - font-size: 12px; - margin: 0 5px -} - -@-webkit-keyframes progress { - 0% { - background-position: 0 0 - } - - 100% { - background-position: 32px 0 - } -} - -@keyframes progress { - 0% { - background-position: 0 0 - } - - 100% { - background-position: 32px 0 - } -} - -.el-upload { - display: inline-block; - text-align: center; - cursor: pointer; - outline: 0 -} - -.el-upload__input { - display: none -} - -.el-upload__tip { - font-size: 12px; - color: #606266; - margin-top: 7px -} - -.el-upload iframe { - position: absolute; - z-index: -1; - top: 0; - left: 0; - opacity: 0 -} - -.el-upload--picture-card { - background-color: #fbfdff; - border: 1px dashed #c0ccda; - border-radius: 6px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 148px; - height: 148px; - cursor: pointer; - line-height: 146px; - vertical-align: top -} - -.el-upload--picture-card i { - font-size: 28px; - color: #8c939d -} - -.el-upload--picture-card:hover { - border-color: #006aff; - color: #006aff -} - -.el-upload:focus { - border-color: #006aff; - color: #006aff -} - -.el-upload:focus .el-upload-dragger { - border-color: #006aff -} - -.el-upload-dragger { - background-color: #fff; - border: 1px dashed #d9d9d9; - border-radius: 6px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 360px; - height: 180px; - text-align: center; - cursor: pointer; - position: relative; - overflow: hidden -} - -.el-upload-dragger .el-icon-upload { - font-size: 67px; - color: #babdc2; - margin: 40px 0 16px; - line-height: 50px -} - -.el-upload-dragger+.el-upload__tip { - text-align: center -} - -.el-upload-dragger~.el-upload__files { - border-top: 1px solid #dfe2e6; - margin-top: 7px; - padding-top: 5px -} - -.el-upload-dragger .el-upload__text { - color: #606266; - font-size: 14px; - text-align: center -} - -.el-upload-dragger .el-upload__text em { - color: #006aff; - font-style: normal -} - -.el-upload-dragger:hover { - border-color: #006aff -} - -.el-upload-dragger.is-dragover { - background-color: rgba(32, 159, 255, .06); - border: 2px dashed #006aff -} - -.el-upload-list { - margin: 0; - padding: 0; - list-style: none -} - -.el-upload-list__item { - -webkit-transition: all .5s cubic-bezier(.55, 0, .1, 1); - transition: all .5s cubic-bezier(.55, 0, .1, 1); - font-size: 14px; - color: #606266; - line-height: 1.8; - margin-top: 5px; - position: relative; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-radius: 4px; - width: 100% -} - -.el-upload-list__item .el-progress { - position: absolute; - top: 20px; - width: 100% -} - -.el-upload-list__item .el-progress__text { - position: absolute; - right: 0; - top: -13px -} - -.el-upload-list__item .el-progress-bar { - margin-right: 0; - padding-right: 0 -} - -.el-upload-list__item:first-child { - margin-top: 10px -} - -.el-upload-list__item .el-icon-upload-success { - color: #0daf49 -} - -.el-upload-list__item .el-icon-close { - display: none; - position: absolute; - top: 5px; - right: 5px; - cursor: pointer; - opacity: .75; - color: #606266 -} - -.el-upload-list__item .el-icon-close:hover { - opacity: 1 -} - -.el-upload-list__item .el-icon-close-tip { - display: none; - position: absolute; - top: 5px; - right: 5px; - font-size: 12px; - cursor: pointer; - opacity: 1; - color: #006aff -} - -.el-upload-list__item:hover { - background-color: #f5f7fa -} - -.el-upload-list__item:hover .el-icon-close { - display: inline-block -} - -.el-upload-list__item:hover .el-progress__text { - display: none -} - -.el-upload-list__item.is-success .el-upload-list__item-status-label { - display: block -} - -.el-upload-list__item.is-success .el-upload-list__item-name:focus, -.el-upload-list__item.is-success .el-upload-list__item-name:hover { - color: #006aff; - cursor: pointer -} - -.el-upload-list__item.is-success:focus:not(:hover) .el-icon-close-tip { - display: inline-block -} - -.el-upload-list__item.is-success:active, -.el-upload-list__item.is-success:not(.focusing):focus { - outline-width: 0 -} - -.el-upload-list__item.is-success:active .el-icon-close-tip, -.el-upload-list__item.is-success:not(.focusing):focus .el-icon-close-tip { - display: none -} - -.el-upload-list__item.is-success:focus .el-upload-list__item-status-label, -.el-upload-list__item.is-success:hover .el-upload-list__item-status-label { - display: none -} - -.el-upload-list.is-disabled .el-upload-list__item:hover .el-upload-list__item-status-label { - display: block -} - -.el-upload-list__item-name { - color: #606266; - display: block; - margin-right: 40px; - overflow: hidden; - padding-left: 4px; - text-overflow: ellipsis; - -webkit-transition: color .3s; - transition: color .3s; - white-space: nowrap -} - -.el-upload-list__item-name [class^=el-icon] { - height: 100%; - margin-right: 7px; - color: #1e2226; - line-height: inherit -} - -.el-upload-list__item-status-label { - position: absolute; - right: 5px; - top: 0; - line-height: inherit; - display: none -} - -.el-upload-list__item-delete { - position: absolute; - right: 10px; - top: 0; - font-size: 12px; - color: #606266; - display: none -} - -.el-upload-list__item-delete:hover { - color: #006aff -} - -.el-upload-list--picture-card { - margin: 0; - display: inline; - vertical-align: top -} - -.el-upload-list--picture-card .el-upload-list__item { - overflow: hidden; - background-color: #fff; - border: 1px solid #c0ccda; - border-radius: 6px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 148px; - height: 148px; - margin: 0 8px 8px 0; - display: inline-block -} - -.el-upload-list--picture-card .el-upload-list__item .el-icon-check, -.el-upload-list--picture-card .el-upload-list__item .el-icon-circle-check { - color: #fff -} - -.el-upload-list--picture-card .el-upload-list__item .el-icon-close { - display: none -} - -.el-upload-list--picture-card .el-upload-list__item:hover .el-upload-list__item-status-label { - display: none -} - -.el-upload-list--picture-card .el-upload-list__item:hover .el-progress__text { - display: block -} - -.el-upload-list--picture-card .el-upload-list__item-name { - display: none -} - -.el-upload-list--picture-card .el-upload-list__item-thumbnail { - width: 100%; - height: 100% -} - -.el-upload-list--picture-card .el-upload-list__item-status-label { - position: absolute; - right: -15px; - top: -6px; - width: 40px; - height: 24px; - background: #13ce66; - text-align: center; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2); - box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2) -} - -.el-upload-list--picture-card .el-upload-list__item-status-label i { - font-size: 12px; - margin-top: 11px; - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg) -} - -.el-upload-list--picture-card .el-upload-list__item-actions { - position: absolute; - width: 100%; - height: 100%; - left: 0; - top: 0; - cursor: default; - text-align: center; - color: #fff; - opacity: 0; - font-size: 20px; - background-color: rgba(0, 0, 0, .5); - -webkit-transition: opacity .3s; - transition: opacity .3s -} - -.el-upload-list--picture-card .el-upload-list__item-actions::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle -} - -.el-upload-list--picture-card .el-upload-list__item-actions span { - display: none; - cursor: pointer -} - -.el-upload-list--picture-card .el-upload-list__item-actions span+span { - margin-left: 15px -} - -.el-upload-list--picture-card .el-upload-list__item-actions .el-upload-list__item-delete { - position: static; - font-size: inherit; - color: inherit -} - -.el-upload-list--picture-card .el-upload-list__item-actions:hover { - opacity: 1 -} - -.el-upload-list--picture-card .el-upload-list__item-actions:hover span { - display: inline-block -} - -.el-upload-list--picture-card .el-progress { - top: 50%; - left: 50%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); - bottom: auto; - width: 126px -} - -.el-upload-list--picture-card .el-progress .el-progress__text { - top: 50% -} - -.el-upload-list--picture .el-upload-list__item { - overflow: hidden; - z-index: 0; - background-color: #fff; - border: 1px solid #c0ccda; - border-radius: 6px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - margin-top: 10px; - padding: 10px 10px 10px 90px; - height: 92px -} - -.el-upload-list--picture .el-upload-list__item .el-icon-check, -.el-upload-list--picture .el-upload-list__item .el-icon-circle-check { - color: #fff -} - -.el-upload-list--picture .el-upload-list__item:hover .el-upload-list__item-status-label { - background: 0 0; - -webkit-box-shadow: none; - box-shadow: none; - top: -2px; - right: -12px -} - -.el-upload-list--picture .el-upload-list__item:hover .el-progress__text { - display: block -} - -.el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name { - line-height: 70px; - margin-top: 0 -} - -.el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name i { - display: none -} - -.el-upload-list--picture .el-upload-list__item-thumbnail { - vertical-align: middle; - display: inline-block; - width: 70px; - height: 70px; - float: left; - position: relative; - z-index: 1; - margin-left: -80px; - background-color: #fff -} - -.el-upload-list--picture .el-upload-list__item-name { - display: block; - margin-top: 20px -} - -.el-upload-list--picture .el-upload-list__item-name i { - font-size: 70px; - line-height: 1; - position: absolute; - left: 9px; - top: 10px -} - -.el-upload-list--picture .el-upload-list__item-status-label { - position: absolute; - right: -17px; - top: -7px; - width: 46px; - height: 26px; - background: #13ce66; - text-align: center; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - -webkit-box-shadow: 0 1px 1px #ccc; - box-shadow: 0 1px 1px #ccc -} - -.el-upload-list--picture .el-upload-list__item-status-label i { - font-size: 12px; - margin-top: 12px; - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg) -} - -.el-upload-list--picture .el-progress { - position: relative; - top: -7px -} - -.el-upload-cover { - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - overflow: hidden; - z-index: 10; - cursor: default -} - -.el-upload-cover::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle -} - -.el-upload-cover img { - display: block; - width: 100%; - height: 100% -} - -.el-upload-cover__label { - position: absolute; - right: -15px; - top: -6px; - width: 40px; - height: 24px; - background: #13ce66; - text-align: center; - -webkit-transform: rotate(45deg); - transform: rotate(45deg); - -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2); - box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2) -} - -.el-upload-cover__label i { - font-size: 12px; - margin-top: 11px; - -webkit-transform: rotate(-45deg); - transform: rotate(-45deg); - color: #fff -} - -.el-upload-cover__progress { - display: inline-block; - vertical-align: middle; - position: static; - width: 243px -} - -.el-upload-cover__progress+.el-upload__inner { - opacity: 0 -} - -.el-upload-cover__content { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100% -} - -.el-upload-cover__interact { - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(0, 0, 0, .72); - text-align: center -} - -.el-upload-cover__interact .btn { - display: inline-block; - color: #fff; - font-size: 14px; - cursor: pointer; - vertical-align: middle; - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - margin-top: 60px -} - -.el-upload-cover__interact .btn i { - margin-top: 0 -} - -.el-upload-cover__interact .btn span { - opacity: 0; - -webkit-transition: opacity .15s linear; - transition: opacity .15s linear -} - -.el-upload-cover__interact .btn:not(:first-child) { - margin-left: 35px -} - -.el-upload-cover__interact .btn:hover { - -webkit-transform: translateY(-13px); - transform: translateY(-13px) -} - -.el-upload-cover__interact .btn:hover span { - opacity: 1 -} - -.el-upload-cover__interact .btn i { - color: #fff; - display: block; - font-size: 24px; - line-height: inherit; - margin: 0 auto 5px -} - -.el-upload-cover__title { - position: absolute; - bottom: 0; - left: 0; - background-color: #fff; - height: 36px; - width: 100%; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - font-weight: 400; - text-align: left; - padding: 0 10px; - margin: 0; - line-height: 36px; - font-size: 14px; - color: #1e2226 -} - -.el-upload-cover+.el-upload__inner { - opacity: 0; - position: relative; - z-index: 1 -} + .el-col-lg-offset-17 { + margin-left: 70.83333% + } -.el-progress { - position: relative; - line-height: 1 -} + .el-col-lg-pull-17 { + position: relative; + right: 70.83333% + } -.el-progress__text { - font-size: 14px; - color: #606266; - display: inline-block; - vertical-align: middle; - margin-left: 10px; - line-height: 1 -} + .el-col-lg-push-17 { + position: relative; + left: 70.83333% + } -.el-progress__text i { - vertical-align: middle; - display: block -} + .el-col-lg-18 { + width: 75% + } -.el-progress--circle, -.el-progress--dashboard { - display: inline-block -} + .el-col-lg-offset-18 { + margin-left: 75% + } -.el-progress--circle .el-progress__text, -.el-progress--dashboard .el-progress__text { - position: absolute; - top: 50%; - left: 0; - width: 100%; - text-align: center; - margin: 0; - -webkit-transform: translate(0, -50%); - transform: translate(0, -50%) -} + .el-col-lg-pull-18 { + position: relative; + right: 75% + } -.el-progress--circle .el-progress__text i, -.el-progress--dashboard .el-progress__text i { - vertical-align: middle; - display: inline-block -} + .el-col-lg-push-18 { + position: relative; + left: 75% + } -.el-progress--without-text .el-progress__text { - display: none -} + .el-col-lg-19 { + width: 79.16667% + } -.el-progress--without-text .el-progress-bar { - padding-right: 0; - margin-right: 0; - display: block -} + .el-col-lg-offset-19 { + margin-left: 79.16667% + } -.el-progress--text-inside .el-progress-bar { - padding-right: 0; - margin-right: 0 -} + .el-col-lg-pull-19 { + position: relative; + right: 79.16667% + } -.el-progress.is-success .el-progress-bar__inner { - background-color: #0daf49 -} + .el-col-lg-push-19 { + position: relative; + left: 79.16667% + } -.el-progress.is-success .el-progress__text { - color: #0daf49 -} + .el-col-lg-20 { + width: 83.33333% + } -.el-progress.is-warning .el-progress-bar__inner { - background-color: #f08614 -} + .el-col-lg-offset-20 { + margin-left: 83.33333% + } -.el-progress.is-warning .el-progress__text { - color: #f08614 -} + .el-col-lg-pull-20 { + position: relative; + right: 83.33333% + } -.el-progress.is-exception .el-progress-bar__inner { - background-color: #ff4d4f -} + .el-col-lg-push-20 { + position: relative; + left: 83.33333% + } -.el-progress.is-exception .el-progress__text { - color: #ff4d4f -} + .el-col-lg-21 { + width: 87.5% + } -.el-progress-bar { - padding-right: 50px; - display: inline-block; - vertical-align: middle; - width: 100%; - margin-right: -55px; - -webkit-box-sizing: border-box; - box-sizing: border-box -} + .el-col-lg-offset-21 { + margin-left: 87.5% + } -.el-progress-bar__outer { - height: 6px; - border-radius: 100px; - background-color: #ebeef5; - overflow: hidden; - position: relative; - vertical-align: middle -} + .el-col-lg-pull-21 { + position: relative; + right: 87.5% + } -.el-progress-bar__inner { - position: absolute; - left: 0; - top: 0; - height: 100%; - background-color: #006aff; - text-align: right; - border-radius: 100px; - line-height: 1; - white-space: nowrap; - -webkit-transition: width .6s ease; - transition: width .6s ease -} + .el-col-lg-push-21 { + position: relative; + left: 87.5% + } -.el-progress-bar__inner::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle -} + .el-col-lg-22 { + width: 91.66667% + } -.el-progress-bar__innerText { - display: inline-block; - vertical-align: middle; - color: #fff; - font-size: 12px; - margin: 0 5px -} + .el-col-lg-offset-22 { + margin-left: 91.66667% + } -@keyframes progress { - 0% { - background-position: 0 0 + .el-col-lg-pull-22 { + position: relative; + right: 91.66667% } - 100% { - background-position: 32px 0 + .el-col-lg-push-22 { + position: relative; + left: 91.66667% } -} -.el-time-spinner { - width: 100%; - white-space: nowrap -} + .el-col-lg-23 { + width: 95.83333% + } -.el-spinner { - display: inline-block; - vertical-align: middle -} + .el-col-lg-offset-23 { + margin-left: 95.83333% + } -.el-spinner-inner { - -webkit-animation: rotate 2s linear infinite; - animation: rotate 2s linear infinite; - width: 50px; - height: 50px -} + .el-col-lg-pull-23 { + position: relative; + right: 95.83333% + } -.el-spinner-inner .path { - stroke: #ececec; - stroke-linecap: round; - -webkit-animation: dash 1.5s ease-in-out infinite; - animation: dash 1.5s ease-in-out infinite + .el-col-lg-push-23 { + position: relative; + left: 95.83333% + } + + .el-col-lg-24 { + width: 100% + } + + .el-col-lg-offset-24 { + margin-left: 100% + } + + .el-col-lg-pull-24 { + position: relative; + right: 100% + } + + .el-col-lg-push-24 { + position: relative; + left: 100% + } } -@-webkit-keyframes rotate { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg) +@media only screen and (min-width:1920px) { + .el-col-xl-0 { + display: none } -} -@keyframes rotate { - 100% { - -webkit-transform: rotate(360deg); - transform: rotate(360deg) + .el-col-xl-0 { + width: 0% } -} -@-webkit-keyframes dash { - 0% { - stroke-dasharray: 1, 150; - stroke-dashoffset: 0 + .el-col-xl-offset-0 { + margin-left: 0 } - 50% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -35 + .el-col-xl-pull-0 { + position: relative; + right: 0 } - 100% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -124 + .el-col-xl-push-0 { + position: relative; + left: 0 } -} -@keyframes dash { - 0% { - stroke-dasharray: 1, 150; - stroke-dashoffset: 0 + .el-col-xl-1 { + width: 4.16667% } - 50% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -35 + .el-col-xl-offset-1 { + margin-left: 4.16667% } - 100% { - stroke-dasharray: 90, 150; - stroke-dashoffset: -124 + .el-col-xl-pull-1 { + position: relative; + right: 4.16667% } -} -.el-message { - min-width: 380px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-radius: 4px; - border-width: 1px; - border-style: solid; - border-color: #ebeef5; - position: fixed; - left: 50%; - top: 20px; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - background-color: #edf2fc; - -webkit-transition: opacity .3s, top .4s, -webkit-transform .4s; - transition: opacity .3s, top .4s, -webkit-transform .4s; - transition: opacity .3s, transform .4s, top .4s; - transition: opacity .3s, transform .4s, top .4s, -webkit-transform .4s; - overflow: hidden; - padding: 15px 15px 15px 20px; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center -} + .el-col-xl-push-1 { + position: relative; + left: 4.16667% + } -.el-message.is-center { - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center -} + .el-col-xl-2 { + width: 8.33333% + } -.el-message.is-closable .el-message__content { - padding-right: 16px -} + .el-col-xl-offset-2 { + margin-left: 8.33333% + } -.el-message p { - margin: 0 -} + .el-col-xl-pull-2 { + position: relative; + right: 8.33333% + } -.el-message--info .el-message__content { - color: #909399 -} + .el-col-xl-push-2 { + position: relative; + left: 8.33333% + } -.el-message--success { - background-color: #e7f7ed; - border-color: #cfefdb -} + .el-col-xl-3 { + width: 12.5% + } -.el-message--success .el-message__content { - color: #0daf49 -} + .el-col-xl-offset-3 { + margin-left: 12.5% + } -.el-message--warning { - background-color: #fef3e8; - border-color: #fce7d0 -} + .el-col-xl-pull-3 { + position: relative; + right: 12.5% + } -.el-message--warning .el-message__content { - color: #f08614 -} + .el-col-xl-push-3 { + position: relative; + left: 12.5% + } -.el-message--error { - background-color: #ffeded; - border-color: #ffdbdc -} + .el-col-xl-4 { + width: 16.66667% + } -.el-message--error .el-message__content { - color: #ff4d4f -} + .el-col-xl-offset-4 { + margin-left: 16.66667% + } -.el-message__icon { - margin-right: 10px -} + .el-col-xl-pull-4 { + position: relative; + right: 16.66667% + } -.el-message__content { - padding: 0; - font-size: 14px; - line-height: 1 -} + .el-col-xl-push-4 { + position: relative; + left: 16.66667% + } -.el-message__content:focus { - outline-width: 0 -} + .el-col-xl-5 { + width: 20.83333% + } -.el-message__closeBtn { - position: absolute; - top: 50%; - right: 15px; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - cursor: pointer; - color: #babdc2; - font-size: 16px -} + .el-col-xl-offset-5 { + margin-left: 20.83333% + } -.el-message__closeBtn:focus { - outline-width: 0 -} + .el-col-xl-pull-5 { + position: relative; + right: 20.83333% + } -.el-message__closeBtn:hover { - color: #1e2226 -} + .el-col-xl-push-5 { + position: relative; + left: 20.83333% + } -.el-message .el-icon-success { - color: #0daf49 -} + .el-col-xl-6 { + width: 25% + } -.el-message .el-icon-error { - color: #ff4d4f -} + .el-col-xl-offset-6 { + margin-left: 25% + } -.el-message .el-icon-info { - color: #909399 -} + .el-col-xl-pull-6 { + position: relative; + right: 25% + } -.el-message .el-icon-warning { - color: #f08614 -} + .el-col-xl-push-6 { + position: relative; + left: 25% + } -.el-message-fade-enter, -.el-message-fade-leave-active { - opacity: 0; - -webkit-transform: translate(-50%, -100%); - transform: translate(-50%, -100%) -} + .el-col-xl-7 { + width: 29.16667% + } -.el-badge { - position: relative; - vertical-align: middle; - display: inline-block -} + .el-col-xl-offset-7 { + margin-left: 29.16667% + } -.el-badge__content { - background-color: #ff4d4f; - border-radius: 10px; - color: #fff; - display: inline-block; - font-size: 12px; - height: 18px; - line-height: 18px; - padding: 0 6px; - text-align: center; - white-space: nowrap; - border: 1px solid #fff -} + .el-col-xl-pull-7 { + position: relative; + right: 29.16667% + } + + .el-col-xl-push-7 { + position: relative; + left: 29.16667% + } -.el-badge__content.is-fixed { - position: absolute; - top: 0; - right: 10px; - -webkit-transform: translateY(-50%) translateX(100%); - transform: translateY(-50%) translateX(100%) -} + .el-col-xl-8 { + width: 33.33333% + } -.el-badge__content.is-fixed.is-dot { - right: 5px -} + .el-col-xl-offset-8 { + margin-left: 33.33333% + } -.el-badge__content.is-dot { - height: 8px; - width: 8px; - padding: 0; - right: 0; - border-radius: 50% -} + .el-col-xl-pull-8 { + position: relative; + right: 33.33333% + } -.el-badge__content--primary { - background-color: #006aff -} + .el-col-xl-push-8 { + position: relative; + left: 33.33333% + } -.el-badge__content--success { - background-color: #0daf49 -} + .el-col-xl-9 { + width: 37.5% + } -.el-badge__content--warning { - background-color: #f08614 -} + .el-col-xl-offset-9 { + margin-left: 37.5% + } -.el-badge__content--info { - background-color: #909399 -} + .el-col-xl-pull-9 { + position: relative; + right: 37.5% + } -.el-badge__content--danger { - background-color: #ff4d4f -} + .el-col-xl-push-9 { + position: relative; + left: 37.5% + } -.el-card { - border-radius: 4px; - border: 1px solid #ebeef5; - background-color: #fff; - overflow: hidden; - color: #1e2226; - -webkit-transition: .3s; - transition: .3s -} + .el-col-xl-10 { + width: 41.66667% + } -.el-card.is-always-shadow { - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) -} + .el-col-xl-offset-10 { + margin-left: 41.66667% + } -.el-card.is-hover-shadow:focus, -.el-card.is-hover-shadow:hover { - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) -} + .el-col-xl-pull-10 { + position: relative; + right: 41.66667% + } -.el-card__header { - padding: 18px 20px; - border-bottom: 1px solid #ebeef5; - -webkit-box-sizing: border-box; - box-sizing: border-box -} + .el-col-xl-push-10 { + position: relative; + left: 41.66667% + } -.el-card__body { - padding: 20px -} + .el-col-xl-11 { + width: 45.83333% + } -.el-rate { - height: 20px; - line-height: 1 -} + .el-col-xl-offset-11 { + margin-left: 45.83333% + } -.el-rate:active, -.el-rate:focus { - outline-width: 0 -} + .el-col-xl-pull-11 { + position: relative; + right: 45.83333% + } -.el-rate__item { - display: inline-block; - position: relative; - font-size: 0; - vertical-align: middle -} + .el-col-xl-push-11 { + position: relative; + left: 45.83333% + } -.el-rate__icon { - position: relative; - display: inline-block; - font-size: 18px; - margin-right: 6px; - color: #babdc2; - -webkit-transition: .3s; - transition: .3s -} + .el-col-xl-12 { + width: 50% + } -.el-rate__icon.hover { - -webkit-transform: scale(1.15); - transform: scale(1.15) -} + .el-col-xl-offset-12 { + margin-left: 50% + } -.el-rate__icon .path2 { - position: absolute; - left: 0; - top: 0 -} + .el-col-xl-pull-12 { + position: relative; + right: 50% + } -.el-rate__decimal { - position: absolute; - top: 0; - left: 0; - display: inline-block; - overflow: hidden -} + .el-col-xl-push-12 { + position: relative; + left: 50% + } -.el-rate__text { - font-size: 14px; - vertical-align: middle -} + .el-col-xl-13 { + width: 54.16667% + } -.el-steps { - display: -webkit-box; - display: -ms-flexbox; - display: flex -} + .el-col-xl-offset-13 { + margin-left: 54.16667% + } -.el-steps--simple { - padding: 13px 8%; - border-radius: 4px; - background: #f5f7fa -} + .el-col-xl-pull-13 { + position: relative; + right: 54.16667% + } -.el-steps--horizontal { - white-space: nowrap -} + .el-col-xl-push-13 { + position: relative; + left: 54.16667% + } -.el-steps--vertical { - height: 100%; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-flow: column; - flex-flow: column -} + .el-col-xl-14 { + width: 58.33333% + } -.el-step { - position: relative; - -ms-flex-negative: 1; - flex-shrink: 1 -} + .el-col-xl-offset-14 { + margin-left: 58.33333% + } -.el-step:last-of-type .el-step__line { - display: none -} + .el-col-xl-pull-14 { + position: relative; + right: 58.33333% + } -.el-step:last-of-type.is-flex { - -ms-flex-preferred-size: auto !important; - flex-basis: auto !important; - -ms-flex-negative: 0; - flex-shrink: 0; - -webkit-box-flex: 0; - -ms-flex-positive: 0; - flex-grow: 0 -} + .el-col-xl-push-14 { + position: relative; + left: 58.33333% + } -.el-step:last-of-type .el-step__description, -.el-step:last-of-type .el-step__main { - padding-right: 0 -} + .el-col-xl-15 { + width: 62.5% + } + + .el-col-xl-offset-15 { + margin-left: 62.5% + } + + .el-col-xl-pull-15 { + position: relative; + right: 62.5% + } -.el-step__head { - position: relative; - width: 100% -} + .el-col-xl-push-15 { + position: relative; + left: 62.5% + } -.el-step__head.is-process { - color: #1e2226; - border-color: #1e2226 -} + .el-col-xl-16 { + width: 66.66667% + } -.el-step__head.is-wait { - color: #babdc2; - border-color: #babdc2 -} + .el-col-xl-offset-16 { + margin-left: 66.66667% + } -.el-step__head.is-success { - color: #0daf49; - border-color: #0daf49 -} + .el-col-xl-pull-16 { + position: relative; + right: 66.66667% + } -.el-step__head.is-error { - color: #ff4d4f; - border-color: #ff4d4f -} + .el-col-xl-push-16 { + position: relative; + left: 66.66667% + } -.el-step__head.is-finish { - color: #006aff; - border-color: #006aff -} + .el-col-xl-17 { + width: 70.83333% + } -.el-step__icon { - position: relative; - z-index: 1; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - width: 24px; - height: 24px; - font-size: 14px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - background: #fff; - -webkit-transition: .15s ease-out; - transition: .15s ease-out -} + .el-col-xl-offset-17 { + margin-left: 70.83333% + } -.el-step__icon.is-text { - border-radius: 50%; - border: 2px solid; - border-color: inherit -} + .el-col-xl-pull-17 { + position: relative; + right: 70.83333% + } -.el-step__icon.is-icon { - width: 40px -} + .el-col-xl-push-17 { + position: relative; + left: 70.83333% + } -.el-step__icon-inner { - display: inline-block; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - text-align: center; - font-weight: 700; - line-height: 1; - color: inherit -} + .el-col-xl-18 { + width: 75% + } -.el-step__icon-inner[class*=el-icon]:not(.is-status) { - font-size: 25px; - font-weight: 400 -} + .el-col-xl-offset-18 { + margin-left: 75% + } -.el-step__icon-inner.is-status { - -webkit-transform: translateY(1px); - transform: translateY(1px) -} + .el-col-xl-pull-18 { + position: relative; + right: 75% + } -.el-step__line { - position: absolute; - border-color: inherit; - background-color: #babdc2 -} + .el-col-xl-push-18 { + position: relative; + left: 75% + } -.el-step__line-inner { - display: block; - border-width: 1px; - border-style: solid; - border-color: inherit; - -webkit-transition: .15s ease-out; - transition: .15s ease-out; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 0; - height: 0 -} + .el-col-xl-19 { + width: 79.16667% + } -.el-step__main { - white-space: normal; - text-align: left -} + .el-col-xl-offset-19 { + margin-left: 79.16667% + } -.el-step__title { - font-size: 16px; - line-height: 38px -} + .el-col-xl-pull-19 { + position: relative; + right: 79.16667% + } -.el-step__title.is-process { - font-weight: 700; - color: #1e2226 -} + .el-col-xl-push-19 { + position: relative; + left: 79.16667% + } -.el-step__title.is-wait { - color: #babdc2 -} + .el-col-xl-20 { + width: 83.33333% + } -.el-step__title.is-success { - color: #0daf49 -} + .el-col-xl-offset-20 { + margin-left: 83.33333% + } -.el-step__title.is-error { - color: #ff4d4f -} + .el-col-xl-pull-20 { + position: relative; + right: 83.33333% + } -.el-step__title.is-finish { - color: #006aff -} + .el-col-xl-push-20 { + position: relative; + left: 83.33333% + } -.el-step__description { - padding-right: 10%; - margin-top: -5px; - font-size: 12px; - line-height: 20px; - font-weight: 400 -} + .el-col-xl-21 { + width: 87.5% + } -.el-step__description.is-process { - color: #1e2226 -} + .el-col-xl-offset-21 { + margin-left: 87.5% + } -.el-step__description.is-wait { - color: #babdc2 -} + .el-col-xl-pull-21 { + position: relative; + right: 87.5% + } -.el-step__description.is-success { - color: #0daf49 -} + .el-col-xl-push-21 { + position: relative; + left: 87.5% + } -.el-step__description.is-error { - color: #ff4d4f -} + .el-col-xl-22 { + width: 91.66667% + } -.el-step__description.is-finish { - color: #006aff -} + .el-col-xl-offset-22 { + margin-left: 91.66667% + } -.el-step.is-horizontal { - display: inline-block -} + .el-col-xl-pull-22 { + position: relative; + right: 91.66667% + } -.el-step.is-horizontal .el-step__line { - height: 2px; - top: 11px; - left: 0; - right: 0 -} + .el-col-xl-push-22 { + position: relative; + left: 91.66667% + } -.el-step.is-vertical { - display: -webkit-box; - display: -ms-flexbox; - display: flex -} + .el-col-xl-23 { + width: 95.83333% + } + + .el-col-xl-offset-23 { + margin-left: 95.83333% + } -.el-step.is-vertical .el-step__head { - -webkit-box-flex: 0; - -ms-flex-positive: 0; - flex-grow: 0; - width: 24px -} + .el-col-xl-pull-23 { + position: relative; + right: 95.83333% + } -.el-step.is-vertical .el-step__main { - padding-left: 10px; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1 -} + .el-col-xl-push-23 { + position: relative; + left: 95.83333% + } -.el-step.is-vertical .el-step__title { - line-height: 24px; - padding-bottom: 8px -} + .el-col-xl-24 { + width: 100% + } -.el-step.is-vertical .el-step__line { - width: 2px; - top: 0; - bottom: 0; - left: 11px -} + .el-col-xl-offset-24 { + margin-left: 100% + } -.el-step.is-vertical .el-step__icon.is-icon { - width: 24px -} + .el-col-xl-pull-24 { + position: relative; + right: 100% + } -.el-step.is-center .el-step__head { - text-align: center + .el-col-xl-push-24 { + position: relative; + left: 100% + } } -.el-step.is-center .el-step__main { - text-align: center +.el-progress { + position: relative; + line-height: 1 } -.el-step.is-center .el-step__description { - padding-left: 20%; - padding-right: 20% +.el-progress__text { + font-size: 14px; + color: #606266; + display: inline-block; + vertical-align: middle; + margin-left: 10px; + line-height: 1 } -.el-step.is-center .el-step__line { - left: 50%; - right: -50% +.el-progress__text i { + vertical-align: middle; + display: block } -.el-step.is-simple { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center +.el-progress--circle, +.el-progress--dashboard { + display: inline-block } -.el-step.is-simple .el-step__head { - width: auto; - font-size: 0; - padding-right: 10px +.el-progress--circle .el-progress__text, +.el-progress--dashboard .el-progress__text { + position: absolute; + top: 50%; + left: 0; + width: 100%; + text-align: center; + margin: 0; + -webkit-transform: translate(0, -50%); + transform: translate(0, -50%) } -.el-step.is-simple .el-step__icon { - background: 0 0; - width: 16px; - height: 16px; - font-size: 12px +.el-progress--circle .el-progress__text i, +.el-progress--dashboard .el-progress__text i { + vertical-align: middle; + display: inline-block } -.el-step.is-simple .el-step__icon-inner[class*=el-icon]:not(.is-status) { - font-size: 18px +.el-progress--without-text .el-progress__text { + display: none } -.el-step.is-simple .el-step__icon-inner.is-status { - -webkit-transform: scale(.8) translateY(1px); - transform: scale(.8) translateY(1px) +.el-progress--without-text .el-progress-bar { + padding-right: 0; + margin-right: 0; + display: block } -.el-step.is-simple .el-step__main { - position: relative; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1 +.el-progress--text-inside .el-progress-bar { + padding-right: 0; + margin-right: 0 } -.el-step.is-simple .el-step__title { - font-size: 16px; - line-height: 20px +.el-progress.is-success .el-progress-bar__inner { + background-color: #0daf49 } -.el-step.is-simple:not(:last-of-type) .el-step__title { - max-width: 50%; - word-break: break-all +.el-progress.is-success .el-progress__text { + color: #0daf49 } -.el-step.is-simple .el-step__arrow { - -webkit-box-flex: 1; - -ms-flex-positive: 1; - flex-grow: 1; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center +.el-progress.is-warning .el-progress-bar__inner { + background-color: #f08614 } -.el-step.is-simple .el-step__arrow::after, -.el-step.is-simple .el-step__arrow::before { - content: ''; - display: inline-block; - position: absolute; - height: 15px; - width: 1px; - background: #babdc2 +.el-progress.is-warning .el-progress__text { + color: #f08614 } -.el-step.is-simple .el-step__arrow::before { - -webkit-transform: rotate(-45deg) translateY(-4px); - transform: rotate(-45deg) translateY(-4px); - -webkit-transform-origin: 0 0; - transform-origin: 0 0 +.el-progress.is-exception .el-progress-bar__inner { + background-color: #ff4d4f } -.el-step.is-simple .el-step__arrow::after { - -webkit-transform: rotate(45deg) translateY(4px); - transform: rotate(45deg) translateY(4px); - -webkit-transform-origin: 100% 100%; - transform-origin: 100% 100% +.el-progress.is-exception .el-progress__text { + color: #ff4d4f } -.el-step.is-simple:last-of-type .el-step__arrow { - display: none +.el-progress-bar { + padding-right: 50px; + display: inline-block; + vertical-align: middle; + width: 100%; + margin-right: -55px; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-carousel { - position: relative +.el-progress-bar__outer { + height: 6px; + border-radius: 100px; + background-color: #ebeef5; + overflow: hidden; + position: relative; + vertical-align: middle } -.el-carousel--horizontal { - overflow-x: hidden +.el-progress-bar__inner { + position: absolute; + left: 0; + top: 0; + height: 100%; + background-color: #006aff; + text-align: right; + border-radius: 100px; + line-height: 1; + white-space: nowrap; + -webkit-transition: width .6s ease; + transition: width .6s ease } -.el-carousel--vertical { - overflow-y: hidden +.el-progress-bar__inner::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-carousel__container { - position: relative; - height: 300px +.el-progress-bar__innerText { + display: inline-block; + vertical-align: middle; + color: #fff; + font-size: 12px; + margin: 0 5px } -.el-carousel__arrow { - border: none; - outline: 0; - padding: 0; - margin: 0; - height: 36px; - width: 36px; - cursor: pointer; - -webkit-transition: .3s; - transition: .3s; - border-radius: 50%; - background-color: rgba(31, 45, 61, .11); - color: #fff; - position: absolute; - top: 50%; - z-index: 10; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - text-align: center; - font-size: 12px +@-webkit-keyframes progress { + 0% { + background-position: 0 0 + } + + 100% { + background-position: 32px 0 + } } -.el-carousel__arrow--left { - left: 16px +@keyframes progress { + 0% { + background-position: 0 0 + } + + 100% { + background-position: 32px 0 + } } -.el-carousel__arrow--right { - right: 16px +.el-upload { + display: inline-block; + text-align: center; + cursor: pointer; + outline: 0 } -.el-carousel__arrow:hover { - background-color: rgba(31, 45, 61, .23) +.el-upload__input { + display: none } -.el-carousel__arrow i { - cursor: pointer +.el-upload__tip { + font-size: 12px; + color: #606266; + margin-top: 7px } -.el-carousel__indicators { +.el-upload iframe { position: absolute; - list-style: none; - margin: 0; - padding: 0; - z-index: 2 + z-index: -1; + top: 0; + left: 0; + opacity: 0 } -.el-carousel__indicators--horizontal { - bottom: 0; - left: 50%; - -webkit-transform: translateX(-50%); - transform: translateX(-50%) +.el-upload--picture-card { + background-color: #fbfdff; + border: 1px dashed #c0ccda; + border-radius: 6px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 148px; + height: 148px; + cursor: pointer; + line-height: 146px; + vertical-align: top } -.el-carousel__indicators--vertical { - right: 0; - top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%) +.el-upload--picture-card i { + font-size: 28px; + color: #8c939d } -.el-carousel__indicators--outside { - bottom: 26px; - text-align: center; - position: static; - -webkit-transform: none; - transform: none +.el-upload--picture-card:hover { + border-color: #006aff; + color: #006aff } -.el-carousel__indicators--outside .el-carousel__indicator:hover button { - opacity: .64 +.el-upload:focus { + border-color: #006aff; + color: #006aff } -.el-carousel__indicators--outside button { - background-color: #babdc2; - opacity: .24 +.el-upload:focus .el-upload-dragger { + border-color: #006aff } -.el-carousel__indicators--labels { - left: 0; - right: 0; - -webkit-transform: none; - transform: none; - text-align: center +.el-upload-dragger { + background-color: #fff; + border: 1px dashed #d9d9d9; + border-radius: 6px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 360px; + height: 180px; + text-align: center; + cursor: pointer; + position: relative; + overflow: hidden } -.el-carousel__indicators--labels .el-carousel__button { - height: auto; - width: auto; - padding: 2px 18px; - font-size: 12px +.el-upload-dragger .el-icon-upload { + font-size: 67px; + color: #babdc2; + margin: 40px 0 16px; + line-height: 50px } -.el-carousel__indicators--labels .el-carousel__indicator { - padding: 6px 4px +.el-upload-dragger+.el-upload__tip { + text-align: center } -.el-carousel__indicator { - background-color: transparent; - cursor: pointer +.el-upload-dragger~.el-upload__files { + border-top: 1px solid #dfe2e6; + margin-top: 7px; + padding-top: 5px } -.el-carousel__indicator:hover button { - opacity: .72 +.el-upload-dragger .el-upload__text { + color: #606266; + font-size: 14px; + text-align: center } -.el-carousel__indicator--horizontal { - display: inline-block; - padding: 12px 4px +.el-upload-dragger .el-upload__text em { + color: #006aff; + font-style: normal } -.el-carousel__indicator--vertical { - padding: 4px 12px +.el-upload-dragger:hover { + border-color: #006aff } -.el-carousel__indicator--vertical .el-carousel__button { - width: 2px; - height: 15px +.el-upload-dragger.is-dragover { + background-color: rgba(32, 159, 255, .06); + border: 2px dashed #006aff } -.el-carousel__indicator.is-active button { - opacity: 1 +.el-upload-list { + margin: 0; + padding: 0; + list-style: none } -.el-carousel__button { - display: block; - opacity: .48; - width: 30px; - height: 2px; - background-color: #fff; - border: none; - outline: 0; - padding: 0; - margin: 0; - cursor: pointer; - -webkit-transition: .3s; - transition: .3s +.el-upload-list__item { + -webkit-transition: all .5s cubic-bezier(.55, 0, .1, 1); + transition: all .5s cubic-bezier(.55, 0, .1, 1); + font-size: 14px; + color: #606266; + line-height: 1.8; + margin-top: 5px; + position: relative; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-radius: 4px; + width: 100% } -.carousel-arrow-left-enter, -.carousel-arrow-left-leave-active { - -webkit-transform: translateY(-50%) translateX(-10px); - transform: translateY(-50%) translateX(-10px); - opacity: 0 +.el-upload-list__item .el-progress { + position: absolute; + top: 20px; + width: 100% } -.carousel-arrow-right-enter, -.carousel-arrow-right-leave-active { - -webkit-transform: translateY(-50%) translateX(10px); - transform: translateY(-50%) translateX(10px); - opacity: 0 +.el-upload-list__item .el-progress__text { + position: absolute; + right: 0; + top: -13px } -.el-scrollbar { - overflow: hidden; - position: relative +.el-upload-list__item .el-progress-bar { + margin-right: 0; + padding-right: 0 } -.el-scrollbar:active>.el-scrollbar__bar, -.el-scrollbar:focus>.el-scrollbar__bar, -.el-scrollbar:hover>.el-scrollbar__bar { - opacity: 1; - -webkit-transition: opacity 340ms ease-out; - transition: opacity 340ms ease-out +.el-upload-list__item:first-child { + margin-top: 10px } -.el-scrollbar__wrap { - overflow: scroll; - height: 100% +.el-upload-list__item .el-icon-upload-success { + color: #0daf49 } -.el-scrollbar__wrap--hidden-default { - scrollbar-width: none +.el-upload-list__item .el-icon-close { + display: none; + position: absolute; + top: 5px; + right: 5px; + cursor: pointer; + opacity: .75; + color: #606266 } -.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { - width: 0; - height: 0 +.el-upload-list__item .el-icon-close:hover { + opacity: 1 } -.el-scrollbar__thumb { - position: relative; - display: block; - width: 0; - height: 0; +.el-upload-list__item .el-icon-close-tip { + display: none; + position: absolute; + top: 5px; + right: 5px; + font-size: 12px; cursor: pointer; - border-radius: inherit; - background-color: rgba(30, 34, 38, .3); - -webkit-transition: .3s background-color; - transition: .3s background-color + opacity: 1; + color: #006aff } -.el-scrollbar__thumb:hover { - background-color: rgba(30, 34, 38, .5) +.el-upload-list__item:hover { + background-color: #f5f7fa } - -.el-scrollbar__bar { - position: absolute; - right: 2px; - bottom: 2px; - z-index: 1; - border-radius: 4px; - opacity: 0; - -webkit-transition: opacity 120ms ease-out; - transition: opacity 120ms ease-out + +.el-upload-list__item:hover .el-icon-close { + display: inline-block } -.el-scrollbar__bar.is-vertical { - width: 6px; - top: 2px +.el-upload-list__item:hover .el-progress__text { + display: none } -.el-scrollbar__bar.is-vertical>div { - width: 100% +.el-upload-list__item.is-success .el-upload-list__item-status-label { + display: block } -.el-scrollbar__bar.is-horizontal { - height: 6px; - left: 2px +.el-upload-list__item.is-success .el-upload-list__item-name:focus, +.el-upload-list__item.is-success .el-upload-list__item-name:hover { + color: #006aff; + cursor: pointer } -.el-scrollbar__bar.is-horizontal>div { - height: 100% +.el-upload-list__item.is-success:focus:not(:hover) .el-icon-close-tip { + display: inline-block } -.el-carousel__item { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - display: inline-block; - overflow: hidden; - z-index: 0 +.el-upload-list__item.is-success:active, +.el-upload-list__item.is-success:not(.focusing):focus { + outline-width: 0 } -.el-carousel__item.is-active { - z-index: 2 +.el-upload-list__item.is-success:active .el-icon-close-tip, +.el-upload-list__item.is-success:not(.focusing):focus .el-icon-close-tip { + display: none } -.el-carousel__item.is-animating { - -webkit-transition: -webkit-transform .4s ease-in-out; - transition: -webkit-transform .4s ease-in-out; - transition: transform .4s ease-in-out; - transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out +.el-upload-list__item.is-success:focus .el-upload-list__item-status-label, +.el-upload-list__item.is-success:hover .el-upload-list__item-status-label { + display: none } -.el-carousel__item--card { - width: 50%; - -webkit-transition: -webkit-transform .4s ease-in-out; - transition: -webkit-transform .4s ease-in-out; - transition: transform .4s ease-in-out; - transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out +.el-upload-list.is-disabled .el-upload-list__item:hover .el-upload-list__item-status-label { + display: block } -.el-carousel__item--card.is-in-stage { - cursor: pointer; - z-index: 1 +.el-upload-list__item-name { + color: #606266; + display: block; + margin-right: 40px; + overflow: hidden; + padding-left: 4px; + text-overflow: ellipsis; + -webkit-transition: color .3s; + transition: color .3s; + white-space: nowrap } -.el-carousel__item--card.is-in-stage.is-hover .el-carousel__mask, -.el-carousel__item--card.is-in-stage:hover .el-carousel__mask { - opacity: .12 +.el-upload-list__item-name [class^=el-icon] { + height: 100%; + margin-right: 7px; + color: #1e2226; + line-height: inherit } -.el-carousel__item--card.is-active { - z-index: 2 +.el-upload-list__item-status-label { + position: absolute; + right: 5px; + top: 0; + line-height: inherit; + display: none } -.el-carousel__mask { +.el-upload-list__item-delete { position: absolute; - width: 100%; - height: 100%; + right: 10px; top: 0; - left: 0; - background-color: #fff; - opacity: .24; - -webkit-transition: .2s; - transition: .2s + font-size: 12px; + color: #606266; + display: none } -.fade-in-linear-enter-active, -.fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-upload-list__item-delete:hover { + color: #006aff } -.fade-in-linear-enter, -.fade-in-linear-leave, -.fade-in-linear-leave-active { - opacity: 0 +.el-upload-list--picture-card { + margin: 0; + display: inline; + vertical-align: top } -.el-fade-in-linear-enter-active, -.el-fade-in-linear-leave-active { - -webkit-transition: opacity .2s linear; - transition: opacity .2s linear +.el-upload-list--picture-card .el-upload-list__item { + overflow: hidden; + background-color: #fff; + border: 1px solid #c0ccda; + border-radius: 6px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 148px; + height: 148px; + margin: 0 8px 8px 0; + display: inline-block } -.el-fade-in-linear-enter, -.el-fade-in-linear-leave, -.el-fade-in-linear-leave-active { - opacity: 0 +.el-upload-list--picture-card .el-upload-list__item .el-icon-check, +.el-upload-list--picture-card .el-upload-list__item .el-icon-circle-check { + color: #fff } -.el-fade-in-enter-active, -.el-fade-in-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-upload-list--picture-card .el-upload-list__item .el-icon-close { + display: none } -.el-fade-in-enter, -.el-fade-in-leave-active { - opacity: 0 +.el-upload-list--picture-card .el-upload-list__item:hover .el-upload-list__item-status-label { + display: none } -.el-zoom-in-center-enter-active, -.el-zoom-in-center-leave-active { - -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); - transition: all .3s cubic-bezier(.55, 0, .1, 1) +.el-upload-list--picture-card .el-upload-list__item:hover .el-progress__text { + display: block } -.el-zoom-in-center-enter, -.el-zoom-in-center-leave-active { - opacity: 0; - -webkit-transform: scaleX(0); - transform: scaleX(0) +.el-upload-list--picture-card .el-upload-list__item-name { + display: none } -.el-zoom-in-top-enter-active, -.el-zoom-in-top-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center top; - transform-origin: center top +.el-upload-list--picture-card .el-upload-list__item-thumbnail { + width: 100%; + height: 100% } -.el-zoom-in-top-enter, -.el-zoom-in-top-leave-active { - opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) +.el-upload-list--picture-card .el-upload-list__item-status-label { + position: absolute; + right: -15px; + top: -6px; + width: 40px; + height: 24px; + background: #13ce66; + text-align: center; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2); + box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2) } -.el-zoom-in-bottom-enter-active, -.el-zoom-in-bottom-leave-active { - opacity: 1; - -webkit-transform: scaleY(1); - transform: scaleY(1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: center bottom; - transform-origin: center bottom +.el-upload-list--picture-card .el-upload-list__item-status-label i { + font-size: 12px; + margin-top: 11px; + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg) } -.el-zoom-in-bottom-enter, -.el-zoom-in-bottom-leave-active { +.el-upload-list--picture-card .el-upload-list__item-actions { + position: absolute; + width: 100%; + height: 100%; + left: 0; + top: 0; + cursor: default; + text-align: center; + color: #fff; opacity: 0; - -webkit-transform: scaleY(0); - transform: scaleY(0) + font-size: 20px; + background-color: rgba(0, 0, 0, .5); + -webkit-transition: opacity .3s; + transition: opacity .3s } -.el-zoom-in-left-enter-active, -.el-zoom-in-left-leave-active { - opacity: 1; - -webkit-transform: scale(1, 1); - transform: scale(1, 1); - -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); - transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); - -webkit-transform-origin: top left; - transform-origin: top left +.el-upload-list--picture-card .el-upload-list__item-actions::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-zoom-in-left-enter, -.el-zoom-in-left-leave-active { - opacity: 0; - -webkit-transform: scale(.45, .45); - transform: scale(.45, .45) +.el-upload-list--picture-card .el-upload-list__item-actions span { + display: none; + cursor: pointer +} + +.el-upload-list--picture-card .el-upload-list__item-actions span+span { + margin-left: 15px +} + +.el-upload-list--picture-card .el-upload-list__item-actions .el-upload-list__item-delete { + position: static; + font-size: inherit; + color: inherit } -.collapse-transition { - -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; - transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out +.el-upload-list--picture-card .el-upload-list__item-actions:hover { + opacity: 1 } -.horizontal-collapse-transition { - -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; - transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out +.el-upload-list--picture-card .el-upload-list__item-actions:hover span { + display: inline-block } -.el-list-enter-active, -.el-list-leave-active { - -webkit-transition: all 1s; - transition: all 1s +.el-upload-list--picture-card .el-progress { + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + bottom: auto; + width: 126px } -.el-list-enter, -.el-list-leave-active { - opacity: 0; - -webkit-transform: translateY(-30px); - transform: translateY(-30px) +.el-upload-list--picture-card .el-progress .el-progress__text { + top: 50% } -.el-opacity-transition { - -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); - transition: opacity .3s cubic-bezier(.55, 0, .1, 1) +.el-upload-list--picture .el-upload-list__item { + overflow: hidden; + z-index: 0; + background-color: #fff; + border: 1px solid #c0ccda; + border-radius: 6px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin-top: 10px; + padding: 10px 10px 10px 90px; + height: 92px } -.el-collapse { - border-top: 1px solid #ebeef5; - border-bottom: 1px solid #ebeef5 +.el-upload-list--picture .el-upload-list__item .el-icon-check, +.el-upload-list--picture .el-upload-list__item .el-icon-circle-check { + color: #fff } -.el-collapse-item.is-disabled .el-collapse-item__header { - color: #bbb; - cursor: not-allowed +.el-upload-list--picture .el-upload-list__item:hover .el-upload-list__item-status-label { + background: 0 0; + -webkit-box-shadow: none; + box-shadow: none; + top: -2px; + right: -12px } -.el-collapse-item__header { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 48px; - line-height: 48px; - background-color: #fff; - color: #1e2226; - cursor: pointer; - border-bottom: 1px solid #ebeef5; - font-size: 13px; - font-weight: 500; - -webkit-transition: border-bottom-color .3s; - transition: border-bottom-color .3s; - outline: 0 +.el-upload-list--picture .el-upload-list__item:hover .el-progress__text { + display: block } -.el-collapse-item__arrow { - margin: 0 8px 0 auto; - -webkit-transition: -webkit-transform .3s; - transition: -webkit-transform .3s; - transition: transform .3s; - transition: transform .3s, -webkit-transform .3s; - font-weight: 300 +.el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name { + line-height: 70px; + margin-top: 0 } -.el-collapse-item__arrow.is-active { - -webkit-transform: rotate(90deg); - transform: rotate(90deg) +.el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name i { + display: none } -.el-collapse-item__header.focusing:focus:not(:hover) { - color: #006aff +.el-upload-list--picture .el-upload-list__item-thumbnail { + vertical-align: middle; + display: inline-block; + width: 70px; + height: 70px; + float: left; + position: relative; + z-index: 1; + margin-left: -80px; + background-color: #fff } -.el-collapse-item__header.is-active { - border-bottom-color: transparent +.el-upload-list--picture .el-upload-list__item-name { + display: block; + margin-top: 20px } -.el-collapse-item__wrap { - will-change: height; - background-color: #fff; - overflow: hidden; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-bottom: 1px solid #ebeef5 +.el-upload-list--picture .el-upload-list__item-name i { + font-size: 70px; + line-height: 1; + position: absolute; + left: 9px; + top: 10px } -.el-collapse-item__content { - padding-bottom: 25px; - font-size: 13px; - color: #1e2226; - line-height: 1.769230769230769 +.el-upload-list--picture .el-upload-list__item-status-label { + position: absolute; + right: -17px; + top: -7px; + width: 46px; + height: 26px; + background: #13ce66; + text-align: center; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + -webkit-box-shadow: 0 1px 1px #ccc; + box-shadow: 0 1px 1px #ccc } -.el-collapse-item:last-child { - margin-bottom: -1px +.el-upload-list--picture .el-upload-list__item-status-label i { + font-size: 12px; + margin-top: 12px; + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg) } -.el-textarea { +.el-upload-list--picture .el-progress { position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px + top: -7px } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; +.el-upload-cover { + position: absolute; + left: 0; + top: 0; width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; - border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) + height: 100%; + overflow: hidden; + z-index: 10; + cursor: default } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-upload-cover::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-upload-cover img { + display: block; + width: 100%; + height: 100% } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-upload-cover__label { + position: absolute; + right: -15px; + top: -6px; + width: 40px; + height: 24px; + background: #13ce66; + text-align: center; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + -webkit-box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2); + box-shadow: 0 0 1pc 1px rgba(0, 0, 0, .2) } -.el-textarea__inner::placeholder { - color: #babdc2 +.el-upload-cover__label i { + font-size: 12px; + margin-top: 11px; + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + color: #fff } -.el-textarea__inner:hover { - border-color: #babdc2 +.el-upload-cover__progress { + display: inline-block; + vertical-align: middle; + position: static; + width: 243px } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff +.el-upload-cover__progress+.el-upload__inner { + opacity: 0 } -.el-textarea .el-input__count { - color: #909399; - background: #fff; +.el-upload-cover__content { position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px + top: 0; + left: 0; + width: 100%; + height: 100% } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-upload-cover__interact { + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, .72); + text-align: center +} + +.el-upload-cover__interact .btn { + display: inline-block; + color: #fff; + font-size: 14px; + cursor: pointer; + vertical-align: middle; + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + margin-top: 60px } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-upload-cover__interact .btn i { + margin-top: 0 } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-upload-cover__interact .btn span { + opacity: 0; + -webkit-transition: opacity .15s linear; + transition: opacity .15s linear } -.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-upload-cover__interact .btn:not(:first-child) { + margin-left: 35px } -.el-textarea.is-disabled .el-textarea__inner::placeholder { - color: #babdc2 +.el-upload-cover__interact .btn:hover { + -webkit-transform: translateY(-13px); + transform: translateY(-13px) } -.el-textarea.is-exceed .el-textarea__inner { - border-color: #ff4d4f +.el-upload-cover__interact .btn:hover span { + opacity: 1 } -.el-textarea.is-exceed .el-input__count { - color: #ff4d4f +.el-upload-cover__interact .btn i { + color: #fff; + display: block; + font-size: 24px; + line-height: inherit; + margin: 0 auto 5px } -.el-input { - position: relative; +.el-upload-cover__title { + position: absolute; + bottom: 0; + left: 0; + background-color: #fff; + height: 36px; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + font-weight: 400; + text-align: left; + padding: 0 10px; + margin: 0; + line-height: 36px; font-size: 14px; - display: inline-block; - width: 100% + color: #1e2226 } -.el-input::-webkit-scrollbar { - z-index: 11; - width: 6px +.el-upload-cover+.el-upload__inner { + opacity: 0; + position: relative; + z-index: 1 } -.el-input::-webkit-scrollbar:horizontal { - height: 6px +.el-progress { + position: relative; + line-height: 1 } -.el-input::-webkit-scrollbar-thumb { - border-radius: 5px; - width: 6px; - background: #b4bccc +.el-progress__text { + font-size: 14px; + color: #606266; + display: inline-block; + vertical-align: middle; + margin-left: 10px; + line-height: 1 } -.el-input::-webkit-scrollbar-corner { - background: #fff +.el-progress__text i { + vertical-align: middle; + display: block } -.el-input::-webkit-scrollbar-track { - background: #fff +.el-progress--circle, +.el-progress--dashboard { + display: inline-block } -.el-input::-webkit-scrollbar-track-piece { - background: #fff; - width: 6px +.el-progress--circle .el-progress__text, +.el-progress--dashboard .el-progress__text { + position: absolute; + top: 50%; + left: 0; + width: 100%; + text-align: center; + margin: 0; + -webkit-transform: translate(0, -50%); + transform: translate(0, -50%) } -.el-input .el-input__clear { - color: #babdc2; - font-size: 14px; - cursor: pointer; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1) +.el-progress--circle .el-progress__text i, +.el-progress--dashboard .el-progress__text i { + vertical-align: middle; + display: inline-block } -.el-input .el-input__clear:hover { - color: #1e2226 +.el-progress--without-text .el-progress__text { + display: none } -.el-input .el-input__count { - height: 100%; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - color: #909399; - font-size: 12px +.el-progress--without-text .el-progress-bar { + padding-right: 0; + margin-right: 0; + display: block } -.el-input .el-input__count .el-input__count-inner { - background: #fff; - line-height: initial; - display: inline-block; - padding: 0 5px +.el-progress--text-inside .el-progress-bar { + padding-right: 0; + margin-right: 0 } -.el-input__inner { - -webkit-appearance: none; - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - display: inline-block; - font-size: inherit; - height: 40px; - line-height: 40px; - outline: 0; - padding: 0 15px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - width: 100% +.el-progress.is-success .el-progress-bar__inner { + background-color: #0daf49 } -.el-input__inner::-ms-reveal { - display: none +.el-progress.is-success .el-progress__text { + color: #0daf49 } -.el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-progress.is-warning .el-progress-bar__inner { + background-color: #f08614 } -.el-input__inner::-moz-placeholder { - color: #babdc2 +.el-progress.is-warning .el-progress__text { + color: #f08614 } -.el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-progress.is-exception .el-progress-bar__inner { + background-color: #ff4d4f } -.el-input__inner::placeholder { - color: #babdc2 +.el-progress.is-exception .el-progress__text { + color: #ff4d4f } -.el-input__inner:hover { - border-color: #babdc2 +.el-progress-bar { + padding-right: 50px; + display: inline-block; + vertical-align: middle; + width: 100%; + margin-right: -55px; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-input__inner:focus { - outline: 0; - border-color: #006aff +.el-progress-bar__outer { + height: 6px; + border-radius: 100px; + background-color: #ebeef5; + overflow: hidden; + position: relative; + vertical-align: middle } -.el-input__suffix { +.el-progress-bar__inner { position: absolute; - height: 100%; - right: 5px; + left: 0; top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s; - pointer-events: none + height: 100%; + background-color: #006aff; + text-align: right; + border-radius: 100px; + line-height: 1; + white-space: nowrap; + -webkit-transition: width .6s ease; + transition: width .6s ease } -.el-input__suffix-inner { - pointer-events: all +.el-progress-bar__inner::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-input__prefix { - position: absolute; - height: 100%; - left: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s +.el-progress-bar__innerText { + display: inline-block; + vertical-align: middle; + color: #fff; + font-size: 12px; + margin: 0 5px } -.el-input__icon { - height: 100%; - width: 25px; - text-align: center; - -webkit-transition: all .3s; - transition: all .3s; - line-height: 40px +@keyframes progress { + 0% { + background-position: 0 0 + } + + 100% { + background-position: 32px 0 + } +} + +.el-time-spinner { + width: 100%; + white-space: nowrap } -.el-input__icon:after { - content: ''; - height: 100%; - width: 0; +.el-spinner { display: inline-block; vertical-align: middle } -.el-input__validateIcon { - pointer-events: none +.el-spinner-inner { + -webkit-animation: rotate 2s linear infinite; + animation: rotate 2s linear infinite; + width: 50px; + height: 50px } -.el-input.is-active .el-input__inner { - outline: 0; - border-color: #006aff +.el-spinner-inner .path { + stroke: #ececec; + stroke-linecap: round; + -webkit-animation: dash 1.5s ease-in-out infinite; + animation: dash 1.5s ease-in-out infinite } -.el-input.is-disabled .el-input__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +@-webkit-keyframes rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg) + } } -.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { - color: #babdc2 +@keyframes rotate { + 100% { + -webkit-transform: rotate(360deg); + transform: rotate(360deg) + } } -.el-input.is-disabled .el-input__inner::-moz-placeholder { - color: #babdc2 +@-webkit-keyframes dash { + 0% { + stroke-dasharray: 1, 150; + stroke-dashoffset: 0 + } + + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -35 + } + + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -124 + } } -.el-input.is-disabled .el-input__inner::-ms-input-placeholder { - color: #babdc2 +@keyframes dash { + 0% { + stroke-dasharray: 1, 150; + stroke-dashoffset: 0 + } + + 50% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -35 + } + + 100% { + stroke-dasharray: 90, 150; + stroke-dashoffset: -124 + } } -.el-input.is-disabled .el-input__inner::placeholder { - color: #babdc2 +.el-message { + min-width: 380px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-radius: 4px; + border-width: 1px; + border-style: solid; + border-color: #ebeef5; + position: fixed; + left: 50%; + top: 20px; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + background-color: #edf2fc; + -webkit-transition: opacity .3s, top .4s, -webkit-transform .4s; + transition: opacity .3s, top .4s, -webkit-transform .4s; + transition: opacity .3s, transform .4s, top .4s; + transition: opacity .3s, transform .4s, top .4s, -webkit-transform .4s; + overflow: hidden; + padding: 15px 15px 15px 20px; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-input.is-disabled .el-input__icon { - cursor: not-allowed +.el-message.is-center { + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center } -.el-input.is-exceed .el-input__inner { - border-color: #ff4d4f +.el-message.is-closable .el-message__content { + padding-right: 16px } -.el-input.is-exceed .el-input__suffix .el-input__count { - color: #ff4d4f +.el-message p { + margin: 0 } -.el-input--suffix .el-input__inner { - padding-right: 30px +.el-message--info .el-message__content { + color: #909399 } -.el-input--prefix .el-input__inner { - padding-left: 30px +.el-message--success { + background-color: #e7f7ed; + border-color: #cfefdb } -.el-input--medium { - font-size: 14px +.el-message--success .el-message__content { + color: #0daf49 } -.el-input--medium .el-input__inner { - height: 36px; - line-height: 36px +.el-message--warning { + background-color: #fef3e8; + border-color: #fce7d0 } -.el-input--medium .el-input__icon { - line-height: 36px +.el-message--warning .el-message__content { + color: #f08614 } -.el-input--small { - font-size: 13px +.el-message--error { + background-color: #ffeded; + border-color: #ffdbdc } -.el-input--small .el-input__inner { - height: 32px; - line-height: 32px +.el-message--error .el-message__content { + color: #ff4d4f } -.el-input--small .el-input__icon { - line-height: 32px +.el-message__icon { + margin-right: 10px } -.el-input--mini { - font-size: 12px +.el-message__content { + padding: 0; + font-size: 14px; + line-height: 1 } -.el-input--mini .el-input__inner { - height: 28px; - line-height: 28px +.el-message__content:focus { + outline-width: 0 } -.el-input--mini .el-input__icon { - line-height: 28px +.el-message__closeBtn { + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + cursor: pointer; + color: #babdc2; + font-size: 16px } -.el-input-group { - line-height: normal; - display: inline-table; - width: 100%; - border-collapse: separate; - border-spacing: 0 +.el-message__closeBtn:focus { + outline-width: 0 } -.el-input-group>.el-input__inner { - vertical-align: middle; - display: table-cell +.el-message__closeBtn:hover { + color: #1e2226 } -.el-input-group__append, -.el-input-group__prepend { - background-color: #f5f7fa; - color: #909399; - vertical-align: middle; - display: table-cell; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 4px; - padding: 0 20px; - width: 1px; - white-space: nowrap +.el-message .el-icon-success { + color: #0daf49 } -.el-input-group__append:focus, -.el-input-group__prepend:focus { - outline: 0 +.el-message .el-icon-error { + color: #ff4d4f } -.el-input-group__append .el-button, -.el-input-group__append .el-select, -.el-input-group__prepend .el-button, -.el-input-group__prepend .el-select { - display: inline-block; - margin: -10px -20px +.el-message .el-icon-info { + color: #909399 } -.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-message .el-icon-warning { + color: #f08614 } -.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-message-fade-enter, +.el-message-fade-leave-active { + opacity: 0; + -webkit-transform: translate(-50%, -100%); + transform: translate(-50%, -100%) +} + +.el-badge { + position: relative; + vertical-align: middle; + display: inline-block +} + +.el-badge__content { + background-color: #ff4d4f; + border-radius: 10px; + color: #fff; + display: inline-block; + font-size: 12px; + height: 18px; + line-height: 18px; + padding: 0 6px; + text-align: center; + white-space: nowrap; + border: 1px solid #fff } -.el-input-group__prepend { - border-right: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-badge__content.is-fixed { + position: absolute; + top: 0; + right: 10px; + -webkit-transform: translateY(-50%) translateX(100%); + transform: translateY(-50%) translateX(100%) } -.el-input-group__append { - border-left: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-badge__content.is-fixed.is-dot { + right: 5px } -.el-input-group--prepend .el-input__inner { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-badge__content.is-dot { + height: 8px; + width: 8px; + padding: 0; + right: 0; + border-radius: 50% } -.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-badge__content--primary { + background-color: #006aff } -.el-input-group--append .el-input__inner { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-badge__content--success { + background-color: #0daf49 } -.el-input-group--append .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-badge__content--warning { + background-color: #f08614 } -.el-input__inner::-ms-clear { - display: none; - width: 0; - height: 0 +.el-badge__content--info { + background-color: #909399 } -.el-popper .popper__arrow, -.el-popper .popper__arrow::after { - position: absolute; - display: block; - width: 0; - height: 0; - border-color: transparent; - border-style: solid +.el-badge__content--danger { + background-color: #ff4d4f } -.el-popper .popper__arrow { - border-width: 6px; - -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); - filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) +.el-card { + border-radius: 4px; + border: 1px solid #ebeef5; + background-color: #fff; + overflow: hidden; + color: #1e2226; + -webkit-transition: .3s; + transition: .3s } -.el-popper .popper__arrow::after { - content: " "; - border-width: 6px +.el-card.is-always-shadow { + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) } -.el-popper[x-placement^=top] { - margin-bottom: 12px +.el-card.is-hover-shadow:focus, +.el-card.is-hover-shadow:hover { + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) } -.el-popper[x-placement^=top] .popper__arrow { - bottom: -6px; - left: 50%; - margin-right: 3px; - border-top-color: #ebeef5; - border-bottom-width: 0 +.el-card__header { + padding: 18px 20px; + border-bottom: 1px solid #ebeef5; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-popper[x-placement^=top] .popper__arrow::after { - bottom: 1px; - margin-left: -6px; - border-top-color: #fff; - border-bottom-width: 0 +.el-card__body { + padding: 20px } -.el-popper[x-placement^=bottom] { - margin-top: 12px +.el-rate { + height: 20px; + line-height: 1 } -.el-popper[x-placement^=bottom] .popper__arrow { - top: -6px; - left: 50%; - margin-right: 3px; - border-top-width: 0; - border-bottom-color: #ebeef5 +.el-rate:active, +.el-rate:focus { + outline-width: 0 } -.el-popper[x-placement^=bottom] .popper__arrow::after { - top: 1px; - margin-left: -6px; - border-top-width: 0; - border-bottom-color: #fff +.el-rate__item { + display: inline-block; + position: relative; + font-size: 0; + vertical-align: middle } -.el-popper[x-placement^=right] { - margin-left: 12px +.el-rate__icon { + position: relative; + display: inline-block; + font-size: 18px; + margin-right: 6px; + color: #babdc2; + -webkit-transition: .3s; + transition: .3s } -.el-popper[x-placement^=right] .popper__arrow { - top: 50%; - left: -6px; - margin-bottom: 3px; - border-right-color: #ebeef5; - border-left-width: 0 +.el-rate__icon.hover { + -webkit-transform: scale(1.15); + transform: scale(1.15) } -.el-popper[x-placement^=right] .popper__arrow::after { - bottom: -6px; - left: 1px; - border-right-color: #fff; - border-left-width: 0 +.el-rate__icon .path2 { + position: absolute; + left: 0; + top: 0 } -.el-popper[x-placement^=left] { - margin-right: 12px +.el-rate__decimal { + position: absolute; + top: 0; + left: 0; + display: inline-block; + overflow: hidden } -.el-popper[x-placement^=left] .popper__arrow { - top: 50%; - right: -6px; - margin-bottom: 3px; - border-right-width: 0; - border-left-color: #ebeef5 +.el-rate__text { + font-size: 14px; + vertical-align: middle } -.el-popper[x-placement^=left] .popper__arrow::after { - right: 1px; - bottom: -6px; - margin-left: -6px; - border-right-width: 0; - border-left-color: #fff +.el-steps { + display: -webkit-box; + display: -ms-flexbox; + display: flex } -.el-tag { - background-color: #e6f0ff; - border-color: #cce1ff; - color: #006aff; - display: inline-block; - height: 32px; - padding: 0 10px; - line-height: 30px; - font-size: 12px; - color: #006aff; - border-width: 1px; - border-style: solid; +.el-steps--simple { + padding: 13px 8%; border-radius: 4px; - -webkit-box-sizing: border-box; - box-sizing: border-box; + background: #f5f7fa +} + +.el-steps--horizontal { white-space: nowrap } -.el-tag.is-hit { - border-color: #006aff +.el-steps--vertical { + height: 100%; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-flow: column; + flex-flow: column } -.el-tag .el-tag__close { - color: #006aff +.el-step { + position: relative; + -ms-flex-negative: 1; + flex-shrink: 1 } -.el-tag .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-step:last-of-type .el-step__line { + display: none } -.el-tag.el-tag--info { - background-color: #f4f4f5; - border-color: #e9e9eb; - color: #909399 +.el-step:last-of-type.is-flex { + -ms-flex-preferred-size: auto !important; + flex-basis: auto !important; + -ms-flex-negative: 0; + flex-shrink: 0; + -webkit-box-flex: 0; + -ms-flex-positive: 0; + flex-grow: 0 } -.el-tag.el-tag--info.is-hit { - border-color: #909399 +.el-step:last-of-type .el-step__description, +.el-step:last-of-type .el-step__main { + padding-right: 0 } -.el-tag.el-tag--info .el-tag__close { - color: #909399 +.el-step__head { + position: relative; + width: 100% } -.el-tag.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-step__head.is-process { + color: #1e2226; + border-color: #1e2226 +} + +.el-step__head.is-wait { + color: #babdc2; + border-color: #babdc2 +} + +.el-step__head.is-success { + color: #0daf49; + border-color: #0daf49 +} + +.el-step__head.is-error { + color: #ff4d4f; + border-color: #ff4d4f } -.el-tag.el-tag--success { - background-color: #e7f7ed; - border-color: #cfefdb; - color: #0daf49 +.el-step__head.is-finish { + color: #006aff; + border-color: #006aff } -.el-tag.el-tag--success.is-hit { - border-color: #0daf49 +.el-step__icon { + position: relative; + z-index: 1; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + width: 24px; + height: 24px; + font-size: 14px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + background: #fff; + -webkit-transition: .15s ease-out; + transition: .15s ease-out } -.el-tag.el-tag--success .el-tag__close { - color: #0daf49 +.el-step__icon.is-text { + border-radius: 50%; + border: 2px solid; + border-color: inherit } -.el-tag.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-step__icon.is-icon { + width: 40px } -.el-tag.el-tag--warning { - background-color: #fef3e8; - border-color: #fce7d0; - color: #f08614 +.el-step__icon-inner { + display: inline-block; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + text-align: center; + font-weight: 700; + line-height: 1; + color: inherit } -.el-tag.el-tag--warning.is-hit { - border-color: #f08614 +.el-step__icon-inner[class*=el-icon]:not(.is-status) { + font-size: 25px; + font-weight: 400 } -.el-tag.el-tag--warning .el-tag__close { - color: #f08614 +.el-step__icon-inner.is-status { + -webkit-transform: translateY(1px); + transform: translateY(1px) } -.el-tag.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-step__line { + position: absolute; + border-color: inherit; + background-color: #babdc2 } -.el-tag.el-tag--danger { - background-color: #ffeded; - border-color: #ffdbdc; - color: #ff4d4f +.el-step__line-inner { + display: block; + border-width: 1px; + border-style: solid; + border-color: inherit; + -webkit-transition: .15s ease-out; + transition: .15s ease-out; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 0; + height: 0 } -.el-tag.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-step__main { + white-space: normal; + text-align: left } -.el-tag.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-step__title { + font-size: 16px; + line-height: 38px } -.el-tag.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-step__title.is-process { + font-weight: 700; + color: #1e2226 } -.el-tag .el-icon-close { - border-radius: 50%; - text-align: center; - position: relative; - cursor: pointer; - font-size: 12px; - height: 16px; - width: 16px; - line-height: 16px; - vertical-align: middle; - top: -1px; - right: -5px +.el-step__title.is-wait { + color: #babdc2 } -.el-tag .el-icon-close::before { - display: block +.el-step__title.is-success { + color: #0daf49 } -.el-tag--dark { - background-color: #006aff; - border-color: #006aff; - color: #fff +.el-step__title.is-error { + color: #ff4d4f } -.el-tag--dark.is-hit { - border-color: #006aff +.el-step__title.is-finish { + color: #006aff } -.el-tag--dark .el-tag__close { - color: #fff +.el-step__description { + padding-right: 10%; + margin-top: -5px; + font-size: 12px; + line-height: 20px; + font-weight: 400 } -.el-tag--dark .el-tag__close:hover { - color: #fff; - background-color: #38f +.el-step__description.is-process { + color: #1e2226 } -.el-tag--dark.el-tag--info { - background-color: #909399; - border-color: #909399; - color: #fff +.el-step__description.is-wait { + color: #babdc2 } -.el-tag--dark.el-tag--info.is-hit { - border-color: #909399 +.el-step__description.is-success { + color: #0daf49 } -.el-tag--dark.el-tag--info .el-tag__close { - color: #fff +.el-step__description.is-error { + color: #ff4d4f } -.el-tag--dark.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #a6a9ad +.el-step__description.is-finish { + color: #006aff } -.el-tag--dark.el-tag--success { - background-color: #0daf49; - border-color: #0daf49; - color: #fff +.el-step.is-horizontal { + display: inline-block } -.el-tag--dark.el-tag--success.is-hit { - border-color: #0daf49 +.el-step.is-horizontal .el-step__line { + height: 2px; + top: 11px; + left: 0; + right: 0 } -.el-tag--dark.el-tag--success .el-tag__close { - color: #fff +.el-step.is-vertical { + display: -webkit-box; + display: -ms-flexbox; + display: flex } -.el-tag--dark.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #3dbf6d +.el-step.is-vertical .el-step__head { + -webkit-box-flex: 0; + -ms-flex-positive: 0; + flex-grow: 0; + width: 24px } -.el-tag--dark.el-tag--warning { - background-color: #f08614; - border-color: #f08614; - color: #fff +.el-step.is-vertical .el-step__main { + padding-left: 10px; + -webkit-box-flex: 1; + -ms-flex-positive: 1; + flex-grow: 1 } -.el-tag--dark.el-tag--warning.is-hit { - border-color: #f08614 +.el-step.is-vertical .el-step__title { + line-height: 24px; + padding-bottom: 8px } -.el-tag--dark.el-tag--warning .el-tag__close { - color: #fff +.el-step.is-vertical .el-step__line { + width: 2px; + top: 0; + bottom: 0; + left: 11px } -.el-tag--dark.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f39e43 +.el-step.is-vertical .el-step__icon.is-icon { + width: 24px } -.el-tag--dark.el-tag--danger { - background-color: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-step.is-center .el-step__head { + text-align: center } -.el-tag--dark.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-step.is-center .el-step__main { + text-align: center } -.el-tag--dark.el-tag--danger .el-tag__close { - color: #fff +.el-step.is-center .el-step__description { + padding-left: 20%; + padding-right: 20% } -.el-tag--dark.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff7172 +.el-step.is-center .el-step__line { + left: 50%; + right: -50% } -.el-tag--plain { - background-color: #fff; - border-color: #99c3ff; - color: #006aff +.el-step.is-simple { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-tag--plain.is-hit { - border-color: #006aff +.el-step.is-simple .el-step__head { + width: auto; + font-size: 0; + padding-right: 10px } -.el-tag--plain .el-tag__close { - color: #006aff +.el-step.is-simple .el-step__icon { + background: 0 0; + width: 16px; + height: 16px; + font-size: 12px } -.el-tag--plain .el-tag__close:hover { - color: #fff; - background-color: #006aff +.el-step.is-simple .el-step__icon-inner[class*=el-icon]:not(.is-status) { + font-size: 18px } -.el-tag--plain.el-tag--info { - background-color: #fff; - border-color: #d3d4d6; - color: #909399 +.el-step.is-simple .el-step__icon-inner.is-status { + -webkit-transform: scale(.8) translateY(1px); + transform: scale(.8) translateY(1px) } -.el-tag--plain.el-tag--info.is-hit { - border-color: #909399 +.el-step.is-simple .el-step__main { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: stretch; + -ms-flex-align: stretch; + align-items: stretch; + -webkit-box-flex: 1; + -ms-flex-positive: 1; + flex-grow: 1 } -.el-tag--plain.el-tag--info .el-tag__close { - color: #909399 +.el-step.is-simple .el-step__title { + font-size: 16px; + line-height: 20px } -.el-tag--plain.el-tag--info .el-tag__close:hover { - color: #fff; - background-color: #909399 +.el-step.is-simple:not(:last-of-type) .el-step__title { + max-width: 50%; + word-break: break-all } -.el-tag--plain.el-tag--success { - background-color: #fff; - border-color: #9edfb6; - color: #0daf49 +.el-step.is-simple .el-step__arrow { + -webkit-box-flex: 1; + -ms-flex-positive: 1; + flex-grow: 1; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center } -.el-tag--plain.el-tag--success.is-hit { - border-color: #0daf49 +.el-step.is-simple .el-step__arrow::after, +.el-step.is-simple .el-step__arrow::before { + content: ''; + display: inline-block; + position: absolute; + height: 15px; + width: 1px; + background: #babdc2 } -.el-tag--plain.el-tag--success .el-tag__close { - color: #0daf49 +.el-step.is-simple .el-step__arrow::before { + -webkit-transform: rotate(-45deg) translateY(-4px); + transform: rotate(-45deg) translateY(-4px); + -webkit-transform-origin: 0 0; + transform-origin: 0 0 } -.el-tag--plain.el-tag--success .el-tag__close:hover { - color: #fff; - background-color: #0daf49 +.el-step.is-simple .el-step__arrow::after { + -webkit-transform: rotate(45deg) translateY(4px); + transform: rotate(45deg) translateY(4px); + -webkit-transform-origin: 100% 100%; + transform-origin: 100% 100% } -.el-tag--plain.el-tag--warning { - background-color: #fff; - border-color: #f9cfa1; - color: #f08614 +.el-step.is-simple:last-of-type .el-step__arrow { + display: none } -.el-tag--plain.el-tag--warning.is-hit { - border-color: #f08614 +.el-carousel { + position: relative } -.el-tag--plain.el-tag--warning .el-tag__close { - color: #f08614 +.el-carousel--horizontal { + overflow-x: hidden } -.el-tag--plain.el-tag--warning .el-tag__close:hover { - color: #fff; - background-color: #f08614 +.el-carousel--vertical { + overflow-y: hidden } -.el-tag--plain.el-tag--danger { - background-color: #fff; - border-color: #ffb8b9; - color: #ff4d4f +.el-carousel__container { + position: relative; + height: 300px } -.el-tag--plain.el-tag--danger.is-hit { - border-color: #ff4d4f +.el-carousel__arrow { + border: none; + outline: 0; + padding: 0; + margin: 0; + height: 36px; + width: 36px; + cursor: pointer; + -webkit-transition: .3s; + transition: .3s; + border-radius: 50%; + background-color: rgba(31, 45, 61, .11); + color: #fff; + position: absolute; + top: 50%; + z-index: 10; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + text-align: center; + font-size: 12px } -.el-tag--plain.el-tag--danger .el-tag__close { - color: #ff4d4f +.el-carousel__arrow--left { + left: 16px } -.el-tag--plain.el-tag--danger .el-tag__close:hover { - color: #fff; - background-color: #ff4d4f +.el-carousel__arrow--right { + right: 16px } -.el-tag--medium { - height: 28px; - line-height: 26px +.el-carousel__arrow:hover { + background-color: rgba(31, 45, 61, .23) } -.el-tag--medium .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-carousel__arrow i { + cursor: pointer } -.el-tag--small { - height: 24px; - padding: 0 8px; - line-height: 22px +.el-carousel__indicators { + position: absolute; + list-style: none; + margin: 0; + padding: 0; + z-index: 2 } -.el-tag--small .el-icon-close { - -webkit-transform: scale(.8); - transform: scale(.8) +.el-carousel__indicators--horizontal { + bottom: 0; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%) } -.el-tag--mini { - height: 20px; - padding: 0 5px; - line-height: 19px +.el-carousel__indicators--vertical { + right: 0; + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%) } -.el-tag--mini .el-icon-close { - margin-left: -3px; - -webkit-transform: scale(.7); - transform: scale(.7) +.el-carousel__indicators--outside { + bottom: 26px; + text-align: center; + position: static; + -webkit-transform: none; + transform: none } -.el-checkbox { - color: #606266; - font-weight: 500; - font-size: 14px; - position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - margin-right: 30px +.el-carousel__indicators--outside .el-carousel__indicator:hover button { + opacity: .64 } -.el-checkbox.is-bordered { - padding: 9px 20px 9px 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - line-height: normal; - height: 40px +.el-carousel__indicators--outside button { + background-color: #babdc2; + opacity: .24 } -.el-checkbox.is-bordered.is-checked { - border-color: #006aff +.el-carousel__indicators--labels { + left: 0; + right: 0; + -webkit-transform: none; + transform: none; + text-align: center } -.el-checkbox.is-bordered.is-disabled { - border-color: #ebeef5; - cursor: not-allowed +.el-carousel__indicators--labels .el-carousel__button { + height: auto; + width: auto; + padding: 2px 18px; + font-size: 12px } -.el-checkbox.is-bordered+.el-checkbox.is-bordered { - margin-left: 10px +.el-carousel__indicators--labels .el-carousel__indicator { + padding: 6px 4px } -.el-checkbox.is-bordered.el-checkbox--medium { - padding: 7px 20px 7px 10px; - border-radius: 4px; - height: 36px +.el-carousel__indicator { + background-color: transparent; + cursor: pointer } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { - line-height: 17px; - font-size: 14px +.el-carousel__indicator:hover button { + opacity: .72 } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { - height: 14px; - width: 14px +.el-carousel__indicator--horizontal { + display: inline-block; + padding: 12px 4px } -.el-checkbox.is-bordered.el-checkbox--small { - padding: 5px 15px 5px 10px; - border-radius: 3px; - height: 32px +.el-carousel__indicator--vertical { + padding: 4px 12px } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { - line-height: 15px; - font-size: 12px +.el-carousel__indicator--vertical .el-carousel__button { + width: 2px; + height: 15px } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { - height: 12px; - width: 12px +.el-carousel__indicator.is-active button { + opacity: 1 } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-carousel__button { + display: block; + opacity: .48; + width: 30px; + height: 2px; + background-color: #fff; + border: none; + outline: 0; + padding: 0; + margin: 0; + cursor: pointer; + -webkit-transition: .3s; + transition: .3s } -.el-checkbox.is-bordered.el-checkbox--mini { - padding: 3px 15px 3px 10px; - border-radius: 3px; - height: 28px +.carousel-arrow-left-enter, +.carousel-arrow-left-leave-active { + -webkit-transform: translateY(-50%) translateX(-10px); + transform: translateY(-50%) translateX(-10px); + opacity: 0 } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { - line-height: 12px; - font-size: 12px +.carousel-arrow-right-enter, +.carousel-arrow-right-leave-active { + -webkit-transform: translateY(-50%) translateX(10px); + transform: translateY(-50%) translateX(10px); + opacity: 0 } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { - height: 12px; - width: 12px +.el-scrollbar { + overflow: hidden; + position: relative } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-scrollbar:active>.el-scrollbar__bar, +.el-scrollbar:focus>.el-scrollbar__bar, +.el-scrollbar:hover>.el-scrollbar__bar { + opacity: 1; + -webkit-transition: opacity 340ms ease-out; + transition: opacity 340ms ease-out } -.el-checkbox__input { - white-space: nowrap; - cursor: pointer; - outline: 0; - display: inline-block; - line-height: 1; - position: relative; - vertical-align: middle +.el-scrollbar__wrap { + overflow: scroll; + height: 100% } -.el-checkbox__input.is-disabled .el-checkbox__inner { - background-color: #edf2fc; - border-color: #dfe2e6; - cursor: not-allowed +.el-scrollbar__wrap--hidden-default { + scrollbar-width: none } -.el-checkbox__input.is-disabled .el-checkbox__inner::after { - cursor: not-allowed; - border-color: #babdc2 +.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0 } -.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { - cursor: not-allowed +.el-scrollbar__thumb { + position: relative; + display: block; + width: 0; + height: 0; + cursor: pointer; + border-radius: inherit; + background-color: rgba(30, 34, 38, .3); + -webkit-transition: .3s background-color; + transition: .3s background-color } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-scrollbar__thumb:hover { + background-color: rgba(30, 34, 38, .5) } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { - border-color: #babdc2 +.el-scrollbar__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + -webkit-transition: opacity 120ms ease-out; + transition: opacity 120ms ease-out } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-scrollbar__bar.is-vertical { + width: 6px; + top: 2px } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { - background-color: #babdc2; - border-color: #babdc2 +.el-scrollbar__bar.is-vertical>div { + width: 100% } -.el-checkbox__input.is-disabled+span.el-checkbox__label { - color: #babdc2; - cursor: not-allowed +.el-scrollbar__bar.is-horizontal { + height: 6px; + left: 2px } -.el-checkbox__input.is-checked .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-scrollbar__bar.is-horizontal>div { + height: 100% } -.el-checkbox__input.is-checked .el-checkbox__inner::after { - -webkit-transform: rotate(45deg) scaleY(1); - transform: rotate(45deg) scaleY(1) +.el-carousel__item { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: inline-block; + overflow: hidden; + z-index: 0 } -.el-checkbox__input.is-checked+.el-checkbox__label { - color: #006aff +.el-carousel__item.is-active { + z-index: 2 } -.el-checkbox__input.is-focus .el-checkbox__inner { - border-color: #006aff +.el-carousel__item.is-animating { + -webkit-transition: -webkit-transform .4s ease-in-out; + transition: -webkit-transform .4s ease-in-out; + transition: transform .4s ease-in-out; + transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out } -.el-checkbox__input.is-indeterminate .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-carousel__item--card { + width: 50%; + -webkit-transition: -webkit-transform .4s ease-in-out; + transition: -webkit-transform .4s ease-in-out; + transition: transform .4s ease-in-out; + transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { - content: ''; - position: absolute; - display: block; - background-color: #fff; - height: 2px; - -webkit-transform: scale(.5); - transform: scale(.5); - left: 0; - right: 0; - top: 5px +.el-carousel__item--card.is-in-stage { + cursor: pointer; + z-index: 1 } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { - display: none +.el-carousel__item--card.is-in-stage.is-hover .el-carousel__mask, +.el-carousel__item--card.is-in-stage:hover .el-carousel__mask { + opacity: .12 } -.el-checkbox__inner { - display: inline-block; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 2px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 14px; - height: 14px; - background-color: #fff; - z-index: 1; - -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); - transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) +.el-carousel__item--card.is-active { + z-index: 2 } -.el-checkbox__inner:hover { - border-color: #006aff +.el-carousel__mask { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + background-color: #fff; + opacity: .24; + -webkit-transition: .2s; + transition: .2s } -.el-checkbox__inner::after { - -webkit-box-sizing: content-box; - box-sizing: content-box; - content: ""; - border: 1px solid #fff; - border-left: 0; - border-top: 0; - height: 7px; - left: 4px; - position: absolute; - top: 1px; - -webkit-transform: rotate(45deg) scaleY(0); - transform: rotate(45deg) scaleY(0); - width: 3px; - -webkit-transition: -webkit-transform .15s ease-in .05s; - transition: -webkit-transform .15s ease-in .05s; - transition: transform .15s ease-in .05s; - transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; - -webkit-transform-origin: center; - transform-origin: center +.fade-in-linear-enter-active, +.fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-checkbox__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - width: 0; - height: 0; - z-index: -1 +.fade-in-linear-enter, +.fade-in-linear-leave, +.fade-in-linear-leave-active { + opacity: 0 } -.el-checkbox__label { - display: inline-block; - padding-left: 10px; - line-height: 19px; - font-size: 14px +.el-fade-in-linear-enter-active, +.el-fade-in-linear-leave-active { + -webkit-transition: opacity .2s linear; + transition: opacity .2s linear } -.el-checkbox:last-of-type { - margin-right: 0 +.el-fade-in-linear-enter, +.el-fade-in-linear-leave, +.el-fade-in-linear-leave-active { + opacity: 0 } -.el-checkbox-button { - position: relative; - display: inline-block +.el-fade-in-enter-active, +.el-fade-in-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-checkbox-button__inner { - display: inline-block; - line-height: 1; - font-weight: 500; - white-space: nowrap; - vertical-align: middle; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-left: 0; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - position: relative; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 0 +.el-fade-in-enter, +.el-fade-in-leave-active { + opacity: 0 } -.el-checkbox-button__inner.is-round { - padding: 12px 20px +.el-zoom-in-center-enter-active, +.el-zoom-in-center-leave-active { + -webkit-transition: all .3s cubic-bezier(.55, 0, .1, 1); + transition: all .3s cubic-bezier(.55, 0, .1, 1) } -.el-checkbox-button__inner:hover { - color: #006aff +.el-zoom-in-center-enter, +.el-zoom-in-center-leave-active { + opacity: 0; + -webkit-transform: scaleX(0); + transform: scaleX(0) } -.el-checkbox-button__inner [class*=el-icon-] { - line-height: .9 +.el-zoom-in-top-enter-active, +.el-zoom-in-top-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center top; + transform-origin: center top } -.el-checkbox-button__inner [class*=el-icon-]+span { - margin-left: 5px +.el-zoom-in-top-enter, +.el-zoom-in-top-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-checkbox-button__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - z-index: -1 +.el-zoom-in-bottom-enter-active, +.el-zoom-in-bottom-leave-active { + opacity: 1; + -webkit-transform: scaleY(1); + transform: scaleY(1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: center bottom; + transform-origin: center bottom } -.el-checkbox-button.is-checked .el-checkbox-button__inner { - color: #fff; - background-color: #006aff; - border-color: #006aff; - -webkit-box-shadow: -1px 0 0 0 #66a6ff; - box-shadow: -1px 0 0 0 #66a6ff +.el-zoom-in-bottom-enter, +.el-zoom-in-bottom-leave-active { + opacity: 0; + -webkit-transform: scaleY(0); + transform: scaleY(0) } -.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { - border-left-color: #006aff +.el-zoom-in-left-enter-active, +.el-zoom-in-left-leave-active { + opacity: 1; + -webkit-transform: scale(1, 1); + transform: scale(1, 1); + -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1); + transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); + -webkit-transform-origin: top left; + transform-origin: top left } -.el-checkbox-button.is-disabled .el-checkbox-button__inner { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5; - -webkit-box-shadow: none; - box-shadow: none +.el-zoom-in-left-enter, +.el-zoom-in-left-leave-active { + opacity: 0; + -webkit-transform: scale(.45, .45); + transform: scale(.45, .45) } -.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { - border-left-color: #ebeef5 +.collapse-transition { + -webkit-transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out; + transition: .3s height ease-in-out, .3s padding-top ease-in-out, .3s padding-bottom ease-in-out } -.el-checkbox-button:first-child .el-checkbox-button__inner { - border-left: 1px solid #dfe2e6; - border-radius: 4px 0 0 4px; - -webkit-box-shadow: none !important; - box-shadow: none !important +.horizontal-collapse-transition { + -webkit-transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out; + transition: .3s width ease-in-out, .3s padding-left ease-in-out, .3s padding-right ease-in-out } -.el-checkbox-button.is-focus .el-checkbox-button__inner { - border-color: #006aff +.el-list-enter-active, +.el-list-leave-active { + -webkit-transition: all 1s; + transition: all 1s } -.el-checkbox-button:last-child .el-checkbox-button__inner { - border-radius: 0 4px 4px 0 +.el-list-enter, +.el-list-leave-active { + opacity: 0; + -webkit-transform: translateY(-30px); + transform: translateY(-30px) } -.el-checkbox-button--medium .el-checkbox-button__inner { - padding: 10px 20px; - font-size: 14px; - border-radius: 0 +.el-opacity-transition { + -webkit-transition: opacity .3s cubic-bezier(.55, 0, .1, 1); + transition: opacity .3s cubic-bezier(.55, 0, .1, 1) } -.el-checkbox-button--medium .el-checkbox-button__inner.is-round { - padding: 10px 20px +.el-collapse { + border-top: 1px solid #ebeef5; + border-bottom: 1px solid #ebeef5 } -.el-checkbox-button--small .el-checkbox-button__inner { - padding: 9px 15px; - font-size: 12px; - border-radius: 0 +.el-collapse-item.is-disabled .el-collapse-item__header { + color: #bbb; + cursor: not-allowed } -.el-checkbox-button--small .el-checkbox-button__inner.is-round { - padding: 9px 15px +.el-collapse-item__header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + height: 48px; + line-height: 48px; + background-color: #fff; + color: #1e2226; + cursor: pointer; + border-bottom: 1px solid #ebeef5; + font-size: 13px; + font-weight: 500; + -webkit-transition: border-bottom-color .3s; + transition: border-bottom-color .3s; + outline: 0 } -.el-checkbox-button--mini .el-checkbox-button__inner { - padding: 7px 15px; - font-size: 12px; - border-radius: 0 +.el-collapse-item__arrow { + margin: 0 8px 0 auto; + -webkit-transition: -webkit-transform .3s; + transition: -webkit-transform .3s; + transition: transform .3s; + transition: transform .3s, -webkit-transform .3s; + font-weight: 300 } -.el-checkbox-button--mini .el-checkbox-button__inner.is-round { - padding: 7px 15px +.el-collapse-item__arrow.is-active { + -webkit-transform: rotate(90deg); + transform: rotate(90deg) } -.el-checkbox-group { - font-size: 0 +.el-collapse-item__header.focusing:focus:not(:hover) { + color: #006aff } -.el-radio { - color: #606266; - font-weight: 500; - line-height: 1; - position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - outline: 0; - font-size: 14px; - margin-right: 30px; - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none +.el-collapse-item__header.is-active { + border-bottom-color: transparent } -.el-radio.is-bordered { - padding: 12px 20px 0 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; +.el-collapse-item__wrap { + will-change: height; + background-color: #fff; + overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; - height: 40px -} - -.el-radio.is-bordered.is-checked { - border-color: #006aff -} - -.el-radio.is-bordered.is-disabled { - cursor: not-allowed; - border-color: #ebeef5 + border-bottom: 1px solid #ebeef5 } -.el-radio.is-bordered+.el-radio.is-bordered { - margin-left: 10px +.el-collapse-item__content { + padding-bottom: 25px; + font-size: 13px; + color: #1e2226; + line-height: 1.769230769230769 } -.el-radio--medium.is-bordered { - padding: 10px 20px 0 10px; - border-radius: 4px; - height: 36px +.el-collapse-item:last-child { + margin-bottom: -1px } -.el-radio--medium.is-bordered .el-radio__label { +.el-textarea { + position: relative; + display: inline-block; + width: 100%; + vertical-align: bottom; font-size: 14px } -.el-radio--medium.is-bordered .el-radio__inner { - height: 14px; - width: 14px -} - -.el-radio--small.is-bordered { - padding: 8px 15px 0 10px; - border-radius: 3px; - height: 32px +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + font-size: inherit; + color: #606266; + background-color: #fff; + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-radio--small.is-bordered .el-radio__label { - font-size: 12px +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-radio--small.is-bordered .el-radio__inner { - height: 12px; - width: 12px +.el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-radio--mini.is-bordered { - padding: 6px 15px 0 10px; - border-radius: 3px; - height: 28px +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-radio--mini.is-bordered .el-radio__label { - font-size: 12px +.el-textarea__inner::placeholder { + color: #babdc2 } -.el-radio--mini.is-bordered .el-radio__inner { - height: 12px; - width: 12px +.el-textarea__inner:hover { + border-color: #babdc2 } -.el-radio:last-child { - margin-right: 0 +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff } -.el-radio__input { - white-space: nowrap; - cursor: pointer; - outline: 0; - display: inline-block; - line-height: 1; - position: relative; - vertical-align: middle +.el-textarea .el-input__count { + color: #909399; + background: #fff; + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px } -.el-radio__input.is-disabled .el-radio__inner { +.el-textarea.is-disabled .el-textarea__inner { background-color: #f5f7fa; border-color: #e4e7ed; + color: #babdc2; cursor: not-allowed } -.el-radio__input.is-disabled .el-radio__inner::after { - cursor: not-allowed; - background-color: #f5f7fa +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-radio__input.is-disabled .el-radio__inner+.el-radio__label { - cursor: not-allowed +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-radio__input.is-disabled.is-checked .el-radio__inner { - background-color: #f5f7fa; - border-color: #e4e7ed +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-radio__input.is-disabled.is-checked .el-radio__inner::after { - background-color: #babdc2 +.el-textarea.is-disabled .el-textarea__inner::placeholder { + color: #babdc2 } -.el-radio__input.is-disabled+span.el-radio__label { - color: #babdc2; - cursor: not-allowed +.el-textarea.is-exceed .el-textarea__inner { + border-color: #ff4d4f } -.el-radio__input.is-checked .el-radio__inner { - border-color: #006aff; - background: #006aff +.el-textarea.is-exceed .el-input__count { + color: #ff4d4f } -.el-radio__input.is-checked .el-radio__inner::after { - -webkit-transform: translate(-50%, -50%) scale(1); - transform: translate(-50%, -50%) scale(1) +.el-input { + position: relative; + font-size: 14px; + display: inline-block; + width: 100% } -.el-radio__input.is-checked+.el-radio__label { - color: #006aff +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px } -.el-radio__input.is-focus .el-radio__inner { - border-color: #006aff +.el-input::-webkit-scrollbar:horizontal { + height: 6px } -.el-radio__inner { - border: 1px solid #dfe2e6; - border-radius: 100%; - width: 14px; - height: 14px; - background-color: #fff; - position: relative; - cursor: pointer; - display: inline-block; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc } -.el-radio__inner:hover { - border-color: #006aff +.el-input::-webkit-scrollbar-corner { + background: #fff } -.el-radio__inner::after { - width: 4px; - height: 4px; - border-radius: 100%; - background-color: #fff; - content: ""; - position: absolute; - left: 50%; - top: 50%; - -webkit-transform: translate(-50%, -50%) scale(0); - transform: translate(-50%, -50%) scale(0); - -webkit-transition: -webkit-transform .15s ease-in; - transition: -webkit-transform .15s ease-in; - transition: transform .15s ease-in; - transition: transform .15s ease-in, -webkit-transform .15s ease-in +.el-input::-webkit-scrollbar-track { + background: #fff } -.el-radio__original { - opacity: 0; - outline: 0; - position: absolute; - z-index: -1; - top: 0; - left: 0; - right: 0; - bottom: 0; - margin: 0 +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px } -.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner { - -webkit-box-shadow: 0 0 2px 2px #006aff; - box-shadow: 0 0 2px 2px #006aff +.el-input .el-input__clear { + color: #babdc2; + font-size: 14px; + cursor: pointer; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1) } -.el-radio__label { - font-size: 14px; - padding-left: 10px +.el-input .el-input__clear:hover { + color: #1e2226 } -.el-scrollbar { - overflow: hidden; - position: relative +.el-input .el-input__count { + height: 100%; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + color: #909399; + font-size: 12px } -.el-scrollbar:active>.el-scrollbar__bar, -.el-scrollbar:focus>.el-scrollbar__bar, -.el-scrollbar:hover>.el-scrollbar__bar { - opacity: 1; - -webkit-transition: opacity 340ms ease-out; - transition: opacity 340ms ease-out +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px } -.el-scrollbar__wrap { - overflow: scroll; - height: 100% +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + display: inline-block; + font-size: inherit; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + width: 100% } -.el-scrollbar__wrap--hidden-default { - scrollbar-width: none +.el-input__inner::-ms-reveal { + display: none } -.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { - width: 0; - height: 0 +.el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-scrollbar__thumb { - position: relative; - display: block; - width: 0; - height: 0; - cursor: pointer; - border-radius: inherit; - background-color: rgba(30, 34, 38, .3); - -webkit-transition: .3s background-color; - transition: .3s background-color +.el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-scrollbar__thumb:hover { - background-color: rgba(30, 34, 38, .5) +.el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.el-scrollbar__bar { - position: absolute; - right: 2px; - bottom: 2px; - z-index: 1; - border-radius: 4px; - opacity: 0; - -webkit-transition: opacity 120ms ease-out; - transition: opacity 120ms ease-out +.el-input__inner::placeholder { + color: #babdc2 } -.el-scrollbar__bar.is-vertical { - width: 6px; - top: 2px +.el-input__inner:hover { + border-color: #babdc2 } -.el-scrollbar__bar.is-vertical>div { - width: 100% +.el-input__inner:focus { + outline: 0; + border-color: #006aff } -.el-scrollbar__bar.is-horizontal { - height: 6px; - left: 2px +.el-input__suffix { + position: absolute; + height: 100%; + right: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s; + pointer-events: none } -.el-scrollbar__bar.is-horizontal>div { - height: 100% +.el-input__suffix-inner { + pointer-events: all } -.el-cascader-panel { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - border-radius: 4px; - font-size: 14px +.el-input__prefix { + position: absolute; + height: 100%; + left: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s } -.el-cascader-panel.is-bordered { - border: solid 1px #e4e7ed; - border-radius: 4px +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all .3s; + transition: all .3s; + line-height: 40px } -.el-cascader-menu { - min-width: 180px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - border-right: solid 1px #e4e7ed +.el-input__icon:after { + content: ''; + height: 100%; + width: 0; + display: inline-block; + vertical-align: middle } -.el-cascader-menu:last-child { - border-right: none +.el-input__validateIcon { + pointer-events: none } -.el-cascader-menu:last-child .el-cascader-node { - padding-right: 20px +.el-input.is-active .el-input__inner { + outline: 0; + border-color: #006aff } -.el-cascader-menu__wrap { - height: 204px +.el-input.is-disabled .el-input__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-cascader-menu__list { - position: relative; - min-height: 100%; - margin: 0; - padding: 6px 0; - list-style: none; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-cascader-menu__hover-zone { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - pointer-events: none +.el-input.is-disabled .el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-cascader-menu__empty-text { - position: absolute; - top: 50%; - left: 50%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); - text-align: center; +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { color: #babdc2 } -.el-cascader-node { - position: relative; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - padding: 0 30px 0 20px; - height: 34px; - line-height: 34px; - outline: 0 +.el-input.is-disabled .el-input__inner::placeholder { + color: #babdc2 } -.el-cascader-node.is-selectable.in-active-path { - color: #606266 +.el-input.is-disabled .el-input__icon { + cursor: not-allowed } -.el-cascader-node.in-active-path, -.el-cascader-node.is-active, -.el-cascader-node.is-selectable.in-checked-path { - color: #006aff; - font-weight: 700 +.el-input.is-exceed .el-input__inner { + border-color: #ff4d4f } -.el-cascader-node:not(.is-disabled) { - cursor: pointer +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #ff4d4f } -.el-cascader-node:not(.is-disabled):focus, -.el-cascader-node:not(.is-disabled):hover { - background: #f5f7fa +.el-input--suffix .el-input__inner { + padding-right: 30px } -.el-cascader-node.is-disabled { - color: #babdc2; - cursor: not-allowed +.el-input--prefix .el-input__inner { + padding-left: 30px } -.el-cascader-node__prefix { - position: absolute; - left: 10px +.el-input--medium { + font-size: 14px } -.el-cascader-node__postfix { - position: absolute; - right: 10px +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px } -.el-cascader-node__label { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - padding: 0 10px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis +.el-input--medium .el-input__icon { + line-height: 36px } -.el-cascader-node>.el-radio { - margin-right: 0 +.el-input--small { + font-size: 13px } -.el-cascader-node>.el-radio .el-radio__label { - padding-left: 0 +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px } -.el-cascader { - display: inline-block; - position: relative; - font-size: 14px; - line-height: 40px +.el-input--small .el-input__icon { + line-height: 32px } -.el-cascader:not(.is-disabled):hover .el-input__inner { - cursor: pointer; - border-color: #babdc2 +.el-input--mini { + font-size: 12px } -.el-cascader .el-input { - cursor: pointer +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px } -.el-cascader .el-input .el-input__inner { - text-overflow: ellipsis +.el-input--mini .el-input__icon { + line-height: 28px } -.el-cascader .el-input .el-input__inner:focus { - border-color: #006aff +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0 } -.el-cascader .el-input .el-icon-arrow-down { - -webkit-transition: -webkit-transform .3s; - transition: -webkit-transform .3s; - transition: transform .3s; - transition: transform .3s, -webkit-transform .3s; - font-size: 14px +.el-input-group>.el-input__inner { + vertical-align: middle; + display: table-cell } -.el-cascader .el-input .el-icon-arrow-down.is-reverse { - -webkit-transform: rotateZ(180deg); - transform: rotateZ(180deg) +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap +} + +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0 +} + +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px } -.el-cascader .el-input .el-icon-circle-close:hover { - color: #1e2226 +.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-cascader .el-input.is-focus .el-input__inner { - border-color: #006aff +.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-cascader--medium { - font-size: 14px; - line-height: 36px +.el-input-group__prepend { + border-right: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-cascader--small { - font-size: 13px; - line-height: 32px +.el-input-group__append { + border-left: 0; + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-cascader--mini { - font-size: 12px; - line-height: 28px +.el-input-group--prepend .el-input__inner { + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-cascader.is-disabled .el-cascader__label { - z-index: 2; - color: #babdc2 +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-cascader__dropdown { - margin: 5px 0; - font-size: 14px; - background: #fff; - border: solid 1px #e4e7ed; - border-radius: 4px; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) +.el-input-group--append .el-input__inner { + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-cascader__tags { - position: absolute; - left: 0; - right: 30px; - top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - line-height: normal; - text-align: left; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-input-group--append .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-cascader__tags .el-tag { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - max-width: 100%; - margin: 2px 0 2px 6px; - text-overflow: ellipsis; - background: #f0f2f5 +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0 } -.el-cascader__tags .el-tag:not(.is-hit) { - border-color: transparent +.el-popper .popper__arrow, +.el-popper .popper__arrow::after { + position: absolute; + display: block; + width: 0; + height: 0; + border-color: transparent; + border-style: solid } -.el-cascader__tags .el-tag>span { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - overflow: hidden; - text-overflow: ellipsis +.el-popper .popper__arrow { + border-width: 6px; + -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03)); + filter: drop-shadow(0 2px 12px rgba(0, 0, 0, .03)) } -.el-cascader__tags .el-tag .el-icon-close { - -webkit-box-flex: 0; - -ms-flex: none; - flex: none; - background-color: #babdc2; - color: #fff +.el-popper .popper__arrow::after { + content: " "; + border-width: 6px } -.el-cascader__tags .el-tag .el-icon-close:hover { - background-color: #1e2226 +.el-popper[x-placement^=top] { + margin-bottom: 12px } -.el-cascader__suggestion-panel { - border-radius: 4px +.el-popper[x-placement^=top] .popper__arrow { + bottom: -6px; + left: 50%; + margin-right: 3px; + border-top-color: #ebeef5; + border-bottom-width: 0 } -.el-cascader__suggestion-list { - max-height: 204px; - margin: 0; - padding: 6px 0; - font-size: 14px; - color: #606266; - text-align: center +.el-popper[x-placement^=top] .popper__arrow::after { + bottom: 1px; + margin-left: -6px; + border-top-color: #fff; + border-bottom-width: 0 } -.el-cascader__suggestion-item { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - height: 34px; - padding: 0 15px; - text-align: left; - outline: 0; - cursor: pointer +.el-popper[x-placement^=bottom] { + margin-top: 12px } -.el-cascader__suggestion-item:focus, -.el-cascader__suggestion-item:hover { - background: #f5f7fa +.el-popper[x-placement^=bottom] .popper__arrow { + top: -6px; + left: 50%; + margin-right: 3px; + border-top-width: 0; + border-bottom-color: #ebeef5 } -.el-cascader__suggestion-item.is-checked { - color: #006aff; - font-weight: 700 +.el-popper[x-placement^=bottom] .popper__arrow::after { + top: 1px; + margin-left: -6px; + border-top-width: 0; + border-bottom-color: #fff } -.el-cascader__suggestion-item>span { - margin-right: 10px +.el-popper[x-placement^=right] { + margin-left: 12px } -.el-cascader__empty-text { - margin: 10px 0; - color: #babdc2 +.el-popper[x-placement^=right] .popper__arrow { + top: 50%; + left: -6px; + margin-bottom: 3px; + border-right-color: #ebeef5; + border-left-width: 0 } -.el-cascader__search-input { - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - height: 24px; - min-width: 60px; - margin: 2px 0 2px 15px; - padding: 0; - color: #606266; - border: none; - outline: 0; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-popper[x-placement^=right] .popper__arrow::after { + bottom: -6px; + left: 1px; + border-right-color: #fff; + border-left-width: 0 } -.el-cascader__search-input::-webkit-input-placeholder { - color: #babdc2 +.el-popper[x-placement^=left] { + margin-right: 12px } -.el-cascader__search-input::-moz-placeholder { - color: #babdc2 +.el-popper[x-placement^=left] .popper__arrow { + top: 50%; + right: -6px; + margin-bottom: 3px; + border-right-width: 0; + border-left-color: #ebeef5 } -.el-cascader__search-input::-ms-input-placeholder { - color: #babdc2 +.el-popper[x-placement^=left] .popper__arrow::after { + right: 1px; + bottom: -6px; + margin-left: -6px; + border-right-width: 0; + border-left-color: #fff } -.el-cascader__search-input::placeholder { - color: #babdc2 +.el-tag { + background-color: #e6f0ff; + border-color: #cce1ff; + color: #006aff; + display: inline-block; + height: 32px; + padding: 0 10px; + line-height: 30px; + font-size: 12px; + color: #006aff; + border-width: 1px; + border-style: solid; + border-radius: 4px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + white-space: nowrap } -.el-color-predefine { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - font-size: 12px; - margin-top: 8px; - width: 280px +.el-tag.is-hit { + border-color: #006aff } -.el-color-predefine__colors { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - -ms-flex-wrap: wrap; - flex-wrap: wrap +.el-tag .el-tag__close { + color: #006aff } -.el-color-predefine__color-selector { - margin: 0 0 8px 8px; - width: 20px; - height: 20px; - border-radius: 4px; - cursor: pointer +.el-tag .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-color-predefine__color-selector:nth-child(10n+1) { - margin-left: 0 +.el-tag.el-tag--info { + background-color: #f4f4f5; + border-color: #e9e9eb; + color: #909399 } -.el-color-predefine__color-selector.selected { - -webkit-box-shadow: 0 0 3px 2px #006aff; - box-shadow: 0 0 3px 2px #006aff +.el-tag.el-tag--info.is-hit { + border-color: #909399 } -.el-color-predefine__color-selector>div { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - height: 100%; - border-radius: 3px +.el-tag.el-tag--info .el-tag__close { + color: #909399 } -.el-color-predefine__color-selector.is-alpha { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) +.el-tag.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-color-hue-slider { - position: relative; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 280px; - height: 12px; - background-color: red; - padding: 0 2px +.el-tag.el-tag--success { + background-color: #e7f7ed; + border-color: #cfefdb; + color: #0daf49 } -.el-color-hue-slider__bar { - position: relative; - background: -webkit-gradient(linear, left top, right top, from(red), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(red)); - background: linear-gradient(to right, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%); - height: 100% +.el-tag.el-tag--success.is-hit { + border-color: #0daf49 } -.el-color-hue-slider__thumb { - position: absolute; - cursor: pointer; - -webkit-box-sizing: border-box; - box-sizing: border-box; - left: 0; - top: 0; - width: 4px; - height: 100%; - border-radius: 1px; - background: #fff; - border: 1px solid #f0f0f0; - -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .6); - box-shadow: 0 0 2px rgba(0, 0, 0, .6); - z-index: 1 +.el-tag.el-tag--success .el-tag__close { + color: #0daf49 } -.el-color-hue-slider.is-vertical { - width: 12px; - height: 180px; - padding: 2px 0 +.el-tag.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-color-hue-slider.is-vertical .el-color-hue-slider__bar { - background: -webkit-gradient(linear, left top, left bottom, from(red), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(red)); - background: linear-gradient(to bottom, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%) +.el-tag.el-tag--warning { + background-color: #fef3e8; + border-color: #fce7d0; + color: #f08614 } -.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb { - left: 0; - top: 0; - width: 100%; - height: 4px +.el-tag.el-tag--warning.is-hit { + border-color: #f08614 } -.el-color-svpanel { - position: relative; - width: 280px; - height: 180px +.el-tag.el-tag--warning .el-tag__close { + color: #f08614 } -.el-color-svpanel__black, -.el-color-svpanel__white { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0 +.el-tag.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f08614 } -.el-color-svpanel__white { - background: -webkit-gradient(linear, left top, right top, from(#fff), to(rgba(255, 255, 255, 0))); - background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)) +.el-tag.el-tag--danger { + background-color: #ffeded; + border-color: #ffdbdc; + color: #ff4d4f } -.el-color-svpanel__black { - background: -webkit-gradient(linear, left bottom, left top, from(#000), to(rgba(0, 0, 0, 0))); - background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)) +.el-tag.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-color-svpanel__cursor { - position: absolute +.el-tag.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-color-svpanel__cursor>div { - cursor: head; - width: 4px; - height: 4px; - -webkit-box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, .3), 0 0 1px 2px rgba(0, 0, 0, .4); - box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, .3), 0 0 1px 2px rgba(0, 0, 0, .4); - border-radius: 50%; - -webkit-transform: translate(-2px, -2px); - transform: translate(-2px, -2px) +.el-tag.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-color-alpha-slider { +.el-tag .el-icon-close { + border-radius: 50%; + text-align: center; position: relative; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 280px; - height: 12px; - background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) + cursor: pointer; + font-size: 12px; + height: 16px; + width: 16px; + line-height: 16px; + vertical-align: middle; + top: -1px; + right: -5px } -.el-color-alpha-slider__bar { - position: relative; - background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white)); - background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #fff 100%); - height: 100% +.el-tag .el-icon-close::before { + display: block } -.el-color-alpha-slider__thumb { - position: absolute; - cursor: pointer; - -webkit-box-sizing: border-box; - box-sizing: border-box; - left: 0; - top: 0; - width: 4px; - height: 100%; - border-radius: 1px; - background: #fff; - border: 1px solid #f0f0f0; - -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .6); - box-shadow: 0 0 2px rgba(0, 0, 0, .6); - z-index: 1 +.el-tag--dark { + background-color: #006aff; + border-color: #006aff; + color: #fff } -.el-color-alpha-slider.is-vertical { - width: 20px; - height: 180px +.el-tag--dark.is-hit { + border-color: #006aff } -.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar { - background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white)); - background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%) +.el-tag--dark .el-tag__close { + color: #fff } -.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb { - left: 0; - top: 0; - width: 100%; - height: 4px +.el-tag--dark .el-tag__close:hover { + color: #fff; + background-color: #38f } -.el-color-dropdown { - width: 300px +.el-tag--dark.el-tag--info { + background-color: #909399; + border-color: #909399; + color: #fff } -.el-color-dropdown__main-wrapper { - margin-bottom: 6px +.el-tag--dark.el-tag--info.is-hit { + border-color: #909399 } -.el-color-dropdown__main-wrapper::after { - content: ""; - display: table; - clear: both +.el-tag--dark.el-tag--info .el-tag__close { + color: #fff } -.el-color-dropdown__btns { - margin-top: 6px; - text-align: right +.el-tag--dark.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #a6a9ad } -.el-color-dropdown__value { - float: left; - line-height: 26px; - font-size: 12px; - color: #000; - width: 160px +.el-tag--dark.el-tag--success { + background-color: #0daf49; + border-color: #0daf49; + color: #fff } -.el-color-dropdown__btn { - border: 1px solid #dcdcdc; - color: #333; - line-height: 24px; - border-radius: 2px; - padding: 0 20px; - cursor: pointer; - background-color: transparent; - outline: 0; - font-size: 12px +.el-tag--dark.el-tag--success.is-hit { + border-color: #0daf49 +} + +.el-tag--dark.el-tag--success .el-tag__close { + color: #fff +} + +.el-tag--dark.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #3dbf6d } -.el-color-dropdown__btn[disabled] { - color: #ccc; - cursor: not-allowed +.el-tag--dark.el-tag--warning { + background-color: #f08614; + border-color: #f08614; + color: #fff } -.el-color-dropdown__btn:hover { - color: #006aff; - border-color: #006aff +.el-tag--dark.el-tag--warning.is-hit { + border-color: #f08614 } -.el-color-dropdown__link-btn { - cursor: pointer; - color: #006aff; - text-decoration: none; - padding: 15px; - font-size: 12px +.el-tag--dark.el-tag--warning .el-tag__close { + color: #fff } -.el-color-dropdown__link-btn:hover { - color: tint(#006aff, 20%) +.el-tag--dark.el-tag--warning .el-tag__close:hover { + color: #fff; + background-color: #f39e43 } -.el-color-picker { - display: inline-block; - position: relative; - line-height: normal; - height: 40px +.el-tag--dark.el-tag--danger { + background-color: #ff4d4f; + border-color: #ff4d4f; + color: #fff } -.el-color-picker.is-disabled .el-color-picker__trigger { - cursor: not-allowed +.el-tag--dark.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-color-picker--medium { - height: 36px +.el-tag--dark.el-tag--danger .el-tag__close { + color: #fff } -.el-color-picker--medium .el-color-picker__trigger { - height: 36px; - width: 36px +.el-tag--dark.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff7172 } -.el-color-picker--medium .el-color-picker__mask { - height: 34px; - width: 34px +.el-tag--plain { + background-color: #fff; + border-color: #99c3ff; + color: #006aff } -.el-color-picker--small { - height: 32px +.el-tag--plain.is-hit { + border-color: #006aff } -.el-color-picker--small .el-color-picker__trigger { - height: 32px; - width: 32px +.el-tag--plain .el-tag__close { + color: #006aff } -.el-color-picker--small .el-color-picker__mask { - height: 30px; - width: 30px +.el-tag--plain .el-tag__close:hover { + color: #fff; + background-color: #006aff } -.el-color-picker--small .el-color-picker__empty, -.el-color-picker--small .el-color-picker__icon { - -webkit-transform: translate3d(-50%, -50%, 0) scale(.8); - transform: translate3d(-50%, -50%, 0) scale(.8) +.el-tag--plain.el-tag--info { + background-color: #fff; + border-color: #d3d4d6; + color: #909399 } -.el-color-picker--mini { - height: 28px +.el-tag--plain.el-tag--info.is-hit { + border-color: #909399 } -.el-color-picker--mini .el-color-picker__trigger { - height: 28px; - width: 28px +.el-tag--plain.el-tag--info .el-tag__close { + color: #909399 } -.el-color-picker--mini .el-color-picker__mask { - height: 26px; - width: 26px +.el-tag--plain.el-tag--info .el-tag__close:hover { + color: #fff; + background-color: #909399 } -.el-color-picker--mini .el-color-picker__empty, -.el-color-picker--mini .el-color-picker__icon { - -webkit-transform: translate3d(-50%, -50%, 0) scale(.8); - transform: translate3d(-50%, -50%, 0) scale(.8) +.el-tag--plain.el-tag--success { + background-color: #fff; + border-color: #9edfb6; + color: #0daf49 } -.el-color-picker__mask { - height: 38px; - width: 38px; - border-radius: 4px; - position: absolute; - top: 1px; - left: 1px; - z-index: 1; - cursor: not-allowed; - background-color: rgba(255, 255, 255, .7) +.el-tag--plain.el-tag--success.is-hit { + border-color: #0daf49 } -.el-color-picker__trigger { - display: inline-block; - -webkit-box-sizing: border-box; - box-sizing: border-box; - height: 40px; - width: 40px; - padding: 4px; - border: 1px solid #e6e6e6; - border-radius: 4px; - font-size: 0; - position: relative; - cursor: pointer +.el-tag--plain.el-tag--success .el-tag__close { + color: #0daf49 } -.el-color-picker__color { - position: relative; - display: block; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border: 1px solid #999; - border-radius: 2px; - width: 100%; - height: 100%; - text-align: center +.el-tag--plain.el-tag--success .el-tag__close:hover { + color: #fff; + background-color: #0daf49 } -.el-color-picker__color.is-alpha { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) +.el-tag--plain.el-tag--warning { + background-color: #fff; + border-color: #f9cfa1; + color: #f08614 } -.el-color-picker__color-inner { - position: absolute; - left: 0; - top: 0; - right: 0; - bottom: 0 +.el-tag--plain.el-tag--warning.is-hit { + border-color: #f08614 } -.el-color-picker__empty { - font-size: 12px; - color: #999; - position: absolute; - top: 50%; - left: 50%; - -webkit-transform: translate3d(-50%, -50%, 0); - transform: translate3d(-50%, -50%, 0) +.el-tag--plain.el-tag--warning .el-tag__close { + color: #f08614 } -.el-color-picker__icon { - display: inline-block; - position: absolute; - width: 100%; - top: 50%; - left: 50%; - -webkit-transform: translate3d(-50%, -50%, 0); - transform: translate3d(-50%, -50%, 0); +.el-tag--plain.el-tag--warning .el-tag__close:hover { color: #fff; - text-align: center; - font-size: 12px + background-color: #f08614 } -.el-color-picker__panel { - position: absolute; - z-index: 10; - padding: 6px; - -webkit-box-sizing: content-box; - box-sizing: content-box; +.el-tag--plain.el-tag--danger { background-color: #fff; - border: 1px solid #ebeef5; - border-radius: 4px; - -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) + border-color: #ffb8b9; + color: #ff4d4f } -.el-textarea { - position: relative; - display: inline-block; - width: 100%; - vertical-align: bottom; - font-size: 14px +.el-tag--plain.el-tag--danger.is-hit { + border-color: #ff4d4f } -.el-textarea__inner { - display: block; - resize: vertical; - padding: 5px 15px; - line-height: 1.5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - font-size: inherit; - color: #606266; - background-color: #fff; - background-image: none; - border: 1px solid #dfe2e6; - border-radius: 4px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1) +.el-tag--plain.el-tag--danger .el-tag__close { + color: #ff4d4f } -.el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-tag--plain.el-tag--danger .el-tag__close:hover { + color: #fff; + background-color: #ff4d4f } -.el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-tag--medium { + height: 28px; + line-height: 26px } -.el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-tag--medium .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) } -.el-textarea__inner::placeholder { - color: #babdc2 +.el-tag--small { + height: 24px; + padding: 0 8px; + line-height: 22px +} + +.el-tag--small .el-icon-close { + -webkit-transform: scale(.8); + transform: scale(.8) +} + +.el-tag--mini { + height: 20px; + padding: 0 5px; + line-height: 19px +} + +.el-tag--mini .el-icon-close { + margin-left: -3px; + -webkit-transform: scale(.7); + transform: scale(.7) } -.el-textarea__inner:hover { - border-color: #babdc2 +.el-checkbox { + color: #606266; + font-weight: 500; + font-size: 14px; + position: relative; + cursor: pointer; + display: inline-block; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + margin-right: 30px } -.el-textarea__inner:focus { - outline: 0; - border-color: #006aff +.el-checkbox.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: normal; + height: 40px } -.el-textarea .el-input__count { - color: #909399; - background: #fff; - position: absolute; - font-size: 12px; - bottom: 5px; - right: 10px +.el-checkbox.is-bordered.is-checked { + border-color: #006aff } -.el-textarea.is-disabled .el-textarea__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; +.el-checkbox.is-bordered.is-disabled { + border-color: #ebeef5; cursor: not-allowed } -.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { - color: #babdc2 +.el-checkbox.is-bordered+.el-checkbox.is-bordered { + margin-left: 10px } -.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { - color: #babdc2 +.el-checkbox.is-bordered.el-checkbox--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px } -.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { - color: #babdc2 +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { + line-height: 17px; + font-size: 14px } -.el-textarea.is-disabled .el-textarea__inner::placeholder { - color: #babdc2 +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { + height: 14px; + width: 14px } -.el-textarea.is-exceed .el-textarea__inner { - border-color: #ff4d4f +.el-checkbox.is-bordered.el-checkbox--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px } -.el-textarea.is-exceed .el-input__count { - color: #ff4d4f +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { + line-height: 15px; + font-size: 12px } -.el-input { - position: relative; - font-size: 14px; - display: inline-block; - width: 100% +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { + height: 12px; + width: 12px } -.el-input::-webkit-scrollbar { - z-index: 11; - width: 6px +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-input::-webkit-scrollbar:horizontal { - height: 6px +.el-checkbox.is-bordered.el-checkbox--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px } -.el-input::-webkit-scrollbar-thumb { - border-radius: 5px; - width: 6px; - background: #b4bccc +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { + line-height: 12px; + font-size: 12px } -.el-input::-webkit-scrollbar-corner { - background: #fff +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { + height: 12px; + width: 12px } -.el-input::-webkit-scrollbar-track { - background: #fff +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-input::-webkit-scrollbar-track-piece { - background: #fff; - width: 6px +.el-checkbox__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-input .el-input__clear { - color: #babdc2; - font-size: 14px; - cursor: pointer; - -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); - transition: color .2s cubic-bezier(.645, .045, .355, 1) +.el-checkbox__input.is-disabled .el-checkbox__inner { + background-color: #edf2fc; + border-color: #dfe2e6; + cursor: not-allowed } -.el-input .el-input__clear:hover { - color: #1e2226 +.el-checkbox__input.is-disabled .el-checkbox__inner::after { + cursor: not-allowed; + border-color: #babdc2 } -.el-input .el-input__count { - height: 100%; - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - color: #909399; - font-size: 12px +.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { + cursor: not-allowed } -.el-input .el-input__count .el-input__count-inner { - background: #fff; - line-height: initial; - display: inline-block; - padding: 0 5px +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-input__inner { - -webkit-appearance: none; - background-color: #fff; - background-image: none; - border-radius: 4px; - border: 1px solid #dfe2e6; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #606266; - display: inline-block; - font-size: inherit; - height: 40px; - line-height: 40px; - outline: 0; - padding: 0 15px; - -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - transition: border-color .2s cubic-bezier(.645, .045, .355, 1); - width: 100% +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { + border-color: #babdc2 } -.el-input__inner::-ms-reveal { - display: none +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { + background-color: #babdc2; + border-color: #babdc2 } -.el-input__inner::-moz-placeholder { - color: #babdc2 +.el-checkbox__input.is-disabled+span.el-checkbox__label { + color: #babdc2; + cursor: not-allowed } -.el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-input__inner::placeholder { - color: #babdc2 +.el-checkbox__input.is-checked .el-checkbox__inner::after { + -webkit-transform: rotate(45deg) scaleY(1); + transform: rotate(45deg) scaleY(1) } -.el-input__inner:hover { - border-color: #babdc2 +.el-checkbox__input.is-checked+.el-checkbox__label { + color: #006aff } -.el-input__inner:focus { - outline: 0; +.el-checkbox__input.is-focus .el-checkbox__inner { border-color: #006aff } -.el-input__suffix { - position: absolute; - height: 100%; - right: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s; - pointer-events: none +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-input__suffix-inner { - pointer-events: all +.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { + content: ''; + position: absolute; + display: block; + background-color: #fff; + height: 2px; + -webkit-transform: scale(.5); + transform: scale(.5); + left: 0; + right: 0; + top: 5px } -.el-input__prefix { - position: absolute; - height: 100%; - left: 5px; - top: 0; - text-align: center; - color: #babdc2; - -webkit-transition: all .3s; - transition: all .3s +.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { + display: none } -.el-input__icon { - height: 100%; - width: 25px; - text-align: center; - -webkit-transition: all .3s; - transition: all .3s; - line-height: 40px +.el-checkbox__inner { + display: inline-block; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 2px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 14px; + height: 14px; + background-color: #fff; + z-index: 1; + -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); + transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) } -.el-input__icon:after { - content: ''; - height: 100%; - width: 0; - display: inline-block; - vertical-align: middle +.el-checkbox__inner:hover { + border-color: #006aff } -.el-input__validateIcon { - pointer-events: none +.el-checkbox__inner::after { + -webkit-box-sizing: content-box; + box-sizing: content-box; + content: ""; + border: 1px solid #fff; + border-left: 0; + border-top: 0; + height: 7px; + left: 4px; + position: absolute; + top: 1px; + -webkit-transform: rotate(45deg) scaleY(0); + transform: rotate(45deg) scaleY(0); + width: 3px; + -webkit-transition: -webkit-transform .15s ease-in .05s; + transition: -webkit-transform .15s ease-in .05s; + transition: transform .15s ease-in .05s; + transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; + -webkit-transform-origin: center; + transform-origin: center } -.el-input.is-active .el-input__inner { +.el-checkbox__original { + opacity: 0; outline: 0; - border-color: #006aff + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1 } -.el-input.is-disabled .el-input__inner { - background-color: #f5f7fa; - border-color: #e4e7ed; - color: #babdc2; - cursor: not-allowed +.el-checkbox__label { + display: inline-block; + padding-left: 10px; + line-height: 19px; + font-size: 14px } -.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { - color: #babdc2 +.el-checkbox:last-of-type { + margin-right: 0 } -.el-input.is-disabled .el-input__inner::-moz-placeholder { - color: #babdc2 +.el-checkbox-button { + position: relative; + display: inline-block } -.el-input.is-disabled .el-input__inner::-ms-input-placeholder { - color: #babdc2 +.el-checkbox-button__inner { + display: inline-block; + line-height: 1; + font-weight: 500; + white-space: nowrap; + vertical-align: middle; + cursor: pointer; + background: #fff; + border: 1px solid #dfe2e6; + border-left: 0; + color: #606266; + -webkit-appearance: none; + text-align: center; + -webkit-box-sizing: border-box; + box-sizing: border-box; + outline: 0; + margin: 0; + position: relative; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 0 } -.el-input.is-disabled .el-input__inner::placeholder { - color: #babdc2 +.el-checkbox-button__inner.is-round { + padding: 12px 20px } -.el-input.is-disabled .el-input__icon { - cursor: not-allowed +.el-checkbox-button__inner:hover { + color: #006aff } -.el-input.is-exceed .el-input__inner { - border-color: #ff4d4f +.el-checkbox-button__inner [class*=el-icon-] { + line-height: .9 } -.el-input.is-exceed .el-input__suffix .el-input__count { - color: #ff4d4f +.el-checkbox-button__inner [class*=el-icon-]+span { + margin-left: 5px } -.el-input--suffix .el-input__inner { - padding-right: 30px +.el-checkbox-button__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + z-index: -1 } -.el-input--prefix .el-input__inner { - padding-left: 30px +.el-checkbox-button.is-checked .el-checkbox-button__inner { + color: #fff; + background-color: #006aff; + border-color: #006aff; + -webkit-box-shadow: -1px 0 0 0 #66a6ff; + box-shadow: -1px 0 0 0 #66a6ff } -.el-input--medium { - font-size: 14px +.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { + border-left-color: #006aff } -.el-input--medium .el-input__inner { - height: 36px; - line-height: 36px +.el-checkbox-button.is-disabled .el-checkbox-button__inner { + color: #babdc2; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; + -webkit-box-shadow: none; + box-shadow: none } -.el-input--medium .el-input__icon { - line-height: 36px +.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { + border-left-color: #ebeef5 } -.el-input--small { - font-size: 13px +.el-checkbox-button:first-child .el-checkbox-button__inner { + border-left: 1px solid #dfe2e6; + border-radius: 4px 0 0 4px; + -webkit-box-shadow: none !important; + box-shadow: none !important } -.el-input--small .el-input__inner { - height: 32px; - line-height: 32px +.el-checkbox-button.is-focus .el-checkbox-button__inner { + border-color: #006aff } -.el-input--small .el-input__icon { - line-height: 32px +.el-checkbox-button:last-child .el-checkbox-button__inner { + border-radius: 0 4px 4px 0 } -.el-input--mini { - font-size: 12px +.el-checkbox-button--medium .el-checkbox-button__inner { + padding: 10px 20px; + font-size: 14px; + border-radius: 0 } -.el-input--mini .el-input__inner { - height: 28px; - line-height: 28px +.el-checkbox-button--medium .el-checkbox-button__inner.is-round { + padding: 10px 20px } -.el-input--mini .el-input__icon { - line-height: 28px +.el-checkbox-button--small .el-checkbox-button__inner { + padding: 9px 15px; + font-size: 12px; + border-radius: 0 } -.el-input-group { - line-height: normal; - display: inline-table; - width: 100%; - border-collapse: separate; - border-spacing: 0 +.el-checkbox-button--small .el-checkbox-button__inner.is-round { + padding: 9px 15px } -.el-input-group>.el-input__inner { - vertical-align: middle; - display: table-cell +.el-checkbox-button--mini .el-checkbox-button__inner { + padding: 7px 15px; + font-size: 12px; + border-radius: 0 } -.el-input-group__append, -.el-input-group__prepend { - background-color: #f5f7fa; - color: #909399; - vertical-align: middle; - display: table-cell; - position: relative; - border: 1px solid #dfe2e6; - border-radius: 4px; - padding: 0 20px; - width: 1px; - white-space: nowrap +.el-checkbox-button--mini .el-checkbox-button__inner.is-round { + padding: 7px 15px } -.el-input-group__append:focus, -.el-input-group__prepend:focus { - outline: 0 +.el-checkbox-group { + font-size: 0 } -.el-input-group__append .el-button, -.el-input-group__append .el-select, -.el-input-group__prepend .el-button, -.el-input-group__prepend .el-select { +.el-radio { + color: #606266; + font-weight: 500; + line-height: 1; + position: relative; + cursor: pointer; display: inline-block; - margin: -10px -20px + white-space: nowrap; + outline: 0; + font-size: 14px; + margin-right: 30px; + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none } -.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-radio.is-bordered { + padding: 12px 20px 0 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + height: 40px } -.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-radio.is-bordered.is-checked { + border-color: #006aff } -.el-input-group__prepend { - border-right: 0; - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-radio.is-bordered.is-disabled { + cursor: not-allowed; + border-color: #ebeef5 } -.el-input-group__append { - border-left: 0; - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-radio.is-bordered+.el-radio.is-bordered { + margin-left: 10px } -.el-input-group--prepend .el-input__inner { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-radio--medium.is-bordered { + padding: 10px 20px 0 10px; + border-radius: 4px; + height: 36px } -.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-radio--medium.is-bordered .el-radio__label { + font-size: 14px } -.el-input-group--append .el-input__inner { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-radio--medium.is-bordered .el-radio__inner { + height: 14px; + width: 14px } -.el-input-group--append .el-select .el-input.is-focus .el-input__inner { - border-color: transparent +.el-radio--small.is-bordered { + padding: 8px 15px 0 10px; + border-radius: 3px; + height: 32px } -.el-input__inner::-ms-clear { - display: none; - width: 0; - height: 0 +.el-radio--small.is-bordered .el-radio__label { + font-size: 12px } -.el-button { - display: inline-block; - line-height: 1; - white-space: nowrap; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-color: #dfe2e6; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - -webkit-transition: .1s; - transition: .1s; - font-weight: 500; - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 4px +.el-radio--small.is-bordered .el-radio__inner { + height: 12px; + width: 12px } -.el-button+.el-button { - margin-left: 10px +.el-radio--mini.is-bordered { + padding: 6px 15px 0 10px; + border-radius: 3px; + height: 28px } -.el-button.is-round { - padding: 12px 20px +.el-radio--mini.is-bordered .el-radio__label { + font-size: 12px } -.el-button:focus, -.el-button:hover { - color: #006aff; - border-color: #b3d2ff; - background-color: #e6f0ff +.el-radio--mini.is-bordered .el-radio__inner { + height: 12px; + width: 12px } -.el-button:active { - color: #005fe6; - border-color: #005fe6; - outline: 0 +.el-radio:last-child { + margin-right: 0 } -.el-button::-moz-focus-inner { - border: 0 +.el-radio__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-button [class*=el-icon-]+span { - margin-left: 5px +.el-radio__input.is-disabled .el-radio__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + cursor: not-allowed } -.el-button.is-plain:focus, -.el-button.is-plain:hover { - background: #fff; - border-color: #006aff; - color: #006aff +.el-radio__input.is-disabled .el-radio__inner::after { + cursor: not-allowed; + background-color: #f5f7fa } -.el-button.is-plain:active { - background: #fff; - border-color: #005fe6; - color: #005fe6; - outline: 0 +.el-radio__input.is-disabled .el-radio__inner+.el-radio__label { + cursor: not-allowed } -.el-button.is-active { - color: #005fe6; - border-color: #005fe6 +.el-radio__input.is-disabled.is-checked .el-radio__inner { + background-color: #f5f7fa; + border-color: #e4e7ed } -.el-button.is-disabled, -.el-button.is-disabled:focus, -.el-button.is-disabled:hover { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5 +.el-radio__input.is-disabled.is-checked .el-radio__inner::after { + background-color: #babdc2 } -.el-button.is-disabled.el-button--text { - background-color: transparent +.el-radio__input.is-disabled+span.el-radio__label { + color: #babdc2; + cursor: not-allowed } -.el-button.is-disabled.is-plain, -.el-button.is-disabled.is-plain:focus, -.el-button.is-disabled.is-plain:hover { - background-color: #fff; - border-color: #ebeef5; - color: #babdc2 +.el-radio__input.is-checked .el-radio__inner { + border-color: #006aff; + background: #006aff } -.el-button.is-loading { - position: relative; - pointer-events: none +.el-radio__input.is-checked .el-radio__inner::after { + -webkit-transform: translate(-50%, -50%) scale(1); + transform: translate(-50%, -50%) scale(1) } -.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-radio__input.is-checked+.el-radio__label { + color: #006aff } -.el-button.is-round { - border-radius: 20px; - padding: 12px 23px +.el-radio__input.is-focus .el-radio__inner { + border-color: #006aff } -.el-button.is-circle { - border-radius: 50%; - padding: 12px +.el-radio__inner { + border: 1px solid #dfe2e6; + border-radius: 100%; + width: 14px; + height: 14px; + background-color: #fff; + position: relative; + cursor: pointer; + display: inline-block; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button--primary { - color: #fff; - background-color: #006aff; +.el-radio__inner:hover { border-color: #006aff } -.el-button--primary:focus, -.el-button--primary:hover { - background: #38f; - border-color: #38f; - color: #fff +.el-radio__inner::after { + width: 4px; + height: 4px; + border-radius: 100%; + background-color: #fff; + content: ""; + position: absolute; + left: 50%; + top: 50%; + -webkit-transform: translate(-50%, -50%) scale(0); + transform: translate(-50%, -50%) scale(0); + -webkit-transition: -webkit-transform .15s ease-in; + transition: -webkit-transform .15s ease-in; + transition: transform .15s ease-in; + transition: transform .15s ease-in, -webkit-transform .15s ease-in } -.el-button--primary:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-radio__original { + opacity: 0; + outline: 0; + position: absolute; + z-index: -1; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: 0 } -.el-button--primary.is-active { - background: #005fe6; - border-color: #005fe6; - color: #fff +.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner { + -webkit-box-shadow: 0 0 2px 2px #006aff; + box-shadow: 0 0 2px 2px #006aff } -.el-button--primary.is-disabled, -.el-button--primary.is-disabled:active, -.el-button--primary.is-disabled:focus, -.el-button--primary.is-disabled:hover { - color: #fff; - background-color: #80b5ff; - border-color: #80b5ff +.el-radio__label { + font-size: 14px; + padding-left: 10px } -.el-button--primary.is-plain { - color: #006aff; - background: #e6f0ff; - border-color: #99c3ff +.el-scrollbar { + overflow: hidden; + position: relative +} + +.el-scrollbar:active>.el-scrollbar__bar, +.el-scrollbar:focus>.el-scrollbar__bar, +.el-scrollbar:hover>.el-scrollbar__bar { + opacity: 1; + -webkit-transition: opacity 340ms ease-out; + transition: opacity 340ms ease-out } -.el-button--primary.is-plain:focus, -.el-button--primary.is-plain:hover { - background: #006aff; - border-color: #006aff; - color: #fff +.el-scrollbar__wrap { + overflow: scroll; + height: 100% } -.el-button--primary.is-plain:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-scrollbar__wrap--hidden-default { + scrollbar-width: none } -.el-button--primary.is-plain.is-disabled, -.el-button--primary.is-plain.is-disabled:active, -.el-button--primary.is-plain.is-disabled:focus, -.el-button--primary.is-plain.is-disabled:hover { - color: #66a6ff; - background-color: #e6f0ff; - border-color: #cce1ff +.el-scrollbar__wrap--hidden-default::-webkit-scrollbar { + width: 0; + height: 0 } -.el-button--success { - color: #fff; - background-color: #0daf49; - border-color: #0daf49 +.el-scrollbar__thumb { + position: relative; + display: block; + width: 0; + height: 0; + cursor: pointer; + border-radius: inherit; + background-color: rgba(30, 34, 38, .3); + -webkit-transition: .3s background-color; + transition: .3s background-color } -.el-button--success:focus, -.el-button--success:hover { - background: #3dbf6d; - border-color: #3dbf6d; - color: #fff +.el-scrollbar__thumb:hover { + background-color: rgba(30, 34, 38, .5) } -.el-button--success:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-scrollbar__bar { + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + border-radius: 4px; + opacity: 0; + -webkit-transition: opacity 120ms ease-out; + transition: opacity 120ms ease-out } -.el-button--success.is-active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff +.el-scrollbar__bar.is-vertical { + width: 6px; + top: 2px } -.el-button--success.is-disabled, -.el-button--success.is-disabled:active, -.el-button--success.is-disabled:focus, -.el-button--success.is-disabled:hover { - color: #fff; - background-color: #86d7a4; - border-color: #86d7a4 +.el-scrollbar__bar.is-vertical>div { + width: 100% } -.el-button--success.is-plain { - color: #0daf49; - background: #e7f7ed; - border-color: #9edfb6 +.el-scrollbar__bar.is-horizontal { + height: 6px; + left: 2px } -.el-button--success.is-plain:focus, -.el-button--success.is-plain:hover { - background: #0daf49; - border-color: #0daf49; - color: #fff +.el-scrollbar__bar.is-horizontal>div { + height: 100% } -.el-button--success.is-plain:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-cascader-panel { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + border-radius: 4px; + font-size: 14px } -.el-button--success.is-plain.is-disabled, -.el-button--success.is-plain.is-disabled:active, -.el-button--success.is-plain.is-disabled:focus, -.el-button--success.is-plain.is-disabled:hover { - color: #6ecf92; - background-color: #e7f7ed; - border-color: #cfefdb +.el-cascader-panel.is-bordered { + border: solid 1px #e4e7ed; + border-radius: 4px } -.el-button--warning { - color: #fff; - background-color: #f08614; - border-color: #f08614 +.el-cascader-menu { + min-width: 180px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + border-right: solid 1px #e4e7ed } -.el-button--warning:focus, -.el-button--warning:hover { - background: #f39e43; - border-color: #f39e43; - color: #fff +.el-cascader-menu:last-child { + border-right: none } -.el-button--warning:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-cascader-menu:last-child .el-cascader-node { + padding-right: 20px } -.el-button--warning.is-active { - background: #d87912; - border-color: #d87912; - color: #fff +.el-cascader-menu__wrap { + height: 204px } -.el-button--warning.is-disabled, -.el-button--warning.is-disabled:active, -.el-button--warning.is-disabled:focus, -.el-button--warning.is-disabled:hover { - color: #fff; - background-color: #f8c38a; - border-color: #f8c38a +.el-cascader-menu__list { + position: relative; + min-height: 100%; + margin: 0; + padding: 6px 0; + list-style: none; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button--warning.is-plain { - color: #f08614; - background: #fef3e8; - border-color: #f9cfa1 +.el-cascader-menu__hover-zone { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + pointer-events: none } -.el-button--warning.is-plain:focus, -.el-button--warning.is-plain:hover { - background: #f08614; - border-color: #f08614; - color: #fff +.el-cascader-menu__empty-text { + position: absolute; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + text-align: center; + color: #babdc2 } -.el-button--warning.is-plain:active { - background: #d87912; - border-color: #d87912; - color: #fff; +.el-cascader-node { + position: relative; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + padding: 0 30px 0 20px; + height: 34px; + line-height: 34px; outline: 0 } -.el-button--warning.is-plain.is-disabled, -.el-button--warning.is-plain.is-disabled:active, -.el-button--warning.is-plain.is-disabled:focus, -.el-button--warning.is-plain.is-disabled:hover { - color: #f6b672; - background-color: #fef3e8; - border-color: #fce7d0 +.el-cascader-node.is-selectable.in-active-path { + color: #606266 } -.el-button--danger { - color: #fff; - background-color: #ff4d4f; - border-color: #ff4d4f +.el-cascader-node.in-active-path, +.el-cascader-node.is-active, +.el-cascader-node.is-selectable.in-checked-path { + color: #006aff; + font-weight: 700 } -.el-button--danger:focus, -.el-button--danger:hover { - background: #ff7172; - border-color: #ff7172; - color: #fff +.el-cascader-node:not(.is-disabled) { + cursor: pointer } -.el-button--danger:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-cascader-node:not(.is-disabled):focus, +.el-cascader-node:not(.is-disabled):hover { + background: #f5f7fa } -.el-button--danger.is-active { - background: #e64547; - border-color: #e64547; - color: #fff +.el-cascader-node.is-disabled { + color: #babdc2; + cursor: not-allowed } -.el-button--danger.is-disabled, -.el-button--danger.is-disabled:active, -.el-button--danger.is-disabled:focus, -.el-button--danger.is-disabled:hover { - color: #fff; - background-color: #ffa6a7; - border-color: #ffa6a7 +.el-cascader-node__prefix { + position: absolute; + left: 10px } -.el-button--danger.is-plain { - color: #ff4d4f; - background: #ffeded; - border-color: #ffb8b9 +.el-cascader-node__postfix { + position: absolute; + right: 10px } -.el-button--danger.is-plain:focus, -.el-button--danger.is-plain:hover { - background: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-cascader-node__label { + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + padding: 0 10px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis } -.el-button--danger.is-plain:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-cascader-node>.el-radio { + margin-right: 0 } -.el-button--danger.is-plain.is-disabled, -.el-button--danger.is-plain.is-disabled:active, -.el-button--danger.is-plain.is-disabled:focus, -.el-button--danger.is-plain.is-disabled:hover { - color: #ff9495; - background-color: #ffeded; - border-color: #ffdbdc +.el-cascader-node>.el-radio .el-radio__label { + padding-left: 0 } -.el-button--info { - color: #fff; - background-color: #909399; - border-color: #909399 +.el-cascader { + display: inline-block; + position: relative; + font-size: 14px; + line-height: 40px } -.el-button--info:focus, -.el-button--info:hover { - background: #a6a9ad; - border-color: #a6a9ad; - color: #fff +.el-cascader:not(.is-disabled):hover .el-input__inner { + cursor: pointer; + border-color: #babdc2 } -.el-button--info:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-cascader .el-input { + cursor: pointer } -.el-button--info.is-active { - background: #82848a; - border-color: #82848a; - color: #fff +.el-cascader .el-input .el-input__inner { + text-overflow: ellipsis } -.el-button--info.is-disabled, -.el-button--info.is-disabled:active, -.el-button--info.is-disabled:focus, -.el-button--info.is-disabled:hover { - color: #fff; - background-color: #c8c9cc; - border-color: #c8c9cc +.el-cascader .el-input .el-input__inner:focus { + border-color: #006aff } -.el-button--info.is-plain { - color: #909399; - background: #f4f4f5; - border-color: #d3d4d6 +.el-cascader .el-input .el-icon-arrow-down { + -webkit-transition: -webkit-transform .3s; + transition: -webkit-transform .3s; + transition: transform .3s; + transition: transform .3s, -webkit-transform .3s; + font-size: 14px } -.el-button--info.is-plain:focus, -.el-button--info.is-plain:hover { - background: #909399; - border-color: #909399; - color: #fff +.el-cascader .el-input .el-icon-arrow-down.is-reverse { + -webkit-transform: rotateZ(180deg); + transform: rotateZ(180deg) } -.el-button--info.is-plain:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-cascader .el-input .el-icon-circle-close:hover { + color: #1e2226 } -.el-button--info.is-plain.is-disabled, -.el-button--info.is-plain.is-disabled:active, -.el-button--info.is-plain.is-disabled:focus, -.el-button--info.is-plain.is-disabled:hover { - color: #bcbec2; - background-color: #f4f4f5; - border-color: #e9e9eb +.el-cascader .el-input.is-focus .el-input__inner { + border-color: #006aff } -.el-button--medium { - padding: 10px 20px; +.el-cascader--medium { font-size: 14px; - border-radius: 4px -} - -.el-button--medium.is-round { - padding: 10px 20px + line-height: 36px } -.el-button--medium.is-circle { - padding: 10px +.el-cascader--small { + font-size: 13px; + line-height: 32px } -.el-button--small { - padding: 9px 15px; +.el-cascader--mini { font-size: 12px; - border-radius: 3px + line-height: 28px } -.el-button--small.is-round { - padding: 9px 15px +.el-cascader.is-disabled .el-cascader__label { + z-index: 2; + color: #babdc2 } -.el-button--small.is-circle { - padding: 9px +.el-cascader__dropdown { + margin: 5px 0; + font-size: 14px; + background: #fff; + border: solid 1px #e4e7ed; + border-radius: 4px; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) } -.el-button--mini { - padding: 7px 15px; - font-size: 12px; - border-radius: 3px +.el-cascader__tags { + position: absolute; + left: 0; + right: 30px; + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + line-height: normal; + text-align: left; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button--mini.is-round { - padding: 7px 15px +.el-cascader__tags .el-tag { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + max-width: 100%; + margin: 2px 0 2px 6px; + text-overflow: ellipsis; + background: #f0f2f5 } -.el-button--mini.is-circle { - padding: 7px +.el-cascader__tags .el-tag:not(.is-hit) { + border-color: transparent } -.el-button--text { - border-color: transparent; - color: #006aff; - background: 0 0; - padding-left: 0; - padding-right: 0 +.el-cascader__tags .el-tag>span { + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + overflow: hidden; + text-overflow: ellipsis } -.el-button--text:focus, -.el-button--text:hover { - color: #38f; - border-color: transparent; - background-color: transparent +.el-cascader__tags .el-tag .el-icon-close { + -webkit-box-flex: 0; + -ms-flex: none; + flex: none; + background-color: #babdc2; + color: #fff } -.el-button--text:active { - color: #005fe6; - border-color: transparent; - background-color: transparent +.el-cascader__tags .el-tag .el-icon-close:hover { + background-color: #1e2226 } -.el-button--text.is-disabled, -.el-button--text.is-disabled:focus, -.el-button--text.is-disabled:hover { - border-color: transparent +.el-cascader__suggestion-panel { + border-radius: 4px } -.el-button-group { - display: inline-block; - vertical-align: middle +.el-cascader__suggestion-list { + max-height: 204px; + margin: 0; + padding: 6px 0; + font-size: 14px; + color: #606266; + text-align: center } -.el-button-group::after, -.el-button-group::before { - display: table; - content: "" +.el-cascader__suggestion-item { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; + justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + height: 34px; + padding: 0 15px; + text-align: left; + outline: 0; + cursor: pointer } -.el-button-group::after { - clear: both +.el-cascader__suggestion-item:focus, +.el-cascader__suggestion-item:hover { + background: #f5f7fa } -.el-button-group>.el-button { - float: left; - position: relative +.el-cascader__suggestion-item.is-checked { + color: #006aff; + font-weight: 700 } -.el-button-group>.el-button+.el-button { - margin-left: 0 +.el-cascader__suggestion-item>span { + margin-right: 10px } -.el-button-group>.el-button.is-disabled { - z-index: 1 +.el-cascader__empty-text { + margin: 10px 0; + color: #babdc2 } -.el-button-group>.el-button:first-child { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-cascader__search-input { + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + height: 24px; + min-width: 60px; + margin: 2px 0 2px 15px; + padding: 0; + color: #606266; + border: none; + outline: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box } -.el-button-group>.el-button:last-child { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-cascader__search-input::-webkit-input-placeholder { + color: #babdc2 } -.el-button-group>.el-button:first-child:last-child { - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - border-top-left-radius: 4px; - border-bottom-left-radius: 4px +.el-cascader__search-input::-moz-placeholder { + color: #babdc2 } -.el-button-group>.el-button:first-child:last-child.is-round { - border-radius: 20px +.el-cascader__search-input::-ms-input-placeholder { + color: #babdc2 } -.el-button-group>.el-button:first-child:last-child.is-circle { - border-radius: 50% +.el-cascader__search-input::placeholder { + color: #babdc2 } -.el-button-group>.el-button:not(:first-child):not(:last-child) { - border-radius: 0 +.el-color-predefine { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + font-size: 12px; + margin-top: 8px; + width: 280px } -.el-button-group>.el-button:not(:last-child) { - margin-right: -1px +.el-color-predefine__colors { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + -ms-flex-wrap: wrap; + flex-wrap: wrap } -.el-button-group>.el-button:not(.is-disabled):active, -.el-button-group>.el-button:not(.is-disabled):focus, -.el-button-group>.el-button:not(.is-disabled):hover { - z-index: 1 +.el-color-predefine__color-selector { + margin: 0 0 8px 8px; + width: 20px; + height: 20px; + border-radius: 4px; + cursor: pointer } -.el-button-group>.el-button.is-active { - z-index: 1 +.el-color-predefine__color-selector:nth-child(10n+1) { + margin-left: 0 } -.el-button-group>.el-dropdown>.el-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-color: rgba(255, 255, 255, .5) +.el-color-predefine__color-selector.selected { + -webkit-box-shadow: 0 0 3px 2px #006aff; + box-shadow: 0 0 3px 2px #006aff } -.el-button-group .el-button--primary:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-color-predefine__color-selector>div { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + height: 100%; + border-radius: 3px } -.el-button-group .el-button--primary:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-color-predefine__color-selector.is-alpha { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) } -.el-button-group .el-button--primary:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-color-hue-slider { + position: relative; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 280px; + height: 12px; + background-color: red; + padding: 0 2px } -.el-button-group .el-button--success:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-color-hue-slider__bar { + position: relative; + background: -webkit-gradient(linear, left top, right top, from(red), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(red)); + background: linear-gradient(to right, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%); + height: 100% } -.el-button-group .el-button--success:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-color-hue-slider__thumb { + position: absolute; + cursor: pointer; + -webkit-box-sizing: border-box; + box-sizing: border-box; + left: 0; + top: 0; + width: 4px; + height: 100%; + border-radius: 1px; + background: #fff; + border: 1px solid #f0f0f0; + -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .6); + box-shadow: 0 0 2px rgba(0, 0, 0, .6); + z-index: 1 } -.el-button-group .el-button--success:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-color-hue-slider.is-vertical { + width: 12px; + height: 180px; + padding: 2px 0 } -.el-button-group .el-button--warning:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-color-hue-slider.is-vertical .el-color-hue-slider__bar { + background: -webkit-gradient(linear, left top, left bottom, from(red), color-stop(17%, #ff0), color-stop(33%, #0f0), color-stop(50%, #0ff), color-stop(67%, #00f), color-stop(83%, #f0f), to(red)); + background: linear-gradient(to bottom, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%) } -.el-button-group .el-button--warning:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb { + left: 0; + top: 0; + width: 100%; + height: 4px } -.el-button-group .el-button--warning:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-color-svpanel { + position: relative; + width: 280px; + height: 180px } -.el-button-group .el-button--danger:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-color-svpanel__black, +.el-color-svpanel__white { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0 } -.el-button-group .el-button--danger:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-color-svpanel__white { + background: -webkit-gradient(linear, left top, right top, from(#fff), to(rgba(255, 255, 255, 0))); + background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)) } -.el-button-group .el-button--danger:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-color-svpanel__black { + background: -webkit-gradient(linear, left bottom, left top, from(#000), to(rgba(0, 0, 0, 0))); + background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)) } -.el-button-group .el-button--info:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-color-svpanel__cursor { + position: absolute } -.el-button-group .el-button--info:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-color-svpanel__cursor>div { + cursor: head; + width: 4px; + height: 4px; + -webkit-box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, .3), 0 0 1px 2px rgba(0, 0, 0, .4); + box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, .3), 0 0 1px 2px rgba(0, 0, 0, .4); + border-radius: 50%; + -webkit-transform: translate(-2px, -2px); + transform: translate(-2px, -2px) } -.el-button-group .el-button--info:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-color-alpha-slider { + position: relative; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 280px; + height: 12px; + background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) } -.el-checkbox { - color: #606266; - font-weight: 500; - font-size: 14px; +.el-color-alpha-slider__bar { position: relative; - cursor: pointer; - display: inline-block; - white-space: nowrap; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - margin-right: 30px + background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white)); + background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #fff 100%); + height: 100% } -.el-checkbox.is-bordered { - padding: 9px 20px 9px 10px; - border-radius: 4px; - border: 1px solid #dfe2e6; +.el-color-alpha-slider__thumb { + position: absolute; + cursor: pointer; -webkit-box-sizing: border-box; box-sizing: border-box; - line-height: normal; - height: 40px -} - -.el-checkbox.is-bordered.is-checked { - border-color: #006aff + left: 0; + top: 0; + width: 4px; + height: 100%; + border-radius: 1px; + background: #fff; + border: 1px solid #f0f0f0; + -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .6); + box-shadow: 0 0 2px rgba(0, 0, 0, .6); + z-index: 1 } -.el-checkbox.is-bordered.is-disabled { - border-color: #ebeef5; - cursor: not-allowed +.el-color-alpha-slider.is-vertical { + width: 20px; + height: 180px } -.el-checkbox.is-bordered+.el-checkbox.is-bordered { - margin-left: 10px +.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar { + background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white)); + background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%) } -.el-checkbox.is-bordered.el-checkbox--medium { - padding: 7px 20px 7px 10px; - border-radius: 4px; - height: 36px +.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb { + left: 0; + top: 0; + width: 100%; + height: 4px } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { - line-height: 17px; - font-size: 14px +.el-color-dropdown { + width: 300px } -.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { - height: 14px; - width: 14px +.el-color-dropdown__main-wrapper { + margin-bottom: 6px } -.el-checkbox.is-bordered.el-checkbox--small { - padding: 5px 15px 5px 10px; - border-radius: 3px; - height: 32px +.el-color-dropdown__main-wrapper::after { + content: ""; + display: table; + clear: both } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { - line-height: 15px; - font-size: 12px +.el-color-dropdown__btns { + margin-top: 6px; + text-align: right } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { - height: 12px; - width: 12px +.el-color-dropdown__value { + float: left; + line-height: 26px; + font-size: 12px; + color: #000; + width: 160px } -.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-color-dropdown__btn { + border: 1px solid #dcdcdc; + color: #333; + line-height: 24px; + border-radius: 2px; + padding: 0 20px; + cursor: pointer; + background-color: transparent; + outline: 0; + font-size: 12px } -.el-checkbox.is-bordered.el-checkbox--mini { - padding: 3px 15px 3px 10px; - border-radius: 3px; - height: 28px +.el-color-dropdown__btn[disabled] { + color: #ccc; + cursor: not-allowed } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { - line-height: 12px; - font-size: 12px +.el-color-dropdown__btn:hover { + color: #006aff; + border-color: #006aff } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { - height: 12px; - width: 12px +.el-color-dropdown__link-btn { + cursor: pointer; + color: #006aff; + text-decoration: none; + padding: 15px; + font-size: 12px } -.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { - height: 6px; - width: 2px +.el-color-dropdown__link-btn:hover { + color: tint(#006aff, 20%) } -.el-checkbox__input { - white-space: nowrap; - cursor: pointer; - outline: 0; +.el-color-picker { display: inline-block; - line-height: 1; position: relative; - vertical-align: middle + line-height: normal; + height: 40px } -.el-checkbox__input.is-disabled .el-checkbox__inner { - background-color: #edf2fc; - border-color: #dfe2e6; +.el-color-picker.is-disabled .el-color-picker__trigger { cursor: not-allowed } -.el-checkbox__input.is-disabled .el-checkbox__inner::after { - cursor: not-allowed; - border-color: #babdc2 +.el-color-picker--medium { + height: 36px } -.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { - cursor: not-allowed +.el-color-picker--medium .el-color-picker__trigger { + height: 36px; + width: 36px } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-color-picker--medium .el-color-picker__mask { + height: 34px; + width: 34px } -.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { - border-color: #babdc2 +.el-color-picker--small { + height: 32px } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { - background-color: #f2f6fc; - border-color: #dfe2e6 +.el-color-picker--small .el-color-picker__trigger { + height: 32px; + width: 32px } -.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { - background-color: #babdc2; - border-color: #babdc2 +.el-color-picker--small .el-color-picker__mask { + height: 30px; + width: 30px } -.el-checkbox__input.is-disabled+span.el-checkbox__label { - color: #babdc2; - cursor: not-allowed +.el-color-picker--small .el-color-picker__empty, +.el-color-picker--small .el-color-picker__icon { + -webkit-transform: translate3d(-50%, -50%, 0) scale(.8); + transform: translate3d(-50%, -50%, 0) scale(.8) } -.el-checkbox__input.is-checked .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-color-picker--mini { + height: 28px } -.el-checkbox__input.is-checked .el-checkbox__inner::after { - -webkit-transform: rotate(45deg) scaleY(1); - transform: rotate(45deg) scaleY(1) +.el-color-picker--mini .el-color-picker__trigger { + height: 28px; + width: 28px } -.el-checkbox__input.is-checked+.el-checkbox__label { - color: #006aff +.el-color-picker--mini .el-color-picker__mask { + height: 26px; + width: 26px } -.el-checkbox__input.is-focus .el-checkbox__inner { - border-color: #006aff +.el-color-picker--mini .el-color-picker__empty, +.el-color-picker--mini .el-color-picker__icon { + -webkit-transform: translate3d(-50%, -50%, 0) scale(.8); + transform: translate3d(-50%, -50%, 0) scale(.8) } -.el-checkbox__input.is-indeterminate .el-checkbox__inner { - background-color: #006aff; - border-color: #006aff +.el-color-picker__mask { + height: 38px; + width: 38px; + border-radius: 4px; + position: absolute; + top: 1px; + left: 1px; + z-index: 1; + cursor: not-allowed; + background-color: rgba(255, 255, 255, .7) } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { - content: ''; - position: absolute; +.el-color-picker__trigger { + display: inline-block; + -webkit-box-sizing: border-box; + box-sizing: border-box; + height: 40px; + width: 40px; + padding: 4px; + border: 1px solid #e6e6e6; + border-radius: 4px; + font-size: 0; + position: relative; + cursor: pointer +} + +.el-color-picker__color { + position: relative; display: block; - background-color: #fff; - height: 2px; - -webkit-transform: scale(.5); - transform: scale(.5); + -webkit-box-sizing: border-box; + box-sizing: border-box; + border: 1px solid #999; + border-radius: 2px; + width: 100%; + height: 100%; + text-align: center +} + +.el-color-picker__color.is-alpha { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==) +} + +.el-color-picker__color-inner { + position: absolute; left: 0; + top: 0; right: 0; - top: 5px + bottom: 0 } -.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { - display: none +.el-color-picker__empty { + font-size: 12px; + color: #999; + position: absolute; + top: 50%; + left: 50%; + -webkit-transform: translate3d(-50%, -50%, 0); + transform: translate3d(-50%, -50%, 0) } -.el-checkbox__inner { +.el-color-picker__icon { display: inline-block; + position: absolute; + width: 100%; + top: 50%; + left: 50%; + -webkit-transform: translate3d(-50%, -50%, 0); + transform: translate3d(-50%, -50%, 0); + color: #fff; + text-align: center; + font-size: 12px +} + +.el-color-picker__panel { + position: absolute; + z-index: 10; + padding: 6px; + -webkit-box-sizing: content-box; + box-sizing: content-box; + background-color: #fff; + border: 1px solid #ebeef5; + border-radius: 4px; + -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1); + box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1) +} + +.el-textarea { position: relative; - border: 1px solid #dfe2e6; - border-radius: 2px; + display: inline-block; + width: 100%; + vertical-align: bottom; + font-size: 14px +} + +.el-textarea__inner { + display: block; + resize: vertical; + padding: 5px 15px; + line-height: 1.5; -webkit-box-sizing: border-box; box-sizing: border-box; - width: 14px; - height: 14px; + width: 100%; + font-size: inherit; + color: #606266; background-color: #fff; - z-index: 1; - -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); - transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) + background-image: none; + border: 1px solid #dfe2e6; + border-radius: 4px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1) } -.el-checkbox__inner:hover { - border-color: #006aff +.el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-checkbox__inner::after { - -webkit-box-sizing: content-box; - box-sizing: content-box; - content: ""; - border: 1px solid #fff; - border-left: 0; - border-top: 0; - height: 7px; - left: 4px; - position: absolute; - top: 1px; - -webkit-transform: rotate(45deg) scaleY(0); - transform: rotate(45deg) scaleY(0); - width: 3px; - -webkit-transition: -webkit-transform .15s ease-in .05s; - transition: -webkit-transform .15s ease-in .05s; - transition: transform .15s ease-in .05s; - transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; - -webkit-transform-origin: center; - transform-origin: center +.el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-checkbox__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - width: 0; - height: 0; - z-index: -1 +.el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-checkbox__label { - display: inline-block; - padding-left: 10px; - line-height: 19px; - font-size: 14px +.el-textarea__inner::placeholder { + color: #babdc2 } -.el-checkbox:last-of-type { - margin-right: 0 +.el-textarea__inner:hover { + border-color: #babdc2 } -.el-checkbox-button { - position: relative; - display: inline-block +.el-textarea__inner:focus { + outline: 0; + border-color: #006aff } -.el-checkbox-button__inner { - display: inline-block; - line-height: 1; - font-weight: 500; - white-space: nowrap; - vertical-align: middle; - cursor: pointer; +.el-textarea .el-input__count { + color: #909399; background: #fff; - border: 1px solid #dfe2e6; - border-left: 0; - color: #606266; - -webkit-appearance: none; - text-align: center; - -webkit-box-sizing: border-box; - box-sizing: border-box; - outline: 0; - margin: 0; - position: relative; - -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); - transition: all .3s cubic-bezier(.645, .045, .355, 1); - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 0 + position: absolute; + font-size: 12px; + bottom: 5px; + right: 10px } -.el-checkbox-button__inner.is-round { - padding: 12px 20px +.el-textarea.is-disabled .el-textarea__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-checkbox-button__inner:hover { - color: #006aff +.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-checkbox-button__inner [class*=el-icon-] { - line-height: .9 +.el-textarea.is-disabled .el-textarea__inner::-moz-placeholder { + color: #babdc2 } -.el-checkbox-button__inner [class*=el-icon-]+span { - margin-left: 5px +.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder { + color: #babdc2 } -.el-checkbox-button__original { - opacity: 0; - outline: 0; - position: absolute; - margin: 0; - z-index: -1 +.el-textarea.is-disabled .el-textarea__inner::placeholder { + color: #babdc2 } -.el-checkbox-button.is-checked .el-checkbox-button__inner { - color: #fff; - background-color: #006aff; - border-color: #006aff; - -webkit-box-shadow: -1px 0 0 0 #66a6ff; - box-shadow: -1px 0 0 0 #66a6ff +.el-textarea.is-exceed .el-textarea__inner { + border-color: #ff4d4f } -.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { - border-left-color: #006aff +.el-textarea.is-exceed .el-input__count { + color: #ff4d4f } -.el-checkbox-button.is-disabled .el-checkbox-button__inner { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5; - -webkit-box-shadow: none; - box-shadow: none +.el-input { + position: relative; + font-size: 14px; + display: inline-block; + width: 100% } -.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { - border-left-color: #ebeef5 +.el-input::-webkit-scrollbar { + z-index: 11; + width: 6px } -.el-checkbox-button:first-child .el-checkbox-button__inner { - border-left: 1px solid #dfe2e6; - border-radius: 4px 0 0 4px; - -webkit-box-shadow: none !important; - box-shadow: none !important +.el-input::-webkit-scrollbar:horizontal { + height: 6px } -.el-checkbox-button.is-focus .el-checkbox-button__inner { - border-color: #006aff +.el-input::-webkit-scrollbar-thumb { + border-radius: 5px; + width: 6px; + background: #b4bccc } -.el-checkbox-button:last-child .el-checkbox-button__inner { - border-radius: 0 4px 4px 0 +.el-input::-webkit-scrollbar-corner { + background: #fff } -.el-checkbox-button--medium .el-checkbox-button__inner { - padding: 10px 20px; - font-size: 14px; - border-radius: 0 +.el-input::-webkit-scrollbar-track { + background: #fff } -.el-checkbox-button--medium .el-checkbox-button__inner.is-round { - padding: 10px 20px +.el-input::-webkit-scrollbar-track-piece { + background: #fff; + width: 6px } -.el-checkbox-button--small .el-checkbox-button__inner { - padding: 9px 15px; - font-size: 12px; - border-radius: 0 +.el-input .el-input__clear { + color: #babdc2; + font-size: 14px; + cursor: pointer; + -webkit-transition: color .2s cubic-bezier(.645, .045, .355, 1); + transition: color .2s cubic-bezier(.645, .045, .355, 1) } -.el-checkbox-button--small .el-checkbox-button__inner.is-round { - padding: 9px 15px +.el-input .el-input__clear:hover { + color: #1e2226 } -.el-checkbox-button--mini .el-checkbox-button__inner { - padding: 7px 15px; - font-size: 12px; - border-radius: 0 +.el-input .el-input__count { + height: 100%; + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + color: #909399; + font-size: 12px } -.el-checkbox-button--mini .el-checkbox-button__inner.is-round { - padding: 7px 15px +.el-input .el-input__count .el-input__count-inner { + background: #fff; + line-height: initial; + display: inline-block; + padding: 0 5px } -.el-checkbox-group { - font-size: 0 +.el-input__inner { + -webkit-appearance: none; + background-color: #fff; + background-image: none; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #606266; + display: inline-block; + font-size: inherit; + height: 40px; + line-height: 40px; + outline: 0; + padding: 0 15px; + -webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + transition: border-color .2s cubic-bezier(.645, .045, .355, 1); + width: 100% } -.el-transfer { - font-size: 14px +.el-input__inner::-ms-reveal { + display: none } -.el-transfer__buttons { - display: inline-block; - vertical-align: middle; - padding: 0 30px +.el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-transfer__button { - display: block; - margin: 0 auto; - padding: 10px; - border-radius: 50%; - color: #fff; - background-color: #006aff; - font-size: 0 +.el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-transfer__button.is-with-texts { - border-radius: 4px +.el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.el-transfer__button.is-disabled { - border: 1px solid #dfe2e6; - background-color: #f5f7fa; +.el-input__inner::placeholder { color: #babdc2 } -.el-transfer__button.is-disabled:hover { - border: 1px solid #dfe2e6; - background-color: #f5f7fa; - color: #babdc2 +.el-input__inner:hover { + border-color: #babdc2 } -.el-transfer__button:first-child { - margin-bottom: 10px +.el-input__inner:focus { + outline: 0; + border-color: #006aff } -.el-transfer__button:nth-child(2) { - margin: 0 +.el-input__suffix { + position: absolute; + height: 100%; + right: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s; + pointer-events: none } -.el-transfer__button i, -.el-transfer__button span { - font-size: 14px +.el-input__suffix-inner { + pointer-events: all } -.el-transfer__button [class*=el-icon-]+span { - margin-left: 0 +.el-input__prefix { + position: absolute; + height: 100%; + left: 5px; + top: 0; + text-align: center; + color: #babdc2; + -webkit-transition: all .3s; + transition: all .3s } -.el-transfer-panel { - border: 1px solid #ebeef5; - border-radius: 4px; - overflow: hidden; - background: #fff; +.el-input__icon { + height: 100%; + width: 25px; + text-align: center; + -webkit-transition: all .3s; + transition: all .3s; + line-height: 40px +} + +.el-input__icon:after { + content: ''; + height: 100%; + width: 0; display: inline-block; - vertical-align: middle; - width: 200px; - max-height: 100%; - -webkit-box-sizing: border-box; - box-sizing: border-box; - position: relative + vertical-align: middle } -.el-transfer-panel__body { - height: 246px +.el-input__validateIcon { + pointer-events: none } -.el-transfer-panel__body.is-with-footer { - padding-bottom: 40px +.el-input.is-active .el-input__inner { + outline: 0; + border-color: #006aff } -.el-transfer-panel__list { - margin: 0; - padding: 6px 0; - list-style: none; - height: 246px; - overflow: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box +.el-input.is-disabled .el-input__inner { + background-color: #f5f7fa; + border-color: #e4e7ed; + color: #babdc2; + cursor: not-allowed } -.el-transfer-panel__list.is-filterable { - height: 194px; - padding-top: 0 +.el-input.is-disabled .el-input__inner::-webkit-input-placeholder { + color: #babdc2 } -.el-transfer-panel__item { - height: 30px; - line-height: 30px; - padding-left: 15px; - display: block !important +.el-input.is-disabled .el-input__inner::-moz-placeholder { + color: #babdc2 } -.el-transfer-panel__item+.el-transfer-panel__item { - margin-left: 0 +.el-input.is-disabled .el-input__inner::-ms-input-placeholder { + color: #babdc2 } -.el-transfer-panel__item.el-checkbox { - color: #606266 +.el-input.is-disabled .el-input__inner::placeholder { + color: #babdc2 } -.el-transfer-panel__item:hover { - color: #006aff +.el-input.is-disabled .el-input__icon { + cursor: not-allowed } -.el-transfer-panel__item.el-checkbox .el-checkbox__label { - width: 100%; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - display: block; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding-left: 24px; - line-height: 30px +.el-input.is-exceed .el-input__inner { + border-color: #ff4d4f } -.el-transfer-panel__item .el-checkbox__input { - position: absolute; - top: 8px +.el-input.is-exceed .el-input__suffix .el-input__count { + color: #ff4d4f } -.el-transfer-panel__filter { - text-align: center; - margin: 15px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - display: block; - width: auto +.el-input--suffix .el-input__inner { + padding-right: 30px } -.el-transfer-panel__filter .el-input__inner { - height: 32px; - width: 100%; - font-size: 12px; - display: inline-block; - -webkit-box-sizing: border-box; - box-sizing: border-box; - border-radius: 16px; - padding-right: 10px; +.el-input--prefix .el-input__inner { padding-left: 30px } -.el-transfer-panel__filter .el-input__icon { - margin-left: 5px +.el-input--medium { + font-size: 14px } -.el-transfer-panel__filter .el-icon-circle-close { - cursor: pointer +.el-input--medium .el-input__inner { + height: 36px; + line-height: 36px } -.el-transfer-panel .el-transfer-panel__header { - height: 40px; - line-height: 40px; - background: #f5f7fa; - margin: 0; - padding-left: 15px; - border-bottom: 1px solid #ebeef5; - -webkit-box-sizing: border-box; - box-sizing: border-box; - color: #000 +.el-input--medium .el-input__icon { + line-height: 36px } -.el-transfer-panel .el-transfer-panel__header .el-checkbox { - display: block; - line-height: 40px +.el-input--small { + font-size: 13px } -.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label { - font-size: 16px; - color: #1e2226; - font-weight: 400 +.el-input--small .el-input__inner { + height: 32px; + line-height: 32px } -.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span { - position: absolute; - right: 15px; - color: #1e2226; - font-size: 12px; - font-weight: 400 +.el-input--small .el-input__icon { + line-height: 32px } -.el-transfer-panel .el-transfer-panel__footer { - height: 40px; - background: #fff; - margin: 0; - padding: 0; - border-top: 1px solid #ebeef5; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - z-index: 1 +.el-input--mini { + font-size: 12px } -.el-transfer-panel .el-transfer-panel__footer::after { - display: inline-block; - content: ""; - height: 100%; - vertical-align: middle +.el-input--mini .el-input__inner { + height: 28px; + line-height: 28px } -.el-transfer-panel .el-transfer-panel__footer .el-checkbox { - padding-left: 20px; - color: #606266 +.el-input--mini .el-input__icon { + line-height: 28px } -.el-transfer-panel .el-transfer-panel__empty { - margin: 0; - height: 30px; - line-height: 30px; - padding: 6px 15px 0; - color: #1e2226; - text-align: center +.el-input-group { + line-height: normal; + display: inline-table; + width: 100%; + border-collapse: separate; + border-spacing: 0 } -.el-transfer-panel .el-checkbox__label { - padding-left: 8px +.el-input-group>.el-input__inner { + vertical-align: middle; + display: table-cell } -.el-transfer-panel .el-checkbox__inner { - height: 14px; - width: 14px; - border-radius: 3px +.el-input-group__append, +.el-input-group__prepend { + background-color: #f5f7fa; + color: #909399; + vertical-align: middle; + display: table-cell; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 4px; + padding: 0 20px; + width: 1px; + white-space: nowrap +} + +.el-input-group__append:focus, +.el-input-group__prepend:focus { + outline: 0 } -.el-transfer-panel .el-checkbox__inner::after { - height: 6px; - width: 3px; - left: 4px +.el-input-group__append .el-button, +.el-input-group__append .el-select, +.el-input-group__prepend .el-button, +.el-input-group__prepend .el-select { + display: inline-block; + margin: -10px -20px } -.el-container { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - -ms-flex-preferred-size: auto; - flex-basis: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; - min-width: 0 +.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-container.is-vertical { - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column +.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-header { - padding: 0 20px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -ms-flex-negative: 0; - flex-shrink: 0 +.el-input-group__prepend { + border-right: 0; + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-aside { - overflow: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -ms-flex-negative: 0; - flex-shrink: 0 +.el-input-group__append { + border-left: 0; + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-main { - display: block; - -webkit-box-flex: 1; - -ms-flex: 1; - flex: 1; - -ms-flex-preferred-size: auto; - flex-basis: auto; - overflow: auto; - -webkit-box-sizing: border-box; - box-sizing: border-box; - padding: 20px +.el-input-group--prepend .el-input__inner { + border-top-left-radius: 0; + border-bottom-left-radius: 0 } -.el-footer { - padding: 0 20px; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -ms-flex-negative: 0; - flex-shrink: 0 +.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-timeline { - margin: 0; - font-size: 14px; - list-style: none +.el-input-group--append .el-input__inner { + border-top-right-radius: 0; + border-bottom-right-radius: 0 } -.el-timeline .el-timeline-item:last-child .el-timeline-item__tail { - display: none +.el-input-group--append .el-select .el-input.is-focus .el-input__inner { + border-color: transparent } -.el-timeline-item { - position: relative; - padding-bottom: 20px +.el-input__inner::-ms-clear { + display: none; + width: 0; + height: 0 } -.el-timeline-item__wrapper { - position: relative; - padding-left: 28px; - top: -3px -} + -.el-timeline-item__tail { - position: absolute; - left: 4px; - height: 100%; - border-left: 2px solid #e4e7ed +.el-checkbox { + color: #606266; + font-weight: 500; + font-size: 14px; + position: relative; + cursor: pointer; + display: inline-block; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + margin-right: 30px } -.el-timeline-item__icon { - color: #fff; - font-size: 13px +.el-checkbox.is-bordered { + padding: 9px 20px 9px 10px; + border-radius: 4px; + border: 1px solid #dfe2e6; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: normal; + height: 40px } -.el-timeline-item__node { - position: absolute; - background-color: #e4e7ed; - border-radius: 50%; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center +.el-checkbox.is-bordered.is-checked { + border-color: #006aff } -.el-timeline-item__node--normal { - left: -1px; - width: 12px; - height: 12px +.el-checkbox.is-bordered.is-disabled { + border-color: #ebeef5; + cursor: not-allowed } -.el-timeline-item__node--large { - left: -2px; - width: 14px; - height: 14px +.el-checkbox.is-bordered+.el-checkbox.is-bordered { + margin-left: 10px } -.el-timeline-item__node--primary { - background-color: #006aff +.el-checkbox.is-bordered.el-checkbox--medium { + padding: 7px 20px 7px 10px; + border-radius: 4px; + height: 36px } -.el-timeline-item__node--success { - background-color: #0daf49 +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__label { + line-height: 17px; + font-size: 14px } -.el-timeline-item__node--warning { - background-color: #f08614 +.el-checkbox.is-bordered.el-checkbox--medium .el-checkbox__inner { + height: 14px; + width: 14px } -.el-timeline-item__node--danger { - background-color: #ff4d4f +.el-checkbox.is-bordered.el-checkbox--small { + padding: 5px 15px 5px 10px; + border-radius: 3px; + height: 32px } -.el-timeline-item__node--info { - background-color: #909399 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__label { + line-height: 15px; + font-size: 12px } -.el-timeline-item__dot { - position: absolute; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner { + height: 12px; + width: 12px } -.el-timeline-item__content { - color: #1e2226 +.el-checkbox.is-bordered.el-checkbox--small .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-timeline-item__timestamp { - color: #1e2226; - line-height: 1; - font-size: 13px +.el-checkbox.is-bordered.el-checkbox--mini { + padding: 3px 15px 3px 10px; + border-radius: 3px; + height: 28px } -.el-timeline-item__timestamp.is-top { - margin-bottom: 8px; - padding-top: 4px +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__label { + line-height: 12px; + font-size: 12px } -.el-timeline-item__timestamp.is-bottom { - margin-top: 8px +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner { + height: 12px; + width: 12px } -.el-link { - display: -webkit-inline-box; - display: -ms-inline-flexbox; - display: inline-flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - vertical-align: middle; - position: relative; - text-decoration: none; - outline: 0; - cursor: pointer; - padding: 0; - font-size: 14px; - font-weight: 500 +.el-checkbox.is-bordered.el-checkbox--mini .el-checkbox__inner::after { + height: 6px; + width: 2px } -.el-link.is-underline:hover:after { - content: ""; - position: absolute; - left: 0; - right: 0; - height: 0; - bottom: 0; - border-bottom: 1px solid #006aff +.el-checkbox__input { + white-space: nowrap; + cursor: pointer; + outline: 0; + display: inline-block; + line-height: 1; + position: relative; + vertical-align: middle } -.el-link.is-disabled { +.el-checkbox__input.is-disabled .el-checkbox__inner { + background-color: #edf2fc; + border-color: #dfe2e6; cursor: not-allowed } -.el-link [class*=el-icon-]+span { - margin-left: 5px +.el-checkbox__input.is-disabled .el-checkbox__inner::after { + cursor: not-allowed; + border-color: #babdc2 } -.el-link.el-link--default { - color: #606266 +.el-checkbox__input.is-disabled .el-checkbox__inner+.el-checkbox__label { + cursor: not-allowed } -.el-link.el-link--default:hover { - color: #006aff +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-link.el-link--default:after { - border-color: #006aff +.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after { + border-color: #babdc2 } -.el-link.el-link--default.is-disabled { - color: #babdc2 +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner { + background-color: #f2f6fc; + border-color: #dfe2e6 } -.el-link.el-link--primary { - color: #006aff +.el-checkbox__input.is-disabled.is-indeterminate .el-checkbox__inner::before { + background-color: #babdc2; + border-color: #babdc2 } -.el-link.el-link--primary:hover { - color: #38f +.el-checkbox__input.is-disabled+span.el-checkbox__label { + color: #babdc2; + cursor: not-allowed } -.el-link.el-link--primary:after { +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #006aff; border-color: #006aff } -.el-link.el-link--primary.is-disabled { - color: #80b5ff -} - -.el-link.el-link--primary.is-underline:hover:after { - border-color: #006aff +.el-checkbox__input.is-checked .el-checkbox__inner::after { + -webkit-transform: rotate(45deg) scaleY(1); + transform: rotate(45deg) scaleY(1) } -.el-link.el-link--danger { - color: #ff4d4f +.el-checkbox__input.is-checked+.el-checkbox__label { + color: #006aff } -.el-link.el-link--danger:hover { - color: #ff7172 +.el-checkbox__input.is-focus .el-checkbox__inner { + border-color: #006aff } -.el-link.el-link--danger:after { - border-color: #ff4d4f +.el-checkbox__input.is-indeterminate .el-checkbox__inner { + background-color: #006aff; + border-color: #006aff } -.el-link.el-link--danger.is-disabled { - color: #ffa6a7 +.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { + content: ''; + position: absolute; + display: block; + background-color: #fff; + height: 2px; + -webkit-transform: scale(.5); + transform: scale(.5); + left: 0; + right: 0; + top: 5px } -.el-link.el-link--danger.is-underline:hover:after { - border-color: #ff4d4f +.el-checkbox__input.is-indeterminate .el-checkbox__inner::after { + display: none } -.el-link.el-link--success { - color: #0daf49 +.el-checkbox__inner { + display: inline-block; + position: relative; + border: 1px solid #dfe2e6; + border-radius: 2px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 14px; + height: 14px; + background-color: #fff; + z-index: 1; + -webkit-transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46); + transition: border-color .25s cubic-bezier(.71, -.46, .29, 1.46), background-color .25s cubic-bezier(.71, -.46, .29, 1.46) } -.el-link.el-link--success:hover { - color: #3dbf6d +.el-checkbox__inner:hover { + border-color: #006aff } -.el-link.el-link--success:after { - border-color: #0daf49 +.el-checkbox__inner::after { + -webkit-box-sizing: content-box; + box-sizing: content-box; + content: ""; + border: 1px solid #fff; + border-left: 0; + border-top: 0; + height: 7px; + left: 4px; + position: absolute; + top: 1px; + -webkit-transform: rotate(45deg) scaleY(0); + transform: rotate(45deg) scaleY(0); + width: 3px; + -webkit-transition: -webkit-transform .15s ease-in .05s; + transition: -webkit-transform .15s ease-in .05s; + transition: transform .15s ease-in .05s; + transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s; + -webkit-transform-origin: center; + transform-origin: center } -.el-link.el-link--success.is-disabled { - color: #86d7a4 +.el-checkbox__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + width: 0; + height: 0; + z-index: -1 } -.el-link.el-link--success.is-underline:hover:after { - border-color: #0daf49 +.el-checkbox__label { + display: inline-block; + padding-left: 10px; + line-height: 19px; + font-size: 14px } -.el-link.el-link--warning { - color: #f08614 +.el-checkbox:last-of-type { + margin-right: 0 } -.el-link.el-link--warning:hover { - color: #f39e43 +.el-checkbox-button { + position: relative; + display: inline-block } -.el-link.el-link--warning:after { - border-color: #f08614 +.el-checkbox-button__inner { + display: inline-block; + line-height: 1; + font-weight: 500; + white-space: nowrap; + vertical-align: middle; + cursor: pointer; + background: #fff; + border: 1px solid #dfe2e6; + border-left: 0; + color: #606266; + -webkit-appearance: none; + text-align: center; + -webkit-box-sizing: border-box; + box-sizing: border-box; + outline: 0; + margin: 0; + position: relative; + -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); + transition: all .3s cubic-bezier(.645, .045, .355, 1); + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + padding: 12px 20px; + font-size: 14px; + border-radius: 0 } -.el-link.el-link--warning.is-disabled { - color: #f8c38a +.el-checkbox-button__inner.is-round { + padding: 12px 20px } -.el-link.el-link--warning.is-underline:hover:after { - border-color: #f08614 +.el-checkbox-button__inner:hover { + color: #006aff } -.el-link.el-link--info { - color: #909399 +.el-checkbox-button__inner [class*=el-icon-] { + line-height: .9 } -.el-link.el-link--info:hover { - color: #a6a9ad +.el-checkbox-button__inner [class*=el-icon-]+span { + margin-left: 5px } -.el-link.el-link--info:after { - border-color: #909399 +.el-checkbox-button__original { + opacity: 0; + outline: 0; + position: absolute; + margin: 0; + z-index: -1 } -.el-link.el-link--info.is-disabled { - color: #c8c9cc +.el-checkbox-button.is-checked .el-checkbox-button__inner { + color: #fff; + background-color: #006aff; + border-color: #006aff; + -webkit-box-shadow: -1px 0 0 0 #66a6ff; + box-shadow: -1px 0 0 0 #66a6ff } -.el-link.el-link--info.is-underline:hover:after { - border-color: #909399 +.el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { + border-left-color: #006aff } -.el-divider { - background-color: #dfe2e6; - position: relative +.el-checkbox-button.is-disabled .el-checkbox-button__inner { + color: #babdc2; + cursor: not-allowed; + background-image: none; + background-color: #fff; + border-color: #ebeef5; + -webkit-box-shadow: none; + box-shadow: none } -.el-divider--horizontal { - display: block; - height: 1px; - width: 100%; - margin: 24px 0 +.el-checkbox-button.is-disabled:first-child .el-checkbox-button__inner { + border-left-color: #ebeef5 } -.el-divider--vertical { - display: inline-block; - width: 1px; - height: 1em; - margin: 0 8px; - vertical-align: middle; - position: relative +.el-checkbox-button:first-child .el-checkbox-button__inner { + border-left: 1px solid #dfe2e6; + border-radius: 4px 0 0 4px; + -webkit-box-shadow: none !important; + box-shadow: none !important } -.el-divider__text { - position: absolute; - background-color: #fff; - padding: 0 20px; - font-weight: 500; - color: #1e2226; - font-size: 14px +.el-checkbox-button.is-focus .el-checkbox-button__inner { + border-color: #006aff } -.el-divider__text.is-left { - left: 20px; - -webkit-transform: translateY(-50%); - transform: translateY(-50%) +.el-checkbox-button:last-child .el-checkbox-button__inner { + border-radius: 0 4px 4px 0 } -.el-divider__text.is-center { - left: 50%; - -webkit-transform: translateX(-50%) translateY(-50%); - transform: translateX(-50%) translateY(-50%) +.el-checkbox-button--medium .el-checkbox-button__inner { + padding: 10px 20px; + font-size: 14px; + border-radius: 0 } -.el-divider__text.is-right { - right: 20px; - -webkit-transform: translateY(-50%); - transform: translateY(-50%) +.el-checkbox-button--medium .el-checkbox-button__inner.is-round { + padding: 10px 20px } -.el-image__error, -.el-image__inner, -.el-image__placeholder { - width: 100%; - height: 100% +.el-checkbox-button--small .el-checkbox-button__inner { + padding: 9px 15px; + font-size: 12px; + border-radius: 0 } -.el-image { - position: relative; - display: inline-block; - overflow: hidden +.el-checkbox-button--small .el-checkbox-button__inner.is-round { + padding: 9px 15px } -.el-image__inner { - vertical-align: top +.el-checkbox-button--mini .el-checkbox-button__inner { + padding: 7px 15px; + font-size: 12px; + border-radius: 0 } -.el-image__inner--center { - position: relative; - top: 50%; - left: 50%; - -webkit-transform: translate(-50%, -50%); - transform: translate(-50%, -50%); - display: block +.el-checkbox-button--mini .el-checkbox-button__inner.is-round { + padding: 7px 15px } -.el-image__placeholder { - background: #f5f7fa +.el-checkbox-group { + font-size: 0 } -.el-image__error { - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 14px; - background: #f5f7fa; - color: #babdc2; - vertical-align: middle +.el-transfer { + font-size: 14px } -.el-image__preview { - cursor: pointer +.el-transfer__buttons { + display: inline-block; + vertical-align: middle; + padding: 0 30px } -.el-image-viewer__wrapper { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0 +.el-transfer__button { + display: block; + margin: 0 auto; + padding: 10px; + border-radius: 50%; + color: #fff; + background-color: #006aff; + font-size: 0 } -.el-image-viewer__btn { - position: absolute; - z-index: 1; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - border-radius: 50%; - opacity: .8; - cursor: pointer; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none +.el-transfer__button.is-with-texts { + border-radius: 4px } -.el-image-viewer__close { - top: 40px; - right: 40px; - width: 40px; - height: 40px; - font-size: 24px; - color: #fff; - background-color: #606266 +.el-transfer__button.is-disabled { + border: 1px solid #dfe2e6; + background-color: #f5f7fa; + color: #babdc2 } -.el-image-viewer__canvas { - width: 100%; - height: 100%; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center +.el-transfer__button.is-disabled:hover { + border: 1px solid #dfe2e6; + background-color: #f5f7fa; + color: #babdc2 } -.el-image-viewer__actions { - left: 50%; - bottom: 30px; - -webkit-transform: translateX(-50%); - transform: translateX(-50%); - width: 282px; - height: 44px; - padding: 0 23px; - background-color: #606266; - border-color: #fff; - border-radius: 22px +.el-transfer__button:first-child { + margin-bottom: 10px } -.el-image-viewer__actions__inner { - width: 100%; - height: 100%; - text-align: justify; - cursor: default; - font-size: 23px; - color: #fff; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -ms-flex-pack: distribute; - justify-content: space-around +.el-transfer__button:nth-child(2) { + margin: 0 } -.el-image-viewer__prev { - top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - width: 44px; - height: 44px; - font-size: 24px; - color: #fff; - background-color: #606266; - border-color: #fff; - left: 40px +.el-transfer__button i, +.el-transfer__button span { + font-size: 14px } -.el-image-viewer__next { - top: 50%; - -webkit-transform: translateY(-50%); - transform: translateY(-50%); - width: 44px; - height: 44px; - font-size: 24px; - color: #fff; - background-color: #606266; - border-color: #fff; - right: 40px; - text-indent: 2px +.el-transfer__button [class*=el-icon-]+span { + margin-left: 0 } -.el-image-viewer__mask { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - opacity: .5; - background: #000 +.el-transfer-panel { + border: 1px solid #ebeef5; + border-radius: 4px; + overflow: hidden; + background: #fff; + display: inline-block; + vertical-align: middle; + width: 200px; + max-height: 100%; + -webkit-box-sizing: border-box; + box-sizing: border-box; + position: relative } -.viewer-fade-enter-active { - -webkit-animation: viewer-fade-in .3s; - animation: viewer-fade-in .3s +.el-transfer-panel__body { + height: 246px } -.viewer-fade-leave-active { - -webkit-animation: viewer-fade-out .3s; - animation: viewer-fade-out .3s +.el-transfer-panel__body.is-with-footer { + padding-bottom: 40px } -@-webkit-keyframes viewer-fade-in { - 0% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-transfer-panel__list { + margin: 0; + padding: 6px 0; + list-style: none; + height: 246px; + overflow: auto; + -webkit-box-sizing: border-box; + box-sizing: border-box +} - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-transfer-panel__list.is-filterable { + height: 194px; + padding-top: 0 } -@keyframes viewer-fade-in { - 0% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-transfer-panel__item { + height: 30px; + line-height: 30px; + padding-left: 15px; + display: block !important +} - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-transfer-panel__item+.el-transfer-panel__item { + margin-left: 0 } -@-webkit-keyframes viewer-fade-out { - 0% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-transfer-panel__item.el-checkbox { + color: #606266 +} - 100% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-transfer-panel__item:hover { + color: #006aff } -@keyframes viewer-fade-out { - 0% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - opacity: 1 - } +.el-transfer-panel__item.el-checkbox .el-checkbox__label { + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: block; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding-left: 24px; + line-height: 30px +} - 100% { - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - opacity: 0 - } +.el-transfer-panel__item .el-checkbox__input { + position: absolute; + top: 8px } -.el-button { - display: inline-block; - line-height: 1; - white-space: nowrap; - cursor: pointer; - background: #fff; - border: 1px solid #dfe2e6; - border-color: #dfe2e6; - color: #606266; - -webkit-appearance: none; +.el-transfer-panel__filter { text-align: center; + margin: 15px; -webkit-box-sizing: border-box; box-sizing: border-box; - outline: 0; - margin: 0; - -webkit-transition: .1s; - transition: .1s; - font-weight: 500; - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; - padding: 12px 20px; - font-size: 14px; - border-radius: 4px + display: block; + width: auto } -.el-button+.el-button { - margin-left: 10px +.el-transfer-panel__filter .el-input__inner { + height: 32px; + width: 100%; + font-size: 12px; + display: inline-block; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-radius: 16px; + padding-right: 10px; + padding-left: 30px } -.el-button.is-round { - padding: 12px 20px +.el-transfer-panel__filter .el-input__icon { + margin-left: 5px } -.el-button:focus, -.el-button:hover { - color: #006aff; - border-color: #b3d2ff; - background-color: #e6f0ff +.el-transfer-panel__filter .el-icon-circle-close { + cursor: pointer } -.el-button:active { - color: #005fe6; - border-color: #005fe6; - outline: 0 +.el-transfer-panel .el-transfer-panel__header { + height: 40px; + line-height: 40px; + background: #f5f7fa; + margin: 0; + padding-left: 15px; + border-bottom: 1px solid #ebeef5; + -webkit-box-sizing: border-box; + box-sizing: border-box; + color: #000 } -.el-button::-moz-focus-inner { - border: 0 +.el-transfer-panel .el-transfer-panel__header .el-checkbox { + display: block; + line-height: 40px } -.el-button [class*=el-icon-]+span { - margin-left: 5px +.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label { + font-size: 16px; + color: #1e2226; + font-weight: 400 } -.el-button.is-plain:focus, -.el-button.is-plain:hover { - background: #fff; - border-color: #006aff; - color: #006aff +.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span { + position: absolute; + right: 15px; + color: #1e2226; + font-size: 12px; + font-weight: 400 } -.el-button.is-plain:active { +.el-transfer-panel .el-transfer-panel__footer { + height: 40px; background: #fff; - border-color: #005fe6; - color: #005fe6; - outline: 0 + margin: 0; + padding: 0; + border-top: 1px solid #ebeef5; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + z-index: 1 } -.el-button.is-active { - color: #005fe6; - border-color: #005fe6 +.el-transfer-panel .el-transfer-panel__footer::after { + display: inline-block; + content: ""; + height: 100%; + vertical-align: middle } -.el-button.is-disabled, -.el-button.is-disabled:focus, -.el-button.is-disabled:hover { - color: #babdc2; - cursor: not-allowed; - background-image: none; - background-color: #fff; - border-color: #ebeef5 +.el-transfer-panel .el-transfer-panel__footer .el-checkbox { + padding-left: 20px; + color: #606266 } -.el-button.is-disabled.el-button--text { - background-color: transparent +.el-transfer-panel .el-transfer-panel__empty { + margin: 0; + height: 30px; + line-height: 30px; + padding: 6px 15px 0; + color: #1e2226; + text-align: center } -.el-button.is-disabled.is-plain, -.el-button.is-disabled.is-plain:focus, -.el-button.is-disabled.is-plain:hover { - background-color: #fff; - border-color: #ebeef5; - color: #babdc2 +.el-transfer-panel .el-checkbox__label { + padding-left: 8px } -.el-button.is-loading { - position: relative; - pointer-events: none +.el-transfer-panel .el-checkbox__inner { + height: 14px; + width: 14px; + border-radius: 3px } -.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-transfer-panel .el-checkbox__inner::after { + height: 6px; + width: 3px; + left: 4px } -.el-button.is-round { - border-radius: 20px; - padding: 12px 23px +.el-container { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + -ms-flex-preferred-size: auto; + flex-basis: auto; + -webkit-box-sizing: border-box; + box-sizing: border-box; + min-width: 0 } -.el-button.is-circle { - border-radius: 50%; - padding: 12px +.el-container.is-vertical { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column } -.el-button--primary { - color: #fff; - background-color: #006aff; - border-color: #006aff +.el-header { + padding: 0 20px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -ms-flex-negative: 0; + flex-shrink: 0 } -.el-button--primary:focus, -.el-button--primary:hover { - background: #38f; - border-color: #38f; - color: #fff +.el-aside { + overflow: auto; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -ms-flex-negative: 0; + flex-shrink: 0 } -.el-button--primary:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-main { + display: block; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; + -ms-flex-preferred-size: auto; + flex-basis: auto; + overflow: auto; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding: 20px } -.el-button--primary.is-active { - background: #005fe6; - border-color: #005fe6; - color: #fff +.el-footer { + padding: 0 20px; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -ms-flex-negative: 0; + flex-shrink: 0 } -.el-button--primary.is-disabled, -.el-button--primary.is-disabled:active, -.el-button--primary.is-disabled:focus, -.el-button--primary.is-disabled:hover { - color: #fff; - background-color: #80b5ff; - border-color: #80b5ff +.el-timeline { + margin: 0; + font-size: 14px; + list-style: none } -.el-button--primary.is-plain { - color: #006aff; - background: #e6f0ff; - border-color: #99c3ff +.el-timeline .el-timeline-item:last-child .el-timeline-item__tail { + display: none } -.el-button--primary.is-plain:focus, -.el-button--primary.is-plain:hover { - background: #006aff; - border-color: #006aff; - color: #fff +.el-timeline-item { + position: relative; + padding-bottom: 20px } -.el-button--primary.is-plain:active { - background: #005fe6; - border-color: #005fe6; - color: #fff; - outline: 0 +.el-timeline-item__wrapper { + position: relative; + padding-left: 28px; + top: -3px } -.el-button--primary.is-plain.is-disabled, -.el-button--primary.is-plain.is-disabled:active, -.el-button--primary.is-plain.is-disabled:focus, -.el-button--primary.is-plain.is-disabled:hover { - color: #66a6ff; - background-color: #e6f0ff; - border-color: #cce1ff +.el-timeline-item__tail { + position: absolute; + left: 4px; + height: 100%; + border-left: 2px solid #e4e7ed } -.el-button--success { +.el-timeline-item__icon { color: #fff; - background-color: #0daf49; - border-color: #0daf49 + font-size: 13px } -.el-button--success:focus, -.el-button--success:hover { - background: #3dbf6d; - border-color: #3dbf6d; - color: #fff +.el-timeline-item__node { + position: absolute; + background-color: #e4e7ed; + border-radius: 50%; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-button--success:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-timeline-item__node--normal { + left: -1px; + width: 12px; + height: 12px } -.el-button--success.is-active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff +.el-timeline-item__node--large { + left: -2px; + width: 14px; + height: 14px } -.el-button--success.is-disabled, -.el-button--success.is-disabled:active, -.el-button--success.is-disabled:focus, -.el-button--success.is-disabled:hover { - color: #fff; - background-color: #86d7a4; - border-color: #86d7a4 +.el-timeline-item__node--primary { + background-color: #006aff } -.el-button--success.is-plain { - color: #0daf49; - background: #e7f7ed; - border-color: #9edfb6 +.el-timeline-item__node--success { + background-color: #0daf49 } -.el-button--success.is-plain:focus, -.el-button--success.is-plain:hover { - background: #0daf49; - border-color: #0daf49; - color: #fff +.el-timeline-item__node--warning { + background-color: #f08614 } -.el-button--success.is-plain:active { - background: #0c9e42; - border-color: #0c9e42; - color: #fff; - outline: 0 +.el-timeline-item__node--danger { + background-color: #ff4d4f } -.el-button--success.is-plain.is-disabled, -.el-button--success.is-plain.is-disabled:active, -.el-button--success.is-plain.is-disabled:focus, -.el-button--success.is-plain.is-disabled:hover { - color: #6ecf92; - background-color: #e7f7ed; - border-color: #cfefdb +.el-timeline-item__node--info { + background-color: #909399 } -.el-button--warning { - color: #fff; - background-color: #f08614; - border-color: #f08614 +.el-timeline-item__dot { + position: absolute; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-button--warning:focus, -.el-button--warning:hover { - background: #f39e43; - border-color: #f39e43; - color: #fff +.el-timeline-item__content { + color: #1e2226 } -.el-button--warning:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-timeline-item__timestamp { + color: #1e2226; + line-height: 1; + font-size: 13px } -.el-button--warning.is-active { - background: #d87912; - border-color: #d87912; - color: #fff +.el-timeline-item__timestamp.is-top { + margin-bottom: 8px; + padding-top: 4px } -.el-button--warning.is-disabled, -.el-button--warning.is-disabled:active, -.el-button--warning.is-disabled:focus, -.el-button--warning.is-disabled:hover { - color: #fff; - background-color: #f8c38a; - border-color: #f8c38a +.el-timeline-item__timestamp.is-bottom { + margin-top: 8px } -.el-button--warning.is-plain { - color: #f08614; - background: #fef3e8; - border-color: #f9cfa1 +.el-link { + display: -webkit-inline-box; + display: -ms-inline-flexbox; + display: inline-flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + vertical-align: middle; + position: relative; + text-decoration: none; + outline: 0; + cursor: pointer; + padding: 0; + font-size: 14px; + font-weight: 500 } -.el-button--warning.is-plain:focus, -.el-button--warning.is-plain:hover { - background: #f08614; - border-color: #f08614; - color: #fff +.el-link.is-underline:hover:after { + content: ""; + position: absolute; + left: 0; + right: 0; + height: 0; + bottom: 0; + border-bottom: 1px solid #006aff } -.el-button--warning.is-plain:active { - background: #d87912; - border-color: #d87912; - color: #fff; - outline: 0 +.el-link.is-disabled { + cursor: not-allowed } -.el-button--warning.is-plain.is-disabled, -.el-button--warning.is-plain.is-disabled:active, -.el-button--warning.is-plain.is-disabled:focus, -.el-button--warning.is-plain.is-disabled:hover { - color: #f6b672; - background-color: #fef3e8; - border-color: #fce7d0 +.el-link [class*=el-icon-]+span { + margin-left: 5px } -.el-button--danger { - color: #fff; - background-color: #ff4d4f; - border-color: #ff4d4f +.el-link.el-link--default { + color: #606266 } -.el-button--danger:focus, -.el-button--danger:hover { - background: #ff7172; - border-color: #ff7172; - color: #fff +.el-link.el-link--default:hover { + color: #006aff } -.el-button--danger:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-link.el-link--default:after { + border-color: #006aff } -.el-button--danger.is-active { - background: #e64547; - border-color: #e64547; - color: #fff +.el-link.el-link--default.is-disabled { + color: #babdc2 } -.el-button--danger.is-disabled, -.el-button--danger.is-disabled:active, -.el-button--danger.is-disabled:focus, -.el-button--danger.is-disabled:hover { - color: #fff; - background-color: #ffa6a7; - border-color: #ffa6a7 +.el-link.el-link--primary { + color: #006aff } -.el-button--danger.is-plain { - color: #ff4d4f; - background: #ffeded; - border-color: #ffb8b9 +.el-link.el-link--primary:hover { + color: #38f } -.el-button--danger.is-plain:focus, -.el-button--danger.is-plain:hover { - background: #ff4d4f; - border-color: #ff4d4f; - color: #fff +.el-link.el-link--primary:after { + border-color: #006aff } -.el-button--danger.is-plain:active { - background: #e64547; - border-color: #e64547; - color: #fff; - outline: 0 +.el-link.el-link--primary.is-disabled { + color: #80b5ff } -.el-button--danger.is-plain.is-disabled, -.el-button--danger.is-plain.is-disabled:active, -.el-button--danger.is-plain.is-disabled:focus, -.el-button--danger.is-plain.is-disabled:hover { - color: #ff9495; - background-color: #ffeded; - border-color: #ffdbdc +.el-link.el-link--primary.is-underline:hover:after { + border-color: #006aff } -.el-button--info { - color: #fff; - background-color: #909399; - border-color: #909399 +.el-link.el-link--danger { + color: #ff4d4f } -.el-button--info:focus, -.el-button--info:hover { - background: #a6a9ad; - border-color: #a6a9ad; - color: #fff +.el-link.el-link--danger:hover { + color: #ff7172 } -.el-button--info:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-link.el-link--danger:after { + border-color: #ff4d4f } -.el-button--info.is-active { - background: #82848a; - border-color: #82848a; - color: #fff +.el-link.el-link--danger.is-disabled { + color: #ffa6a7 } -.el-button--info.is-disabled, -.el-button--info.is-disabled:active, -.el-button--info.is-disabled:focus, -.el-button--info.is-disabled:hover { - color: #fff; - background-color: #c8c9cc; - border-color: #c8c9cc +.el-link.el-link--danger.is-underline:hover:after { + border-color: #ff4d4f } -.el-button--info.is-plain { - color: #909399; - background: #f4f4f5; - border-color: #d3d4d6 +.el-link.el-link--success { + color: #0daf49 } -.el-button--info.is-plain:focus, -.el-button--info.is-plain:hover { - background: #909399; - border-color: #909399; - color: #fff +.el-link.el-link--success:hover { + color: #3dbf6d } -.el-button--info.is-plain:active { - background: #82848a; - border-color: #82848a; - color: #fff; - outline: 0 +.el-link.el-link--success:after { + border-color: #0daf49 } -.el-button--info.is-plain.is-disabled, -.el-button--info.is-plain.is-disabled:active, -.el-button--info.is-plain.is-disabled:focus, -.el-button--info.is-plain.is-disabled:hover { - color: #bcbec2; - background-color: #f4f4f5; - border-color: #e9e9eb +.el-link.el-link--success.is-disabled { + color: #86d7a4 } -.el-button--medium { - padding: 10px 20px; - font-size: 14px; - border-radius: 4px +.el-link.el-link--success.is-underline:hover:after { + border-color: #0daf49 } -.el-button--medium.is-round { - padding: 10px 20px +.el-link.el-link--warning { + color: #f08614 } -.el-button--medium.is-circle { - padding: 10px +.el-link.el-link--warning:hover { + color: #f39e43 } -.el-button--small { - padding: 9px 15px; - font-size: 12px; - border-radius: 3px +.el-link.el-link--warning:after { + border-color: #f08614 } -.el-button--small.is-round { - padding: 9px 15px +.el-link.el-link--warning.is-disabled { + color: #f8c38a } -.el-button--small.is-circle { - padding: 9px +.el-link.el-link--warning.is-underline:hover:after { + border-color: #f08614 } -.el-button--mini { - padding: 7px 15px; - font-size: 12px; - border-radius: 3px +.el-link.el-link--info { + color: #909399 } -.el-button--mini.is-round { - padding: 7px 15px +.el-link.el-link--info:hover { + color: #a6a9ad } -.el-button--mini.is-circle { - padding: 7px +.el-link.el-link--info:after { + border-color: #909399 } -.el-button--text { - border-color: transparent; - color: #006aff; - background: 0 0; - padding-left: 0; - padding-right: 0 +.el-link.el-link--info.is-disabled { + color: #c8c9cc } -.el-button--text:focus, -.el-button--text:hover { - color: #38f; - border-color: transparent; - background-color: transparent +.el-link.el-link--info.is-underline:hover:after { + border-color: #909399 } -.el-button--text:active { - color: #005fe6; - border-color: transparent; - background-color: transparent +.el-divider { + background-color: #dfe2e6; + position: relative } -.el-button--text.is-disabled, -.el-button--text.is-disabled:focus, -.el-button--text.is-disabled:hover { - border-color: transparent +.el-divider--horizontal { + display: block; + height: 1px; + width: 100%; + margin: 24px 0 } -.el-button-group { +.el-divider--vertical { display: inline-block; - vertical-align: middle + width: 1px; + height: 1em; + margin: 0 8px; + vertical-align: middle; + position: relative } -.el-button-group::after, -.el-button-group::before { - display: table; - content: "" +.el-divider__text { + position: absolute; + background-color: #fff; + padding: 0 20px; + font-weight: 500; + color: #1e2226; + font-size: 14px } -.el-button-group::after { - clear: both +.el-divider__text.is-left { + left: 20px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%) } -.el-button-group>.el-button { - float: left; - position: relative +.el-divider__text.is-center { + left: 50%; + -webkit-transform: translateX(-50%) translateY(-50%); + transform: translateX(-50%) translateY(-50%) } -.el-button-group>.el-button+.el-button { - margin-left: 0 +.el-divider__text.is-right { + right: 20px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%) +} + +.el-image__error, +.el-image__inner, +.el-image__placeholder { + width: 100%; + height: 100% } -.el-button-group>.el-button.is-disabled { - z-index: 1 +.el-image { + position: relative; + display: inline-block; + overflow: hidden } -.el-button-group>.el-button:first-child { - border-top-right-radius: 0; - border-bottom-right-radius: 0 +.el-image__inner { + vertical-align: top } -.el-button-group>.el-button:last-child { - border-top-left-radius: 0; - border-bottom-left-radius: 0 +.el-image__inner--center { + position: relative; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + display: block } -.el-button-group>.el-button:first-child:last-child { - border-top-right-radius: 4px; - border-bottom-right-radius: 4px; - border-top-left-radius: 4px; - border-bottom-left-radius: 4px +.el-image__placeholder { + background: #f5f7fa } -.el-button-group>.el-button:first-child:last-child.is-round { - border-radius: 20px +.el-image__error { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + font-size: 14px; + background: #f5f7fa; + color: #babdc2; + vertical-align: middle } -.el-button-group>.el-button:first-child:last-child.is-circle { - border-radius: 50% +.el-image__preview { + cursor: pointer } -.el-button-group>.el-button:not(:first-child):not(:last-child) { - border-radius: 0 +.el-image-viewer__wrapper { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0 } -.el-button-group>.el-button:not(:last-child) { - margin-right: -1px +.el-image-viewer__btn { + position: absolute; + z-index: 1; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + border-radius: 50%; + opacity: .8; + cursor: pointer; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none } -.el-button-group>.el-button:not(.is-disabled):active, -.el-button-group>.el-button:not(.is-disabled):focus, -.el-button-group>.el-button:not(.is-disabled):hover { - z-index: 1 +.el-image-viewer__close { + top: 40px; + right: 40px; + width: 40px; + height: 40px; + font-size: 24px; + color: #fff; + background-color: #606266 } -.el-button-group>.el-button.is-active { - z-index: 1 +.el-image-viewer__canvas { + width: 100%; + height: 100%; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center } -.el-button-group>.el-dropdown>.el-button { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-left-color: rgba(255, 255, 255, .5) +.el-image-viewer__actions { + left: 50%; + bottom: 30px; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + width: 282px; + height: 44px; + padding: 0 23px; + background-color: #606266; + border-color: #fff; + border-radius: 22px } -.el-button-group .el-button--primary:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-image-viewer__actions__inner { + width: 100%; + height: 100%; + text-align: justify; + cursor: default; + font-size: 23px; + color: #fff; + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: distribute; + justify-content: space-around } -.el-button-group .el-button--primary:last-child { - border-left-color: rgba(255, 255, 255, .5) +.el-image-viewer__prev { + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + width: 44px; + height: 44px; + font-size: 24px; + color: #fff; + background-color: #606266; + border-color: #fff; + left: 40px } -.el-button-group .el-button--primary:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.el-image-viewer__next { + top: 50%; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + width: 44px; + height: 44px; + font-size: 24px; + color: #fff; + background-color: #606266; + border-color: #fff; + right: 40px; + text-indent: 2px } -.el-button-group .el-button--success:first-child { - border-right-color: rgba(255, 255, 255, .5) +.el-image-viewer__mask { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + opacity: .5; + background: #000 } -.el-button-group .el-button--success:last-child { - border-left-color: rgba(255, 255, 255, .5) +.viewer-fade-enter-active { + -webkit-animation: viewer-fade-in .3s; + animation: viewer-fade-in .3s } -.el-button-group .el-button--success:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) +.viewer-fade-leave-active { + -webkit-animation: viewer-fade-out .3s; + animation: viewer-fade-out .3s } -.el-button-group .el-button--warning:first-child { - border-right-color: rgba(255, 255, 255, .5) -} +@-webkit-keyframes viewer-fade-in { + 0% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } -.el-button-group .el-button--warning:last-child { - border-left-color: rgba(255, 255, 255, .5) + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } } -.el-button-group .el-button--warning:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) -} +@keyframes viewer-fade-in { + 0% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } -.el-button-group .el-button--danger:first-child { - border-right-color: rgba(255, 255, 255, .5) + 100% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } } -.el-button-group .el-button--danger:last-child { - border-left-color: rgba(255, 255, 255, .5) -} +@-webkit-keyframes viewer-fade-out { + 0% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } -.el-button-group .el-button--danger:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) + 100% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } } -.el-button-group .el-button--info:first-child { - border-right-color: rgba(255, 255, 255, .5) -} +@keyframes viewer-fade-out { + 0% { + -webkit-transform: translate3d(0, 0, 0); + transform: translate3d(0, 0, 0); + opacity: 1 + } -.el-button-group .el-button--info:last-child { - border-left-color: rgba(255, 255, 255, .5) + 100% { + -webkit-transform: translate3d(0, -20px, 0); + transform: translate3d(0, -20px, 0); + opacity: 0 + } } -.el-button-group .el-button--info:not(:first-child):not(:last-child) { - border-left-color: rgba(255, 255, 255, .5); - border-right-color: rgba(255, 255, 255, .5) -} .el-calendar { background-color: #fff diff --git a/src/views/elementGroups.vue b/src/views/elementGroups.vue index 864f62a..74f0d1a 100644 --- a/src/views/elementGroups.vue +++ b/src/views/elementGroups.vue @@ -271,6 +271,13 @@ 宽高自定义 +
+ + 成功提示 + 失败提示 + 警告提示 +
+

表单左右布局(直接使用封装好的input)

@@ -617,6 +624,30 @@ export default { }, methods: { + openMessage(type){ + console.log(type); + // 单独指定方法调用 + switch(type){ + case 'success': + this.$Message.success('成功,文案自定义') + break; + case 'error': + this.$Message.error('失败,文案自定义') + break; + case 'info': + this.$Message.info('提示,文案自定义') + break; + } + // 自定义选项 + // this.$Message({ + // type: 'success', + // title: '成功标题', + // message: '这是一条成功的提示消息', + // duration: 5000, + // showClose: true, + // center: true + // }) + }, showTooltip() { this.$refs.tooltip.show() },