m2-ui/lib/theme-grace/modal.css

The package is provided web components and utilities based on vue and element-ui.

.m2-modal,.m2-modal .mask{left:0;right:0;width:100%;height:100%}.m2-modal{position:fixed;top:15%;z-index:999;-webkit-transition:all .5s;transition:all .5s}.m2-modal.modal-scroll,.m2-modal.modal-scroll .modal-dialog,.m2-modal.modal-scroll.slide-enter-active{top:20%}.m2-modal.slide-enter-active{top:15%}.m2-modal.slide-enter,.m2-modal.slide-leave-active{top:-100%}.m2-modal .mask{position:fixed;top:0;background-color:#000;z-index:9999;filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75}.m2-modal .modal-dialog{position:absolute;top:15%;left:50%;height:auto;overflow-y:hidden;z-index:10000;-webkit-transform:translate(-50%,-40%);transform:translate(-50%,-40%);background-color:#fff}.m2-modal .modal-dialog .modal-footer,.m2-modal .modal-dialog .modal-header{padding:0 20px;background-color:#ebeff2}.m2-modal .modal-dialog .modal-header{position:relative;height:44px;line-height:44px;font-size:14px}.m2-modal .modal-dialog .modal-header .title{color:#333;font-size:16px;font-weight:600}.m2-modal .modal-dialog .modal-header .close{position:absolute;display:inline-block;top:14px;right:20px;width:12px;height:12px;background:url(../img/close.png) center no-repeat;background-size:contain;cursor:pointer}.m2-modal .modal-dialog .modal-body{overflow-y:auto;padding:10px 20px}.m2-modal .modal-dialog .modal-footer{height:50px;line-height:50px;text-align:center}.m2-modal .modal-dialog .modal-footer .btn-group button{min-width:80px;padding:10px 15px;font-size:12px;border-radius:3px}.m2-modal .modal-dialog .modal-footer .btn-group button:last-child{margin-right:0}