ivue-material-plus
Version:
A high quality UI components Library with Vue.js
1 lines • 4.73 kB
CSS
:root{--ivue-modal-header-padding:14px 30px 14px 16px;--ivue-modal-header-content-font-size:16px;--ivue-modal-body-padding:16px;--ivue-modal-body-font-size:14px;--ivue-modal-footer-padding:12px 18px;--ivue-modal-footer-button-margin:12px;--ivue-modal-close-position:5px;--ivue-modal-spin-radius:8px;--ivue-modal-instance-head-padding:0 12px 0 0;--ivue-modal-instance-head-title-margin:12px;--ivue-modal-instance-icon-font-size:28px;--ivue-modal-instance-body-margin-top:10px;--ivue-modal-instance-body-padding-left:40px;--ivue-modal-instance-body-font-size:14px;--ivue-modal-instance-footer-margin-top:20px;--ivue-modal-media-margin:10px;--ivue-modal-content-shadow:0 4px 12px rgba(0, 0, 0, 0.15);--ivue-modal-mask-color:rgba(55, 55, 55, 0.6)}.ivue-modal{position:relative;top:0;width:auto;margin:0 auto;outline:0}.ivue-modal-mask{position:fixed;top:0;bottom:0;left:0;right:0;background-color:var(--ivue-modal-mask-color);height:100%;z-index:1000}.ivue-modal-wrapper{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;outline:0;overflow:auto}.ivue-modal-wrapper *{-webkit-box-sizing:border-box;box-sizing:border-box}.ivue-modal-hidden{display:none}.ivue-modal-no-mask{pointer-events:none}.ivue-modal-drag-mask{overflow:hidden;width:100%;height:100%}.ivue-modal-content{position:relative;background-color:var(--ivue-white-color);border:0;border-radius:8px;-webkit-box-shadow:var(--ivue-modal-content-shadow);box-shadow:var(--ivue-modal-content-shadow)}.ivue-modal-content--no-mask{pointer-events:auto}.ivue-modal-content--drag{position:absolute}.ivue-modal-content--drag .ivue-modal-header{cursor:move}.ivue-modal-content--dragging{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ivue-modal-header{border-bottom:1px solid var(--ivue-border-color);padding:var(--ivue-modal-header-padding);line-height:1}.ivue-modal-header--content{display:inline-block;width:100%;font-size:var(--ivue-modal-header-content-font-size);color:var(--ivue-title-color);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ivue-modal-body{padding:var(--ivue-modal-body-padding);font-size:var(--ivue-modal-body-font-size)}.ivue-modal-footer{border-top:1px solid var(--ivue-border-color);padding:var(--ivue-modal-footer-padding);text-align:right}.ivue-modal-footer--button{margin-right:var(--ivue-modal-footer-button-margin)}.ivue-modal-footer--button:last-child{margin-left:var(--ivue-modal-footer-button-margin);margin-right:0}.ivue-modal-close{position:absolute;top:var(--ivue-modal-close-position);right:var(--ivue-modal-close-position);cursor:pointer}.ivue-modal .ivue-modal-spin{border-radius:var(--ivue-modal-spin-radius)}.ivue-modal-center{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}.ivue-modal-fullscreen{width:100%;top:0;bottom:0;position:absolute}.ivue-modal-fullscreen .ivue-modal-content{position:absolute;top:0;bottom:0;width:100%;border-radius:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ivue-modal-fullscreen .ivue-modal-body{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:auto}.ivue-modal-instance--head{padding:var(--ivue-modal-instance-head-padding);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.ivue-modal-instance--head__title{margin-left:var(--ivue-modal-instance-head-title-margin);font-size:var(--ivue-modal-header-content-font-size);color:var(--ivue-title-color);font-weight:700}.ivue-modal-instance--head__icon{width:auto;height:auto;margin:0;font-size:var(--ivue-modal-instance-icon-font-size)}.ivue-modal-instance--head__success{color:var(--ivue-success-color);display:inline-block}.ivue-modal-instance--head__info{color:var(--ivue-primary-color)}.ivue-modal-instance--head__warning{color:var(--ivue-warning-color)}.ivue-modal-instance--head__error{color:var(--ivue-error-color)}.ivue-modal-instance--head__confirm{color:var(--ivue-warning-color)}.ivue-modal-instance--body{position:relative;margin-top:var(--ivue-modal-instance-body-margin-top);padding-left:var(--ivue-modal-instance-body-padding-left);font-size:var(--ivue-modal-instance-body-font-size);color:var(--ivue-text-color)}.ivue-modal-instance--body__render{padding:0;margin:0}.ivue-modal-instance--footer{margin-top:var(--ivue-modal-instance-footer-margin-top);text-align:right}@media (max-width:576px){.ivue-modal{width:auto;margin:var(--ivue-modal-media-margin)}.ivue-modal-fullscreen{width:100%;margin:0}.ivue-modal-drag-mask{margin:0}}