elara-ui/lib/theme/time-select.css

Elara based on element-ui, and add other usefull components

.elara-fade-in-enter,.elara-fade-in-leave-active,.elara-fade-in-linear-enter,.elara-fade-in-linear-leave,.elara-fade-in-linear-leave-active,.fade-in-linear-enter,.fade-in-linear-leave,.fade-in-linear-leave-active{opacity:0}.fade-in-linear-enter-active,.fade-in-linear-leave-active{-webkit-transition:opacity .2s linear;transition:opacity .2s linear}.elara-fade-in-linear-enter-active,.elara-fade-in-linear-leave-active{-webkit-transition:opacity .2s linear;transition:opacity .2s linear}.elara-fade-in-enter-active,.elara-fade-in-leave-active{-webkit-transition:all .3s cubic-bezier(.55,0,.1,1);transition:all .3s cubic-bezier(.55,0,.1,1)}.elara-zoom-in-center-enter-active,.elara-zoom-in-center-leave-active{-webkit-transition:all .3s cubic-bezier(.55,0,.1,1);transition:all .3s cubic-bezier(.55,0,.1,1)}.elara-zoom-in-center-enter,.elara-zoom-in-center-leave-active{opacity:0;-webkit-transform:scaleX(0);transform:scaleX(0)}.elara-zoom-in-top-enter-active,.elara-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}.elara-zoom-in-top-enter,.elara-zoom-in-top-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.elara-zoom-in-bottom-enter-active,.elara-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}.elara-zoom-in-bottom-enter,.elara-zoom-in-bottom-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.elara-zoom-in-left-enter-active,.elara-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}.elara-zoom-in-left-enter,.elara-zoom-in-left-leave-active{opacity:0;-webkit-transform:scale(.45,.45);transform:scale(.45,.45)}.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}.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}.elara-list-enter-active,.elara-list-leave-active{-webkit-transition:all 1s;transition:all 1s}.elara-list-enter,.elara-list-leave-active{opacity:0;-webkit-transform:translateY(-30px);transform:translateY(-30px)}.elara-opacity-transition{-webkit-transition:opacity .3s cubic-bezier(.55,0,.1,1);transition:opacity .3s cubic-bezier(.55,0,.1,1)}.elara-date-editor{position:relative;display:inline-block;text-align:left}.elara-date-editor.elara-input,.elara-date-editor.elara-input__inner{width:220px}.elara-date-editor--monthrange.elara-input,.elara-date-editor--monthrange.elara-input__inner{width:300px}.elara-date-editor--daterange.elara-input,.elara-date-editor--daterange.elara-input__inner,.elara-date-editor--timerange.elara-input,.elara-date-editor--timerange.elara-input__inner{width:350px}.elara-date-editor--datetimerange.elara-input,.elara-date-editor--datetimerange.elara-input__inner{width:400px}.elara-date-editor--dates .elara-input__inner{text-overflow:ellipsis;white-space:nowrap}.elara-date-editor .elara-icon-circle-close{cursor:pointer}.elara-date-editor .elara-range__icon{font-size:14px;margin-left:-5px;color:#C0C4CC;float:left;line-height:32px}.elara-date-editor .elara-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}.elara-date-editor .elara-range-input::-webkit-input-placeholder{color:#C0C4CC}.elara-date-editor .elara-range-input::-moz-placeholder{color:#C0C4CC}.elara-date-editor .elara-range-input::-ms-input-placeholder{color:#C0C4CC}.elara-date-editor .elara-range-input::placeholder{color:#C0C4CC}.elara-date-editor .elara-range-separator{display:inline-block;height:100%;padding:0 5px;margin:0;text-align:center;line-height:32px;font-size:14px;width:5%;color:#303133}.elara-date-editor .elara-range__close-icon{font-size:14px;color:#C0C4CC;width:25px;display:inline-block;float:right;line-height:32px}.elara-range-editor.elara-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}.elara-range-editor .elara-range-input{line-height:1}.elara-range-editor.is-active,.elara-range-editor.is-active:hover{border-color:#0087ff}.elara-range-editor--medium.elara-input__inner{height:36px}.elara-range-editor--medium .elara-range-separator{line-height:28px;font-size:14px}.elara-range-editor--medium .elara-range-input{font-size:14px}.elara-range-editor--medium .elara-range__close-icon,.elara-range-editor--medium .elara-range__icon{line-height:28px}.elara-range-editor--small.elara-input__inner{height:32px}.elara-range-editor--small .elara-range-separator{line-height:24px;font-size:13px}.elara-range-editor--small .elara-range-input{font-size:13px}.elara-range-editor--small .elara-range__close-icon,.elara-range-editor--small .elara-range__icon{line-height:24px}.elara-range-editor--mini.elara-input__inner{height:28px}.elara-range-editor--mini .elara-range-separator{line-height:20px;font-size:12px}.elara-range-editor--mini .elara-range-input{font-size:12px}.elara-range-editor--mini .elara-range__close-icon,.elara-range-editor--mini .elara-range__icon{line-height:20px}.elara-range-editor.is-disabled{background-color:#F5F7FA;border-color:#E4E7ED;color:#C0C4CC;cursor:not-allowed}.elara-range-editor.is-disabled:focus,.elara-range-editor.is-disabled:hover{border-color:#E4E7ED}.elara-range-editor.is-disabled input{background-color:#F5F7FA;color:#C0C4CC;cursor:not-allowed}.elara-range-editor.is-disabled input::-webkit-input-placeholder{color:#C0C4CC}.elara-range-editor.is-disabled input::-moz-placeholder{color:#C0C4CC}.elara-range-editor.is-disabled input::-ms-input-placeholder{color:#C0C4CC}.elara-range-editor.is-disabled input::placeholder{color:#C0C4CC}.elara-range-editor.is-disabled .elara-range-separator{color:#C0C4CC}.elara-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}.elara-picker-panel__body-wrapper::after,.elara-picker-panel__body::after{content:"";display:table;clear:both}.elara-picker-panel__content{position:relative;margin:15px}.elara-picker-panel__footer{border-top:1px solid #e4e4e4;padding:4px;text-align:right;background-color:#FFF;position:relative;font-size:0}.elara-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}.elara-picker-panel__shortcut:hover{color:#0087ff}.elara-picker-panel__shortcut.active{background-color:#e6f1fe;color:#0087ff}.elara-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}.elara-picker-panel__btn[disabled]{color:#ccc;cursor:not-allowed}.elara-picker-panel__icon-btn{font-size:12px;color:#303133;border:0;background:0 0;cursor:pointer;outline:0;margin-top:8px}.elara-picker-panel__icon-btn:hover{color:#0087ff}.elara-picker-panel__icon-btn.is-disabled{color:#bbb}.elara-picker-panel__icon-btn.is-disabled:hover{cursor:not-allowed}.elara-picker-panel__link-btn{vertical-align:middle}.elara-picker-panel [slot=sidebar],.elara-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}.elara-picker-panel [slot=sidebar]+.elara-picker-panel__body,.elara-picker-panel__sidebar+.elara-picker-panel__body{margin-left:110px}.elara-date-picker{width:322px}.elara-date-picker.has-sidebar.has-time{width:434px}.elara-date-picker.has-sidebar{width:438px}.elara-date-picker.has-time .elara-picker-panel__body-wrapper{position:relative}.elara-date-picker .elara-picker-panel__content{width:292px}.elara-date-picker table{table-layout:fixed;width:100%}.elara-date-picker__editor-wrap{position:relative;display:table-cell;padding:0 5px}.elara-date-picker__time-header{position:relative;border-bottom:1px solid #e4e4e4;font-size:12px;padding:8px 5px 5px;display:table;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box}.elara-date-picker__header{margin:12px;text-align:center}.elara-date-picker__header--bordered{margin-bottom:0;padding-bottom:12px;border-bottom:solid 1px #EBEEF5}.elara-date-picker__header--bordered+.elara-picker-panel__content{margin-top:0}.elara-date-picker__header-label{font-size:16px;font-weight:500;padding:0 5px;line-height:22px;text-align:center;cursor:pointer;color:#606266}.elara-date-picker__header-label.active,.elara-date-picker__header-label:hover{color:#0087ff}.elara-date-picker__prev-btn{float:left}.elara-date-picker__next-btn{float:right}.elara-date-picker__time-wrap{padding:10px;text-align:center}.elara-date-picker__time-label{float:left;cursor:pointer;line-height:30px;margin-left:10px}.elara-scrollbar{overflow:hidden;position:relative}.elara-scrollbar:active>.elara-scrollbar__bar,.elara-scrollbar:focus>.elara-scrollbar__bar,.elara-scrollbar:hover>.elara-scrollbar__bar{opacity:1;-webkit-transition:opacity 340ms ease-out;transition:opacity 340ms ease-out}.elara-scrollbar__wrap{overflow:scroll;height:100%}.elara-scrollbar__wrap--hidden-default{scrollbar-width:none}.elara-scrollbar__wrap--hidden-default::-webkit-scrollbar{width:0;height:0}.elara-scrollbar__thumb{position:relative;display:block;width:0;height:0;cursor:pointer;border-radius:inherit;background-color:rgba(144,147,153,.3);-webkit-transition:.3s background-color;transition:.3s background-color}.elara-scrollbar__thumb:hover{background-color:rgba(144,147,153,.5)}.elara-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}.elara-scrollbar__bar.is-vertical{width:6px;top:2px}.elara-scrollbar__bar.is-vertical>div{width:100%}.elara-scrollbar__bar.is-horizontal{height:6px;left:2px}.elara-scrollbar__bar.is-horizontal>div{height:100%}.elara-popper .popper__arrow,.elara-popper .popper__arrow::after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.elara-popper .popper__arrow{border-width:6px;-webkit-filter:drop-shadow(0 2px 12px rgba(0, 0, 0, .03));filter:drop-shadow(0 2px 12px rgba(0, 0, 0, .03))}.elara-popper .popper__arrow::after{content:" ";border-width:6px}.elara-popper[x-placement^=top]{margin-bottom:12px}.elara-popper[x-placement^=top] .popper__arrow{bottom:-6px;left:50%;margin-right:3px;border-top-color:#EBEEF5;border-bottom-width:0}.elara-popper[x-placement^=top] .popper__arrow::after{bottom:1px;margin-left:-6px;border-top-color:#FFF;border-bottom-width:0}.elara-popper[x-placement^=bottom]{margin-top:12px}.elara-popper[x-placement^=bottom] .popper__arrow{top:-6px;left:50%;margin-right:3px;border-top-width:0;border-bottom-color:#EBEEF5}.elara-popper[x-placement^=bottom] .popper__arrow::after{top:1px;margin-left:-6px;border-top-width:0;border-bottom-color:#FFF}.elara-popper[x-placement^=right]{margin-left:12px}.elara-popper[x-placement^=right] .popper__arrow{top:50%;left:-6px;margin-bottom:3px;border-right-color:#EBEEF5;border-left-width:0}.elara-popper[x-placement^=right] .popper__arrow::after{bottom:-6px;left:1px;border-right-color:#FFF;border-left-width:0}.elara-popper[x-placement^=left]{margin-right:12px}.elara-popper[x-placement^=left] .popper__arrow{top:50%;right:-6px;margin-bottom:3px;border-right-width:0;border-left-color:#EBEEF5}.elara-popper[x-placement^=left] .popper__arrow::after{right:1px;bottom:-6px;margin-left:-6px;border-right-width:0;border-left-color:#FFF}.time-select{margin:5px 0;min-width:0}.time-select .elara-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:#0087ff;font-weight:700}.time-select-item.disabled{color:#E4E7ED;cursor:not-allowed}.time-select-item:hover{background-color:#F5F7FA;font-weight:700;cursor:pointer}