.v--modal-block-scroll { overflow: hidden; width: 100vw; } .v--modal-overlay { position: fixed; box-sizing: border-box; left: 0; top: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.2); z-index: 999; opacity: 1; } .v--modal-overlay.scrollable { height: 100%; min-height: 100vh; overflow-y: auto; -webkit-overflow-scrolling: touch; } .v--modal-overlay .v--modal-background-click { min-height: 100%; width: 100%; padding-bottom: 10px; } .v--modal-overlay .v--modal-box { position: relative; overflow: hidden; box-sizing: border-box; } .v--modal-overlay.scrollable .v--modal-box { margin-bottom: 2px; /* transition: top 0.2s ease; */ } .v--modal { background-color: white; text-align: left; border-radius: 3px; box-shadow: 0 20px 60px -2px rgba(27, 33, 58, 0.4); padding: 0; } .v--modal.v--modal-fullscreen { width: 100vw; height: 100vh; margin: 0; left: 0; top: 0; } .v--modal-top-right { display: block; position: absolute; right: 0; top: 0; } .overlay-fade-enter-active, .overlay-fade-leave-active { transition: all 0.2s; } .overlay-fade-enter, .overlay-fade-leave-active { opacity: 0; } .nice-modal-fade-enter-active, .nice-modal-fade-leave-active { transition: all 0.4s; } .nice-modal-fade-enter, .nice-modal-fade-leave-active { opacity: 0; transform: translateY(-20px); } .vue-modal-resizer { display: block; overflow: hidden; position: absolute; width: 12px; height: 12px; right: 0; bottom: 0; z-index: 9999999; background: transparent; cursor: se-resize; } .vue-modal-resizer::after { display: block; position: absolute; content: ''; background: transparent; left: 0; top: 0; width: 0; height: 0; border-bottom: 10px solid #ddd; border-left: 10px solid transparent; } .vue-modal-resizer.clicked::after { border-bottom: 10px solid #369be9; } .vue-dialog div { box-sizing: border-box; } .vue-dialog .dialog-flex { width: 100%; height: 100%; } .vue-dialog .dialog-content { flex: 1 0 auto; width: 100%; padding: 15px; font-size: 14px; } .vue-dialog .dialog-c-title { font-weight: 600; padding-bottom: 15px; } .vue-dialog .dialog-c-text { } .vue-dialog .vue-dialog-buttons { display: flex; flex: 0 1 auto; width: 100%; border-top: 1px solid #eee; } .vue-dialog .vue-dialog-buttons-none { width: 100%; padding-bottom: 15px; } .vue-dialog-button { font-size: 12px !important; background: transparent; padding: 0; margin: 0; border: 0; cursor: pointer; box-sizing: border-box; line-height: 40px; height: 40px; color: inherit; font: inherit; outline: none; } .vue-dialog-button:hover { background: rgba(0, 0, 0, 0.01); } .vue-dialog-button:active { background: rgba(0, 0, 0, 0.025); } .vue-dialog-button:not(:first-of-type) { border-left: 1px solid #eee; }