미디어위키:Common.css

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

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

/* 이 CSS 설정은 모든 스킨에 적용됩니다 */

/* ===============================
   문서 제목 자동 번호 매기기
   (Vector 2022)
   =============================== */

/* 카운터 초기화 */
.mw-parser-output {
  counter-reset: h2;
}

/* == Heading == */
.mw-parser-output h2 {
  counter-reset: h3;
}

.mw-parser-output h2::before {
  counter-increment: h2;
  content: counter(h2) ". ";
  margin-right: 4px;
  color: #000;
  font-weight: 600;
}

/* === Heading === */
.mw-parser-output h3::before {
  counter-increment: h3;
  content: counter(h2) "." counter(h3) " ";
  margin-right: 4px;
  color: #000;
  font-weight: 500;
}

/* === Heading (h3) 하단 구분선 추가 === */
.mw-parser-output h3 {
  border-bottom: 1px solid #e1e8ed;
  padding-bottom: 6px;
  margin-bottom: 16px;
}

/* ==== Heading ==== (선택) */
.mw-parser-output h4::before {
  counter-increment: h4;
  content: counter(h2) "." counter(h3) "." counter(h4) " ";
  margin-right: 4px;
  color: #555;
}

/* 편집 링크가 없을 때(편집 모드 등) 제목이 벌어지지 않게 */
.mw-parser-output h2:not(:has(.mw-editsection)),
.mw-parser-output h3:not(:has(.mw-editsection)) {
  justify-content: flex-start;
}



/* ===============================
   Heading 제목 ↔ 편집 링크 양끝 정렬
   (h2, h3 공통)
   =============================== */

.mw-parser-output h2,
.mw-parser-output h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 제목 텍스트는 왼쪽 고정 */
.mw-parser-output .mw-headline {
  flex: 1 1 auto;
}

/* [편집 | 원본 편집]은 오른쪽 */
.mw-parser-output .mw-editsection {
  flex: 0 0 auto;
  font-size: 12px;
  white-space: nowrap;
}

/* ===============================
   TOC(목차)에도 제목 번호 표시
   Vector 2022(.vector-toc) + 구 TOC(#toc) 모두 지원
   =============================== */

/* ---- Vector 2022 TOC ---- */
.vector-toc {
  counter-reset: toc1;
}

.vector-toc .vector-toc-level-1 {
  counter-reset: toc2;
}

.vector-toc .vector-toc-level-2 {
  counter-reset: toc3;
}

/* 1단계 */
.vector-toc .vector-toc-level-1 > a .vector-toc-text::before {
  counter-increment: toc1;
  content: counter(toc1) ". ";
  margin-right: 2px;
}

/* 2단계 */
.vector-toc .vector-toc-level-2 > a .vector-toc-text::before {
  counter-increment: toc2;
  content: counter(toc1) "." counter(toc2) " ";
  margin-right: 2px;
}

/* 3단계(필요 시) */
.vector-toc .vector-toc-level-3 > a .vector-toc-text::before {
  counter-increment: toc3;
  content: counter(toc1) "." counter(toc2) "." counter(toc3) " ";
  margin-right: 2px;
}

/* ---- 구형 TOC(#toc) ---- */
#toc,
.toc {
  counter-reset: toc1;
}

#toc .toclevel-1,
.toc .toclevel-1 {
  counter-reset: toc2;
}

#toc .toclevel-2,
.toc .toclevel-2 {
  counter-reset: toc3;
}

/* 1단계 */
#toc .toclevel-1 > a .toctext::before,
.toc .toclevel-1 > a .toctext::before {
  counter-increment: toc1;
  content: counter(toc1) ". ";
  margin-right: 2px;
}

/* 2단계 */
#toc .toclevel-2 > a .toctext::before,
.toc .toclevel-2 > a .toctext::before {
  counter-increment: toc2;
  content: counter(toc1) "." counter(toc2) " ";
  margin-right: 2px;
}

/* 3단계(필요 시) */
#toc .toclevel-3 > a .toctext::before,
.toc .toclevel-3 > a .toctext::before {
  counter-increment: toc3;
  content: counter(toc1) "." counter(toc2) "." counter(toc3) " ";
  margin-right: 2px;
}

/* Vector 2022 사이드 TOC: '처음 위치(Top)' 항목 숨기기 (강력) */
.vector-toc a[rel="mw:PageProp/TOC"],
.vector-toc a[href="#mw-head"],
.vector-toc a[href="#top"],
.vector-toc .vector-toc-level-1:first-child:has(a[href^="#mw"]) {
  display: none !important;
}

/* 혹시 링크 말고 li 자체가 top 항목이면 */
.vector-toc li.vector-toc-level-1:first-child:has(a[href^="#mw"]),
.vector-toc li.vector-toc-level-1:first-child:has(a[href="#mw-head"]) {
  display: none !important;
}


/* Vector 2022 사이드 TOC: '처음 위치'에는 번호 표시 X + 카운트 증가 X */
.vector-toc a[rel="mw:PageProp/TOC"] .vector-toc-text::before,
.vector-toc a[href="#mw-head"] .vector-toc-text::before,
.vector-toc a[href="#top"] .vector-toc-text::before {
  content: "" !important;
  margin-right: 0 !important;
  counter-increment: none !important;
}