various-ui/styles/modal.css

This is a test version of the Vue 3 component library

.ui-modal{--uioption-modal-icon-color:var(--uicolor-font-1);--uioption-modal-box-shadow:var(--uicolor-box-shadow);--uioption-modal-border-radius:8px;--uioption-modal-background-color:var(--uicolor-font-6);--uioption-modal-active-icon-color:var(--uicolor-main-color)}.ui-modal{position:fixed;overflow-y:auto;background-color:var(--uicolor-full-mask)}.ui-modal>.ui-modal-container{position:relative;transition:margin-top .5s;box-shadow:var(--uioption-modal-box-shadow);border-radius:var(--uioption-modal-border-radius);background-color:var(--uioption-modal-background-color)}.ui-modal>.ui-modal-container>.ui-modal-header{line-height:40px;font-weight:700;font-size:32px;position:relative;margin:0 0 28px}.ui-modal>.ui-modal-container>.ui-modal-close{transition:all .3s;font-size:48px;position:absolute;cursor:pointer;right:20px;color:var(--uioption-modal-icon-color);top:20px}.ui-modal>.ui-modal-container>.ui-modal-close:hover{color:var(--uioption-modal-active-icon-color)}