Dialogs.css

참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.

파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
오페라: Ctrl-F5를 입력.

/* =========================================
   COASTLINE: BLACK ICE - Dialogs
   ========================================= */

/* 업로드 다이얼로그 */
.oo-ui-window-content, .oo-ui-dialog-content {
    background: #171717 !important;
    color: #e2e2e2 !important;
}
.oo-ui-panelLayout:not(.oo-ui-stackLayout):not(.oo-ui-indexLayout-stackLayout) {
    background: #171717 !important;
    color: #e2e2e2 !important;
}
.oo-ui-fieldLayout, .oo-ui-inputWidget input, .oo-ui-textInputWidget input, .oo-ui-selectWidget {
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 1px solid #854369 !important;
}
.oo-ui-window-head, .oo-ui-window-foot {
    background: #0a0909 !important;
    border-color: #854369 !important;
}
.oo-ui-selectFileInputWidget, .oo-ui-selectFileWidget {
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 1px solid #854369 !important;
}
.oo-ui-buttonElement-button {
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 1px solid #854369 !important;
}
.oo-ui-buttonElement-button:hover {
    background: #2a1a24 !important;
    border-color: #b45c8f !important;
}
.oo-ui-processDialog-location {
    background: #0a0909 !important;
    color: #e2e2e2 !important;
    border-bottom: 1px solid #854369 !important;
}
.mw-upload-bookletLayout-filePreview {
    background: #171717 !important;
    border: 1px solid #854369 !important;
}
.oo-ui-inputWidget-input {
    background: #171717 !important;
    color: #e2e2e2 !important;
    border: 1px solid #854369 !important;
}
.oo-ui-textInputWidget-autosized {
    background: #171717 !important;
    color: #e2e2e2 !important;
}


/* =========================================
   CLBI / OOUI edit-cancel diff dialog scroll hotfix
   =========================================
   MediaWiki의 편집 취소/이탈 확인 diff 창처럼 내용이 긴
   OOUI ProcessDialog가 화면 높이를 넘을 때, 아래 확인/취소
   버튼이 뷰포트 밖으로 밀려 클릭할 수 없던 문제를 막는다.

   핵심:
   - overlay/window manager 자체가 세로 스크롤을 받을 수 있게 함
   - modal frame은 화면 높이를 넘지 않게 제한
   - dialog body/panel 내부만 스크롤되게 함
   - header/footer는 OOUI 기본 위치를 유지
*/

.oo-ui-windowManager-modal,
.oo-ui-defaultOverlay {
    max-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.oo-ui-windowManager-modal .oo-ui-dialog,
.oo-ui-windowManager-modal .oo-ui-window,
.oo-ui-defaultOverlay .oo-ui-dialog,
.oo-ui-defaultOverlay .oo-ui-window {
    max-height: calc(100vh - 24px) !important;
}

.oo-ui-windowManager-modal .oo-ui-window-frame,
.oo-ui-defaultOverlay .oo-ui-window-frame {
    max-height: calc(100vh - 24px) !important;
}

.oo-ui-windowManager-modal .oo-ui-dialog-content,
.oo-ui-windowManager-modal .oo-ui-processDialog-content,
.oo-ui-defaultOverlay .oo-ui-dialog-content,
.oo-ui-defaultOverlay .oo-ui-processDialog-content {
    max-height: calc(100vh - 24px) !important;
    overflow: hidden !important;
}

.oo-ui-windowManager-modal .oo-ui-window-body,
.oo-ui-windowManager-modal .oo-ui-processDialog .oo-ui-window-body,
.oo-ui-defaultOverlay .oo-ui-window-body,
.oo-ui-defaultOverlay .oo-ui-processDialog .oo-ui-window-body {
    overflow-y: auto !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

.oo-ui-windowManager-modal .oo-ui-panelLayout,
.oo-ui-defaultOverlay .oo-ui-panelLayout {
    max-height: calc(100vh - 128px) !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
}

미디어위키:Dialogs.css