ivue-material-plus
Version:
A high quality UI components Library with Vue.js
1 lines • 7.97 kB
CSS
:root{--ivue-page-total-height:32px;--ivue-page-total-margin-right:10px;--ivue-page-total-font-size:14px;--ivue-page-item-margin-right:5px;--ivue-page-item-line-height:30px;--ivue-page-item-radius:4px;--ivue-page-item-text-padding:0 6px;--ivue-page-item-icon-font-size:20px;--ivue-page-abbreviation-font-size:12px;--ivue-page-abbreviation-icon-font-size:20px;--ivue-page-small-icon-line-height:22px;--ivue-page-simple-font-size:18px;--ivue-page-simple-sign-padding:0 8px 0 2px;--ivue-page-simple-input-width:30px;--ivue-page-simple-input-padding:4px 7px;--ivue-page-simple-input-margin:0 8px;--ivue-page-input-shadow:0 0 0 2px rgba(91, 142, 255, 0.2);--ivue-page-icon-size:24px;--ivue-page-options-margin-left:15px;--ivue-page-options-sizer-margin-right:10px;--ivue-page-options-elevator-height:32px;--ivue-page-options-elevator-width:50px;--ivue-page-disabled-color:#f8f9fd}.ivue-page{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.ivue-page-total{display:inline-block;height:var(--ivue-page-total-height);line-height:var(--ivue-page-total-height);margin-right:var(--ivue-page-total-margin-right);font-size:var(--ivue-page-total-font-size)}.ivue-page-item{position:relative;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;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-right:var(--ivue-page-item-margin-right);min-width:var(--ivue-page-total-height);height:var(--ivue-page-total-height);line-height:var(--ivue-page-item-line-height);list-style:none;cursor:pointer;border:1px solid var(--ivue-border-color);border-radius:var(--ivue-page-item-radius);-webkit-transition:var(--ivue-all-transition);transition:var(--ivue-all-transition);color:var(--ivue-text-color)}.ivue-page-item:hover{color:var(--ivue-primary-color);border-color:var(--ivue-primary-color)}.ivue-page-item--text{padding:var(--ivue-page-item-text-padding);font-size:var(--ivue-page-total-font-size)}.ivue-page-item--active{color:var(--ivue-primary-color);border-color:var(--ivue-primary-color)}.ivue-page-next,.ivue-page-prev{color:var(--ivue-arrow-color)}.ivue-page-next i,.ivue-page-prev i{-webkit-transition:none;transition:none;font-size:var(--ivue-page-item-icon-font-size)}.ivue-page-next{margin-right:0}.ivue-page-abbreviation{border-color:transparent;background:0 0;-webkit-transition:none;transition:none;-webkit-box-shadow:none;box-shadow:none;overflow:hidden;font-size:var(--ivue-page-abbreviation-font-size)}.ivue-page-abbreviation i{font-size:var(--ivue-page-abbreviation-icon-font-size)}.ivue-page-abbreviation .abbreviation{letter-spacing:1px;color:var(--ivue-disabled-color);text-align:center}.ivue-page-abbreviation .arrow{position:absolute;left:0;right:0;top:0;bottom:0;display:none}.ivue-page-abbreviation .arrow .ivue-icon{position:absolute;left:0;right:0;top:0;bottom:0;margin-left:5px;color:var(--ivue-primary-color);font-size:var(--ivue-page-abbreviation-icon-font-size)}.ivue-page-abbreviation .arrow .ivue-icon:first-child{margin-left:-1px}.ivue-page-abbreviation:hover{border-color:transparent}.ivue-page-abbreviation:hover .abbreviation{display:none}.ivue-page-abbreviation:hover .arrow{display:-webkit-box;display:-ms-flexbox;display:flex;color:var(--ivue-primary-color)}.ivue-page-small .ivue-page-next,.ivue-page-small .ivue-page-prev{margin:0;min-width:var(--ivue-page-icon-size);height:var(--ivue-page-icon-size);line-height:var(--ivue-page-small-icon-line-height);border:0}.ivue-page-small .ivue-page-item{border:0;margin:0;min-width:var(--ivue-page-icon-size);height:var(--ivue-page-icon-size);line-height:var(--ivue-page-icon-size)}.ivue-page-small .ivue-page-abbreviation .arrow .ivue-icon{font-size:var(--ivue-page-total-font-size);margin-left:2px}.ivue-page-small .ivue-page-abbreviation .arrow .ivue-icon:first-child{margin-left:-2px}.ivue-page-small .ivue-page-options--sizer .ivue-select-default .ivue-select-selection{height:var(--ivue-page-icon-size);min-height:var(--ivue-page-icon-size)}.ivue-page-small .ivue-page-options--sizer .ivue-select-selection-value{height:var(--ivue-page-icon-size);line-height:var(--ivue-page-icon-size)}.ivue-page-small .ivue-page-options--elevator__input{height:var(--ivue-page-icon-size)}.ivue-page-simple .ivue-page-next,.ivue-page-simple .ivue-page-prev{margin:0;border:0;height:var(--ivue-page-icon-size);line-height:normal;font-size:var(--ivue-page-simple-font-size)}.ivue-page-simple-page{display:inline-block;margin-right:8px;vertical-align:middle}.ivue-page-simple-sign{padding:var(--ivue-page-simple-sign-padding)}.ivue-page-simple-input{position:relative;display:inline-block;width:var(--ivue-page-simple-input-width);height:var(--ivue-page-icon-size);padding:var(--ivue-page-simple-input-padding);font-size:var(--ivue-page-total-font-size);border:1px solid var(--ivue-border-color);color:var(--ivue-text-color);background-color:var(--ivue-white-color);background-image:none;cursor:text;-webkit-transition:var(--ivue-all-transition);transition:var(--ivue-all-transition);border-radius:var(--ivue-border-radius);margin:var(--ivue-page-simple-input-margin);text-align:center}.ivue-page-simple-input:focus{outline:0;-webkit-box-shadow:var(--ivue-page-input-shadow);box-shadow:var(--ivue-page-input-shadow)}.ivue-page-simple-input:focus,.ivue-page-simple-input:hover{border-color:var(--ivue-primary-color)}.ivue-page-simple-input[disabled]{background-color:var(--ivue-page-disabled-color);opacity:1;cursor:var(--ivue-cursor-disabled);color:var(--ivue-input-disabled-color)}.ivue-page-simple-input[disabled]:hover{border-color:var(--ivue-border-color)}.ivue-page-disabled{cursor:not-allowed;color:var(--ivue-disabled-color)}.ivue-page-disabled:hover{color:var(--ivue-disabled-color);border-color:var(--ivue-border-color)}.ivue-page-slot{border-color:transparent}.ivue-page-slot:hover{border-color:transparent}.ivue-page-options{display:inline-block;vertical-align:middle;margin-left:var(--ivue-page-options-margin-left)}.ivue-page-options--sizer{display:inline-block;margin-right:var(--ivue-page-options-sizer-margin-right)}.ivue-page-options--sizer__dropdown{width:auto}.ivue-page-options--sizer .ivue-select-default .ivue-select-selection{height:var(--ivue-page-total-height);min-height:var(--ivue-page-total-height)}.ivue-page-options--sizer .ivue-select-selection-value{height:var(--ivue-page-item-line-height);line-height:var(--ivue-page-item-line-height);font-size:var(--ivue-page-total-font-size)}.ivue-page-options--elevator{display:inline-block;vertical-align:middle;height:var(--ivue-page-options-elevator-height);line-height:var(--ivue-page-options-elevator-height);font-size:var(--ivue-page-total-font-size);color:var(--ivue-text-color)}.ivue-page-options--elevator__input{display:inline-block;padding:var(--ivue-page-simple-input-padding);font-size:var(--ivue-page-total-font-size);border:1px solid var(--ivue-border-color);color:var(--ivue-text-color);background-color:var(--ivue-white-color);background-image:none;position:relative;cursor:text;-webkit-transition:var(--ivue-all-transition);transition:var(--ivue-all-transition);border-radius:var(--ivue-border-radius);margin:0 8px;width:var(--ivue-page-options-elevator-width);height:var(--ivue-page-total-height)}.ivue-page-options--elevator__input:focus{outline:0;-webkit-box-shadow:var(--ivue-page-input-shadow);box-shadow:var(--ivue-page-input-shadow)}.ivue-page-options--elevator__input:focus,.ivue-page-options--elevator__input:hover{border-color:var(--ivue-primary-color)}.ivue-page-options--elevator__input[disabled]{background-color:var(--ivue-page-disabled-color);opacity:1;cursor:var(--ivue-cursor-disabled);color:var(--ivue-input-disabled-color)}.ivue-page-options--elevator__input[disabled]:hover{border-color:var(--ivue-border-color)}