.uploadModal { padding-top: 40px; } .formModal { min-height: 45vh; padding: 0 40px 0; .formSpace { gap: 40px 24px !important; } .previewModal { position: relative; width: 320px; height: 180px; margin-bottom: 12px; border: 1px solid #DCE2F1; border-radius: 10px; overflow: hidden; &:hover { border-color: #198CFE; } .image { width: 320px; height: 180px; img { width: inherit; height: fit-content; min-height: 100%; } } .titleType { position: absolute; top: 6px; left: 6px; width: 54px; height: 26px; z-index: 99; } .iconUploadDelete { position: absolute; top: 7px; right: 7px; width: 27px; height: 27px; z-index: 99; cursor: pointer; } .commonType { display: flex; align-items: center; position: absolute; bottom: 0; left: 0; font-size: 12px; font-weight: 600; color: #FFFFFF; height: 43px; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%); width: 100%; border-radius: 0 0 10px 10px; justify-content: flex-end; padding-right: 12px; z-index: 99; :global { .n-switch__rail { background-color: #ccc; } .n-switch.n-switch--active .n-switch__rail { background-color: var(--n-rail-color-active); } } } } .formItem { width: 320px; :global { .n-input { margin-bottom: 12px; } .n-input, .n-base-selection { border-radius: 8px; font-size: 18px; .n-input__input-el, .n-input__input-el::placeholder, .n-tag__content { font-size: 18px; } } .n-form-item-feedback-wrapper { min-height: 12px; } .n-upload-trigger+.n-upload-file-list { margin-top: 12px; } } } } .btnGroup { padding: 32px 0; :global { .n-button { height: 47px; min-width: 156px; } } } .uploadFile { margin-bottom: 12px; :global { .n-upload-dragger { padding: 0; border: none; } } .uploadBtn { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 320px; height: 180px; padding-top: 20px; background: #F9FAFD; border-radius: 10px; border: 1px solid #DCE2F1; font-size: 18px; color: #9EADD9; &:hover { border-color: #198CFE; } .iconUploadAdd { width: 50px; height: 50px; margin-bottom: 20px; } } }