element-ui/packages/theme-default/lib/date-picker.css

A Component Library for Vue.js.

@charset "UTF-8";.el-month-table,.el-year-table{margin:-1px;font-size:12px}.el-date-table{font-size:12px;min-width:224px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.el-date-table td{width:32px;height:32px;box-sizing:border-box;text-align:center;cursor:pointer}.el-month-table td .cell,.el-year-table td .cell{width:48px;height:32px;display:block;line-height:32px}.el-date-table td.next-month,.el-date-table td.prev-month{color:#ddd}.el-date-table td.today{color:#20a0ff}.el-date-table td.available:hover{background-color:#e5e9f2}.el-date-table td.in-range{background-color:#D3ECFF}.el-date-table td.in-range:hover{background-color:#AFDCFF}.el-date-table td.current,.el-date-table td.end-date,.el-date-table td.start-date{background-color:#20a0ff!important;color:#fff}.el-date-table td.disabled{background-color:#f4f4f4;opacity:1;cursor:not-allowed;color:#ccc}.fade-in-enter,.fade-in-leave-active,.fade-in-linear-enter,.fade-in-linear-leave,.fade-in-linear-leave-active{opacity:0}.el-date-table td.week{font-size:80%;color:#8492a6}.el-date-table th{padding:5px;color:#8492a6;font-weight:400}.el-date-table.is-week-mode .el-date-table__row:hover{background-color:#e5e9f2}.el-date-table.is-week-mode .el-date-table__row.current{background-color:#D3ECFF}.el-month-table{border-collapse:collapse}.el-month-table td{text-align:center;padding:20px 3px;cursor:pointer}.el-month-table td .cell{color:#475669}.el-month-table td .cell:hover{background-color:#e5e9f2}.el-month-table td.disabled .cell{background-color:#f4f4f4;cursor:not-allowed;color:#ccc}.el-month-table td.current .cell{background-color:#20a0ff!important;color:#fff}.el-year-table .el-icon{color:#99a9bf}.el-year-table td{text-align:center;padding:20px 3px;cursor:pointer}.el-year-table td .cell{color:#475669}.el-year-table td .cell:hover{background-color:#e5e9f2}.el-year-table td.disabled .cell{background-color:#f4f4f4;cursor:not-allowed;color:#ccc}.el-year-table td.current .cell{background-color:#20a0ff!important;color:#fff}.el-time-spinner__wrapper{height:190px;overflow:hidden;-webkit-box-flex:1;-ms-flex:1;flex:1;vertical-align:top;position:relative;-ms-overflow-style:none}.el-time-spinner__wrapper:hover{overflow-y:auto}.el-time-spinner__list{padding:0;margin:0;list-style:none;text-align:center}.el-time-spinner__list::after,.el-time-spinner__list::before{content:'';display:block;width:100%;height:80px}.el-time-spinner__item{height:32px;line-height:32px;font-size:12px}.el-time-spinner__item:hover:not(.disabled):not(.active){background:#E5E9F2;cursor:pointer}.el-time-spinner__item.active:not(.disabled){color:#fff}.el-time-spinner__item.disabled{color:#d3dce6;cursor:not-allowed}.fade-in-linear-enter-active,.fade-in-linear-leave-active{-webkit-transition:opacity .2s linear;transition:opacity .2s linear}.fade-in-enter-active,.fade-in-leave-active{-webkit-transition:all .3s cubic-bezier(.55,0,.1,1);transition:all .3s cubic-bezier(.55,0,.1,1)}.md-fade-center-enter-active,.md-fade-center-leave-active{-webkit-transition:all .3s cubic-bezier(.55,0,.1,1);transition:all .3s cubic-bezier(.55,0,.1,1)}.md-fade-center-enter,.md-fade-center-leave,.md-fade-center-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.md-fade-bottom-enter-active,.md-fade-bottom-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;-webkit-transform-origin:center top;transform-origin:center top}.md-fade-left-enter-active,.md-fade-left-leave-active,.md-fade-top-enter-active,.md-fade-top-leave-active{-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s}.md-fade-bottom-enter,.md-fade-bottom-leave,.md-fade-bottom-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.md-fade-top-enter-active,.md-fade-top-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;-webkit-transform-origin:center bottom;transform-origin:center bottom}.md-fade-top-enter,.md-fade-top-leave,.md-fade-top-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.md-fade-left-enter-active,.md-fade-left-leave-active{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1);transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;-webkit-transform-origin:right center;transform-origin:right center}.md-fade-left-enter,.md-fade-left-leave,.md-fade-left-leave-active{opacity:0;-webkit-transform:scaleX(0);transform:scaleX(0)}.md-fade-right-enter-active,.md-fade-right-leave-active{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s;transition:transform .3s cubic-bezier(.23,1,.32,1) .1s,opacity .3s cubic-bezier(.23,1,.32,1) .1s,-webkit-transform .3s cubic-bezier(.23,1,.32,1) .1s;-webkit-transform-origin:left center;transform-origin:left center}.md-fade-right-enter,.md-fade-right-leave,.md-fade-right-leave-active{opacity:0;-webkit-transform:scaleX(0);transform:scaleX(0)}.fade-enter-active,.fade-leave-active{-webkit-transition:opacity .3s cubic-bezier(.645,.045,.355,1);transition:opacity .3s cubic-bezier(.645,.045,.355,1)}.fade-enter,.fade-leave-active{opacity:0}.list-enter-active,.list-leave-active,.list-move{-webkit-transition:all .5s cubic-bezier(.55,0,.1,1);transition:all .5s cubic-bezier(.55,0,.1,1)}.el-date-editor__editor,.el-date-picker__editor{-webkit-transition:border .3s;box-sizing:border-box}.list-enter,.list-leave-active{opacity:0;-webkit-transform:translate(0,-30px);transform:translate(0,-30px)}.el-date-editor{position:relative;display:inline-block;box-sizing:border-box;height:36px;width:182px}.el-date-editor .el-picker-panel{position:absolute;min-width:180px;box-sizing:border-box;box-shadow:0 2px 6px #ccc;background:#fff;z-index:10;top:41px}.el-date-editor.lg .el-date-editor__editor{padding:6px 4px}.el-date-editor.sm .el-date-editor__editor{padding:1px}.el-date-editor.is-have-trigger .el-date-editor__editor{padding-right:20px}.el-date-editor.is-have-trigger .el-date-editor__clear{right:22px}.el-date-editor__editor{border:1px solid #c0ccda;border-radius:4px;line-height:18px;height:36px;padding:3px 10px;width:100%;transition:border .3s;color:#666;font-size:14px}.el-date-editor__editor::-webkit-input-placeholder{color:#99a9bf;font-size:14px}.el-date-editor__editor::-moz-placeholder{color:#bbb;font-size:14px}.el-date-editor__editor:-ms-input-placeholder{color:#bbb;font-size:14px}.el-date-editor__editor::placeholder{color:#bbb;font-size:14px}.el-date-editor__trigger.el-icon{cursor:pointer;position:absolute;display:inline-block;width:16px;right:10px;top:0;bottom:0;color:#c0ccda;font-size:16px;line-height:38px}.el-date-editor__clear{cursor:pointer;position:absolute;width:20px;right:0;top:0;bottom:0;line-height:36px;color:#99a9bf}.el-date-editor__clear:hover{color:#20a0ff}.el-date-editor.is-active>.el-date-editor__editor,.el-date-editor:hover>.el-date-editor__editor,.el-date-editor__editor:focus{outline:0;border-color:#20a0ff}.el-date-editor .el-date-editor__clear{display:none}.el-date-editor.is-filled.is-active>.el-date-editor__clear,.el-date-editor.is-filled:hover .el-date-editor__clear{display:inline-block}.el-picker-panel{color:#475669;border:1px solid #d3dce6;box-shadow:0 2px 6px #ccc;background:#fff;border-radius:2px;line-height:20px;margin:5px 0}.el-picker-panel__body-wrapper::after,.el-picker-panel__body::after{content:"";display:table;clear:both}.el-picker-panel__content{position:relative;margin:15px}.el-picker-panel__footer{border-top:1px solid #e4e4e4;padding:4px;text-align:right;background-color:#fff;position:relative}.el-picker-panel__shortcut{display:block;width:100%;border:0;background-color:transparent;line-height:28px;font-size:14px;color:#475669;padding-left:12px;text-align:left;outline:0;cursor:pointer}.el-picker-panel__shortcut:hover{background-color:#e5e9f2}.el-picker-panel__shortcut.active{background-color:#e6f1fe;color:#20a0ff}.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-picker-panel__btn[disabled]{color:#ccc;cursor:not-allowed}.el-picker-panel__icon-btn{font-size:12px;color:#99a9bf;border:0;background:0 0;cursor:pointer;outline:0;margin-top:3px}.el-picker-panel__icon-btn:hover{color:#20a0ff}.el-picker-panel__link-btn{cursor:pointer;color:#55a4ff;text-decoration:none;padding:15px;font-size:12px}.el-picker-panel [slot=sidebar],.el-picker-panel__sidebar{position:absolute;top:0;bottom:0;width:110px;border-right:1px solid #e4e4e4;box-sizing:border-box;padding-top:6px;background-color:#f9fafc}.el-picker-panel [slot=sidebar]+.el-picker-panel__body,.el-picker-panel__sidebar+.el-picker-panel__body{margin-left:110px}.el-date-picker{min-width:254px}.el-date-picker .el-picker-panel__content{min-width:224px}.el-date-picker table{table-layout:fixed;width:100%}.el-date-picker.has-sidebar.has-time{min-width:434px}.el-date-picker.has-sidebar{min-width:370px}.el-date-picker.has-time{min-width:324px}.el-date-picker__editor-wrap{position:relative;display:table-cell;padding:0 5px}.el-date-picker__editor{position:relative;border:1px solid #c0ccda;border-radius:4px;padding:5px 10px;height:28px;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:border .3s;width:100%}.el-date-picker__editor:hover{border-color:#20a0ff}.el-date-picker__time-header{position:relative;border-bottom:1px solid #e4e4e4;font-size:12px;padding:8px 5px 5px;display:table;width:100%;box-sizing:border-box}.el-date-picker__header{margin:12px;text-align:center}.el-date-picker__header-label{font-size:14px;padding:0 5px;line-height:22px;text-align:center;cursor:pointer}.el-date-picker__header-label.active,.el-date-picker__header-label:hover{color:#20a0ff}.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-date-range-picker{min-width:520px}.el-date-range-picker table{table-layout:fixed;width:100%}.el-date-range-picker .el-picker-panel__body{min-width:513px}.el-date-range-picker .el-picker-panel__content{margin:0}.el-date-range-picker.has-sidebar.has-time{min-width:766px}.el-date-range-picker.has-sidebar{min-width:620px}.el-date-range-picker.has-time{min-width:660px}.el-date-range-picker__editor{position:relative;border:1px solid #c0ccda;border-radius:4px;padding:5px 10px;box-sizing:border-box;height:28px;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-transition:border .3s;transition:border .3s;width:100%}.el-date-range-picker__editor:hover{border-color:#20a0ff}.el-date-range-picker__header{position:relative;text-align:center;height:28px}.el-date-range-picker__header button{float:left}.el-date-range-picker__header div{font-size:14px;margin-right:50px}.el-date-range-picker__content{float:left;width:50%;box-sizing:border-box;margin:0;padding:16px}.el-date-range-picker__content.is-right .el-date-range-picker__header button{float:right}.el-date-range-picker__content.is-right .el-date-range-picker__header div{margin-left:50px;margin-right:50px}.el-date-range-picker__content.is-left{border-right:1px solid #e4e4e4}.el-date-range-picker__editors-wrap{box-sizing:border-box;display:table-cell}.el-date-range-picker__editors-wrap.is-right{text-align:right}.el-date-range-picker__time-header{position:relative;border-bottom:1px solid #e4e4e4;font-size:12px;padding:8px 5px 5px;display:table;width:100%;box-sizing:border-box}.el-date-range-picker__time-header>.el-icon-arrow-right{font-size:20px;vertical-align:middle;display:table-cell;color:#99a9bf}.el-date-range-picker__time-picker-wrap{position:relative;display:table-cell;padding:0 5px}.el-date-range-picker__time-picker-wrap .el-picker-panel{position:absolute;top:13px;right:0;z-index:1;background:#fff}.el-time-range-picker{min-width:354px;overflow:visible}.el-time-range-picker__content{position:relative;text-align:center;padding:10px;display:-webkit-box;display:-ms-flexbox;display:flex}.el-time-range-picker__cell{box-sizing:border-box;margin:0;padding:4px 7px 7px;-webkit-box-flex:1;-ms-flex:1;flex:1}.el-time-range-picker__header{margin-bottom:5px;text-align:center;font-size:14px}.el-time-range-picker__body{display:-webkit-box;display:-ms-flexbox;display:flex;border-radius:2px;border:1px solid #d3dce6}