ivue-material-plus
Version:
A high quality UI components Library with Vue.js
1 lines • 11.3 kB
CSS
:root{--ivue-picker-radius:2px;--ivue-picker-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2),0 1px 1px 0 rgba(0, 0, 0, 0.14),0 1px 3px 0 rgba(0, 0, 0, 0.12);--ivue-picker-title-padding:16px;--ivue-picker-landscape-title-width:170px}.ivue-picker{border-radius:var(--ivue-picker-radius);contain:layout style;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;vertical-align:top}.ivue-picker-card{position:relative;border-radius:var(--ivue-picker-radius);min-width:0;-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1);-webkit-box-shadow:var(--ivue-picker-shadow);box-shadow:var(--ivue-picker-shadow)}.ivue-picker-title{border-top-left-radius:var(--ivue-picker-radiu);border-top-right-radius:var(--ivue-picker-radiu);padding:var(--ivue-picker-title-padding);color:var(--ivue-white-color)}.ivue-picker-body{height:auto;overflow:hidden;position:relative;z-index:0;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;display:-webkit-box;display:-ms-flexbox;display: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}.ivue-picker-body>div{width:100%}.ivue-picker--fullWidth{display:-webkit-box;display:-ms-flexbox;display:flex}.ivue-picker--landscape .ivue-picker-title{position:absolute;top:0;left:0;height:100%;z-index:1;border-top-right-radius:0;border-bottom-right-radius:0;width:var(--ivue-picker-landscape-title-width)}.ivue-picker--landscape .ivue-picker-body{margin-left:var(--ivue-picker-landscape-title-width)}.ivue-picker-primary{background-color:var(--ivue-primary-color);border-color:var(--ivue-primary-color)}.ivue-picker-fade-enter-active,.ivue-picker-fade-leave-active{-webkit-transition:opacity .3s cubic-bezier(.4,0,.2,1);transition:opacity .3s cubic-bezier(.4,0,.2,1)}.ivue-picker-fade-enter-from,.ivue-picker-fade-leave-to{position:absolute;opacity:0}:root{--ivue-date-picker-title-year-margin-bottom:8px;--ivue-date-picker-title-date-font-size:34px;--ivue-date-picker-title-date-padding-bottom:16px;--ivue-date-picker-title-hover-color:rgba(255, 255, 255, 0.6)}.ivue-date-picker-title{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;line-height:1;color:var(--ivue-white-color)}.ivue-date-picker-title--btn{-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.ivue-date-picker-title--year{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-size:var(--ivue-font-base-size);font-weight:500;margin-bottom:var(--ivue-date-picker-title-year-margin-bottom);cursor:pointer;-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.ivue-date-picker-title--year:hover:not(.ivue-picker-readonly){color:var(--ivue-date-picker-title-hover-color)}.ivue-date-picker-title--year i{margin:initial;-webkit-transition:none;transition:none}.ivue-date-picker-title--date{font-size:var(--ivue-date-picker-title-date-font-size);text-align:left;font-weight:500;position:relative;overflow:hidden;padding-bottom:var(--ivue-date-picker-title-date-padding-bottom)}.picker-reverse-transition-enter-active,.picker-reverse-transition-leave-active,.picker-transition-enter-active,.picker-transition-leave-active{-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.picker-reverse-transition-enter-from,.picker-reverse-transition-leave-to,.picker-transition-enter-from,.picker-transition-leave-to{opacity:0}.picker-reverse-transition-enter-to,.picker-transition-enter-to{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}.picker-reverse-transition-leave,.picker-reverse-transition-leave-active,.picker-reverse-transition-leave-to,.picker-transition-leave,.picker-transition-leave-active,.picker-transition-leave-to{position:absolute }.picker-transition-enter-from{-webkit-transform:translate(0,100%);-ms-transform:translate(0,100%);transform:translate(0,100%)}.picker-transition-leave-to{-webkit-transform:translate(0,-100%);-ms-transform:translate(0,-100%);transform:translate(0,-100%)}.picker-reverse-transition-enter-from{-webkit-transform:translate(0,-100%);-ms-transform:translate(0,-100%);transform:translate(0,-100%)}.picker-reverse-transition-leave-to{-webkit-transform:translate(0,100%);-ms-transform:translate(0,100%);transform:translate(0,100%)}:root{--ivue-date-picker-header-padding:4px 16px;--ivue-date-picker-header-button-size:36px;--ivue-date-picker-header-icon-font-size:24px;--ivue-date-picker-header-button-color:rgba(0, 0, 0, 0.87)}.ivue-date-picker-header{position:relative;padding:var(--ivue-date-picker-header-padding);-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.ivue-date-picker-header--value{-webkit-box-flex:1;-ms-flex:1;flex:1;text-align:center;position:relative;overflow:hidden}.ivue-date-picker-header--value strong{-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1);display:block;width:100%;font-size:var(--ivue-font-base-size)}.ivue-date-picker-header--value:not(.ivue-date-picker-header--disabled){cursor:pointer}.ivue-date-picker-header--value:not(.ivue-date-picker-header--disabled) strong:not(:hover){color:var(--ivue-date-picker-header-button-color) ;background:0 0}.ivue-date-picker-header--value:not(.ivue-date-picker-header--disabled) strong:hover{color:var(--ivue-primary-color);background:0 0}.ivue-date-picker-header--disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ivue-date-picker-header--disabled strong{color:var(--ivue-disabled-color)}.ivue-date-picker-header .ivue-button--icon{width:var(--ivue-date-picker-header-button-size);min-width:var(--ivue-date-picker-header-button-size);height:var(--ivue-date-picker-header-button-size);margin:0 }.ivue-date-picker-header .ivue-icon{font-size:var(--ivue-date-picker-header-icon-font-size) }:root{--ivue-date-picker-date-height:248px;--ivue-date-picker-date-padding:0 12px;--ivue-date-picker-date-font-size:14px;--ivue-date-picker-date-table-th-padding:8px 0;--ivue-date-picker-date-table-td-width:45px;--ivue-date-picker-date-table-td-button-size:33px;--ivue-date-picker-date-note-size:8px;--ivue-date-picker-date-note-left:50%;--ivue-date-picker-date-note-bottom:2px;--ivue-date-picker-date-note-transform:translateX(-4px);--ivue-date-picker-date-button-color:rgba(0, 0, 0, 0.87);--ivue-date-picker-date-table-th-color:rgba(0, 0, 0, 0.38)}.ivue-date-picker-date{position:relative;text-align:center;padding:var(--ivue-date-picker-date-padding);height:var(--ivue-date-picker-date-height);font-size:var(--ivue-date-picker-date-font-size)}.ivue-date-picker-date table{table-layout:fixed;width:100%;-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.ivue-date-picker-date--table th{font-weight:600;padding:var(--ivue-date-picker-date-table-th-padding);color:var(--ivue-date-picker-date-table-th-color)}.ivue-date-picker-date--table td{position:relative;text-align:center;width:var(--ivue-date-picker-date-table-td-width)}.ivue-date-picker-date--table td button{text-align:center;height:var(--ivue-date-picker-date-table-td-button-size);width:var(--ivue-date-picker-date-table-td-button-size);min-width:var(--ivue-date-picker-date-table-td-button-size);font-size:var(--ivue-font-base-size);margin:0;color:var(--ivue-date-picker-date-button-color);border:1px solid;border-color:transparent}.ivue-date-picker-date--note{position:absolute;left:var(--ivue-date-picker-date-note-left);bottom:var(--ivue-date-picker-date-note-bottom);-webkit-transform:var(--ivue-date-picker-date-note-transform);-ms-transform:var(--ivue-date-picker-date-note-transform);transform:var(--ivue-date-picker-date-note-transform);border-radius:50%;width:var(--ivue-date-picker-date-note-size);height:var(--ivue-date-picker-date-note-size);background:currentColor}:root{--ivue-date-picker-month-padding:0 12px 12px 12px;--ivue-date-picker-month-height:248px;--ivue-date-picker-month-table-td-height:56px;--ivue-date-picker-month-table-td-button-max-width:160px;--ivue-date-picker-month-table-td-button-min-width:40px;--ivue-date-picker-month-button-color:rgba(0, 0, 0, 0.87)}.ivue-date-picker-month{position:relative;padding:var(--ivue-date-picker-month-padding);height:var(--ivue-date-picker-month-height)}.ivue-date-picker-month table{table-layout:fixed;width:100%;-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.ivue-date-picker-month--table td{position:relative;height:var(--ivue-date-picker-month-table-td-height);vertical-align:middle;text-align:center}.ivue-date-picker-month--table td button{margin:0 auto;max-width:var(--ivue-date-picker-month-table-td-button-max-width);min-width:var(--ivue-date-picker-month-table-td-button-min-width);width:100%;color:var(--ivue-date-picker-month-button-color)}:root{--ivue-date-picker-years-padding:0 12px 12px 12px;--ivue-date-picker-years-height:248px;--ivue-date-picker-years-table-td-height:56px;--ivue-date-picker-years-table-td-button-max-width:160px;--ivue-date-picker-years-table-td-button-min-width:40px;--ivue-date-picker-years-hover-color:rgba(255, 255, 255, 0.6);--ivue-date-picker-years-button-color:rgba(0, 0, 0, 0.87)}.ivue-date-picker-years{position:relative;padding:var(--ivue-date-picker-years-padding);height:var(--ivue-date-picker-years-height)}.ivue-date-picker-years table{table-layout:fixed;width:100%;-webkit-transition:.3s cubic-bezier(.4,0,.2,1);transition:.3s cubic-bezier(.4,0,.2,1)}.ivue-date-picker-years--table td{position:relative;height:var(--ivue-date-picker-years-table-td-height);vertical-align:middle;text-align:center}.ivue-date-picker-years--table td button{margin:0 auto;max-width:var(--ivue-date-picker-years-table-td-button-max-width);min-width:var(--ivue-date-picker-years-table-td-button-min-width);width:100%;color:var(--ivue-date-picker-years-button-color)}.tab-transition-enter-from{-webkit-transform:translate(100%,0);-ms-transform:translate(100%,0);transform:translate(100%,0)}.tab-transition-leave,.tab-transition-leave-active{position:absolute;top:0}.tab-transition-leave-to{position:absolute;-webkit-transform:translate(-100%,0);-ms-transform:translate(-100%,0);transform:translate(-100%,0)}.tab-reverse-transition-enter-from{position:absolute;top:0;-webkit-transform:translate(-100%,0);-ms-transform:translate(-100%,0);transform:translate(-100%,0)}.tab-reverse-transition-leave,.tab-reverse-transition-leave-to{top:0;position:absolute;-webkit-transform:translate(100%,0);-ms-transform:translate(100%,0);transform:translate(100%,0)}.fade--transition-leave-active,.fade-transition-enter-active{-webkit-transition:opacity .3s cubic-bezier(.25,.8,.5,1);transition:opacity .3s cubic-bezier(.25,.8,.5,1)}.fade-transition-enter-from,.fade-transition-leave-to{opacity:0}