loit-web-component-gx/static/theme/Red/dialog.css

广西时代凌宇前端组件库

.v-modal-enter { -webkit-animation: v-modal-in .2s ease; animation: v-modal-in .2s ease } .v-modal-leave { -webkit-animation: v-modal-out .2s ease forwards; animation: v-modal-out .2s ease forwards } @-webkit-keyframes v-modal-in { 0% { opacity: 0 } } @keyframes v-modal-in { 0% { opacity: 0 } } @-webkit-keyframes v-modal-out { 100% { opacity: 0 } } @keyframes v-modal-out { 100% { opacity: 0 } } .v-modal { position: fixed; left: 0; top: 0; width: 100%; height: 100%; opacity: .5; background: #000 } .el-dialog { /* position: relative; top: 20%; margin: 0 auto 0.5rem; */ background: #fff; border-radius: 0.02rem; -webkit-box-shadow: 0 0.01rem 0.03rem rgba(0, 0, 0, .3); box-shadow: 0 0.01rem 0.03rem rgba(0, 0, 0, .3); -webkit-box-sizing: border-box; box-sizing: border-box; width: 50%; } .el-dialog.is-fullscreen { width: 100%; margin-top: 0; margin-bottom: 0; height: 100%; overflow: auto } .el-dialog__wrapper { position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; margin: 0 } .el-dialog__header { padding: 0.1rem 0.2rem 0.1rem; background: #e1806f; } .el-dialog__headerbtn { position: absolute; top: 0.15rem; right: 0.2rem; padding: 0; border: none; outline: 0; cursor: pointer; font-size: 0.16rem; background: #f0ae9f; border-radius: 50%; width: 0.2rem; height: 0.2rem; color: #fff; } .el-dialog__headerbtn .el-dialog__close { color: #fff; font-size: 0.14rem; } .el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close { color: #e1806f } .el-dialog__title { line-height: 0.24rem; font-size: 0.18rem; color: #fff } .el-dialog__body { padding: 0.3rem; color: #606266; line-height: 0.24rem; font-size: 0.14rem; width: auto; } .deteleP { display: flex; justify-content: center; margin: 0 auto; /* width: 50%; width: 3.6rem; height: 1.86rem; */ flex-direction: column; } .dialogDelete { font-size: 0.6rem; color: #EA0943; margin-right: 0.2rem; } .el-dialog__footer { padding: 0.06rem 0.2rem 0.06rem; text-align: right; -webkit-box-sizing: border-box; box-sizing: border-box; background: #f8e4de; border-top: 0.01rem solid #f0ae9f; } .el-dialog--center { text-align: center } .el-dialog--center .el-dialog__body { text-align: initial; padding: 0.25rem 0.25rem 0.3rem } .el-dialog--center .el-dialog__footer { text-align: inherit } .dialog-fade-enter-active { -webkit-animation: dialog-fade-in .3s; animation: dialog-fade-in .3s } .dialog-fade-leave-active { -webkit-animation: dialog-fade-out .3s; animation: dialog-fade-out .3s } @-webkit-keyframes dialog-fade-in { 0% { -webkit-transform: translate3d(0, -0.2rem, 0); transform: translate3d(0, -0.2rem, 0); opacity: 0 } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } } @keyframes dialog-fade-in { 0% { -webkit-transform: translate3d(0, -0.2rem, 0); transform: translate3d(0, -0.2rem, 0); opacity: 0 } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } } @-webkit-keyframes dialog-fade-out { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } 100% { -webkit-transform: translate3d(0, -0.2rem, 0); transform: translate3d(0, -0.2rem, 0); opacity: 0 } } @keyframes dialog-fade-out { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } 100% { -webkit-transform: translate3d(0, -0.2rem, 0); transform: translate3d(0, -0.2rem, 0); opacity: 0 } } .powerDialog .el-dialog { background: #e8f1fc } .powerDialog .el-dialog__body { padding: .1rem }