미디어위키:Common.css: 두 판 사이의 차이
기술노트
편집 요약 없음 |
편집 요약 없음 |
||
(같은 사용자의 중간 판 2개는 보이지 않습니다) | |||
1번째 줄: | 1번째 줄: | ||
/* ========== | /* ========================================================= | ||
html, body, #content, #mw-content-text, .mw-body { | MediaWiki:Common.css (NamuWiki-like 스타일, 호환 버전) | ||
- CSS 변수(:root, --token) 미사용 | |||
========================================================= */ | |||
/* 기본 폰트 & 가독성 */ | |||
html, body, #content, #mw-content-text, .mw-body, .mw-parser-output { | |||
font-family: | font-family: | ||
"Noto Sans KR", | "Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕", | ||
Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji", | |||
Helvetica, Arial, | |||
sans-serif !important; | sans-serif !important; | ||
font-size: 16px; | font-size: 16px; | ||
line-height: 1.65; /* | line-height: 1.65; | ||
color: #202122; | |||
letter-spacing: -0.2px; /* 자간: 나무위키 느낌 */ | |||
word-break: keep-all; /* 한글 줄바꿈 개선 */ | |||
-webkit-font-smoothing: antialiased; | -webkit-font-smoothing: antialiased; | ||
-moz-osx-font-smoothing: grayscale; | -moz-osx-font-smoothing: grayscale; | ||
} | } | ||
/* | /* 페이지 제목(H1) */ | ||
#firstHeading, .mw-body h1.firstHeading { | #firstHeading, .mw-body h1.firstHeading { | ||
font-size: 1.875rem; | font-size: 1.875rem; /* ≈ 30px */ | ||
font-weight: 700; | font-weight: 700; | ||
color: # | color: #1f2328; | ||
margin | letter-spacing: -0.1px; | ||
margin: 0 0 .6rem 0; | |||
} | } | ||
/* | /* 섹션 제목(H2/H3) */ | ||
.mw-body h2 { | .mw-body h2 { | ||
font-size: 1. | font-size: 1.375rem; /* ≈ 22~24px */ | ||
font-weight: 700; | font-weight: 700; | ||
color: # | color: #1f2328; | ||
border-bottom: 1px solid # | letter-spacing: -0.1px; | ||
padding-bottom: . | border-bottom: 1px solid #e5e7eb; | ||
margin-top: 1. | padding-bottom: .35rem; | ||
margin-top: 1.4rem; | |||
} | } | ||
.mw-body h2 .mw-headline { font-weight: 700; } | .mw-body h2 .mw-headline { font-weight: 700; } | ||
.mw-body h3 { | .mw-body h3 { | ||
font-size: 1. | font-size: 1.125rem; /* ≈ 18~20px */ | ||
font-weight: 700; | font-weight: 700; | ||
color: # | color: #1f2328; | ||
margin-top: 1. | letter-spacing: -0.1px; | ||
margin-top: 1.1rem; | |||
} | } | ||
/* | /* 본문 여백 */ | ||
.mw-body-content p { margin: .6rem 0 | .mw-body-content p { margin: .6rem 0 .7rem; } | ||
b, strong { font-weight: 700; } | b, strong { font-weight: 700; letter-spacing: -0.1px; } | ||
i, em { font-style: italic; } | i, em { font-style: italic; } | ||
/* | /* 리스트 간격 */ | ||
.mw-body a { color: # | .mw-body ul, .mw-body ol { margin: .4rem 0 .7rem 1.3rem; } | ||
.mw-body a:hover { text-decoration: underline; } | |||
/* 링크 색상 */ | |||
.mw-body a { | |||
color: #1a73e8; | |||
text-decoration: none; | |||
} | |||
.mw-body a:hover, .mw-body a:focus { text-decoration: underline; } | |||
/* [편집] 링크 톤다운 */ | |||
.mw-editsection, .mw-editsection a { | |||
color: #6b7280; | |||
font-size: .875rem; | |||
} | |||
/* 목차(TOC) */ | |||
#toc, .toc { | |||
background: #f8fafc; | |||
border: 1px solid #e5e7eb; | |||
border-radius: 6px; | |||
padding: .6rem .75rem; | |||
font-size: .95rem; | |||
line-height: 1.6; | |||
} | |||
#toc .toctitle { font-weight: 700; letter-spacing: -0.1px; } | |||
#toc ul { margin-left: 1rem; } | |||
/* 표(wikitable) */ | |||
.mw-body .wikitable { | |||
border: 1px solid #e5e7eb; | |||
border-collapse: collapse; | |||
font-size: .95rem; | |||
background: #fff; | |||
} | |||
.mw-body .wikitable th { | |||
background: #f3f4f6; | |||
font-weight: 700; | |||
} | |||
.mw-body .wikitable th, | |||
.mw-body .wikitable td { | |||
border: 1px solid #e5e7eb; | |||
padding: .45rem .6rem; | |||
} | |||
.mw-body .wikitable tr:nth-child(even) { background: #fafafa; } | |||
/* 코드 블록 */ | |||
pre, code, kbd, samp, tt { | |||
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, | |||
"Liberation Mono", "Noto Sans Mono", monospace !important; | |||
font-size: .95em; | |||
} | |||
pre { | |||
background: #f8fafc; | |||
border: 1px solid #e5e7eb; | |||
border-radius: 6px; | |||
padding: .7rem; | |||
} | |||
/* 구분선 */ | |||
hr { border: 0; border-top: 1px solid #e5e7eb; margin: 1rem 0; } | |||
/* 캡션 살짝 그레이 */ | |||
div.thumb .thumbcaption { color: #6b7280; font-size: .92rem; } | |||
/* === Letter-spacing fix: 강제 적용 (TOC/리스트/링크/제목) === */ | |||
/* 본문 전체: 코드/모노스페이스 제외하고 자간 적용 */ | |||
.mw-parser-output :not(pre):not(code):not(kbd):not(samp):not(tt) { | |||
letter-spacing: -0.25px !important; /* 필요시 -0.20 ~ -0.30px로 조절 */ | |||
} | |||
/* H1/H2/H3 가끔 초기화되는 경우 보강 */ | |||
#firstHeading, | |||
.mw-body h2, .mw-body h2 .mw-headline, | |||
.mw-body h3 { letter-spacing: -0.25px !important; } | |||
/* TOC(목차) 내부는 별도 강제 */ | |||
#toc, .toc, | |||
#toc *, .toc * { letter-spacing: -0.25px !important; } | |||
/* 리스트 항목/링크에도 확실히 적용 */ | |||
.mw-parser-output li, | |||
.mw-parser-output a, | |||
.mw-parser-output span { letter-spacing: -0.25px !important; } | |||
/* | /* 코드·모노스페이스 블록은 원래 간격 유지 */ | ||
pre, code, kbd, samp, tt { letter-spacing: 0 !important; } | |||
2025년 9월 6일 (토) 05:01 기준 최신판
/* =========================================================
MediaWiki:Common.css (NamuWiki-like 스타일, 호환 버전)
- CSS 변수(:root, --token) 미사용
========================================================= */
/* 기본 폰트 & 가독성 */
html, body, #content, #mw-content-text, .mw-body, .mw-parser-output {
font-family:
"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",
Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",
sans-serif !important;
font-size: 16px;
line-height: 1.65;
color: #202122;
letter-spacing: -0.2px; /* 자간: 나무위키 느낌 */
word-break: keep-all; /* 한글 줄바꿈 개선 */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* 페이지 제목(H1) */
#firstHeading, .mw-body h1.firstHeading {
font-size: 1.875rem; /* ≈ 30px */
font-weight: 700;
color: #1f2328;
letter-spacing: -0.1px;
margin: 0 0 .6rem 0;
}
/* 섹션 제목(H2/H3) */
.mw-body h2 {
font-size: 1.375rem; /* ≈ 22~24px */
font-weight: 700;
color: #1f2328;
letter-spacing: -0.1px;
border-bottom: 1px solid #e5e7eb;
padding-bottom: .35rem;
margin-top: 1.4rem;
}
.mw-body h2 .mw-headline { font-weight: 700; }
.mw-body h3 {
font-size: 1.125rem; /* ≈ 18~20px */
font-weight: 700;
color: #1f2328;
letter-spacing: -0.1px;
margin-top: 1.1rem;
}
/* 본문 여백 */
.mw-body-content p { margin: .6rem 0 .7rem; }
b, strong { font-weight: 700; letter-spacing: -0.1px; }
i, em { font-style: italic; }
/* 리스트 간격 */
.mw-body ul, .mw-body ol { margin: .4rem 0 .7rem 1.3rem; }
/* 링크 색상 */
.mw-body a {
color: #1a73e8;
text-decoration: none;
}
.mw-body a:hover, .mw-body a:focus { text-decoration: underline; }
/* [편집] 링크 톤다운 */
.mw-editsection, .mw-editsection a {
color: #6b7280;
font-size: .875rem;
}
/* 목차(TOC) */
#toc, .toc {
background: #f8fafc;
border: 1px solid #e5e7eb;
border-radius: 6px;
padding: .6rem .75rem;
font-size: .95rem;
line-height: 1.6;
}
#toc .toctitle { font-weight: 700; letter-spacing: -0.1px; }
#toc ul { margin-left: 1rem; }
/* 표(wikitable) */
.mw-body .wikitable {
border: 1px solid #e5e7eb;
border-collapse: collapse;
font-size: .95rem;
background: #fff;
}
.mw-body .wikitable th {
background: #f3f4f6;
font-weight: 700;
}
.mw-body .wikitable th,
.mw-body .wikitable td {
border: 1px solid #e5e7eb;
padding: .45rem .6rem;
}
.mw-body .wikitable tr:nth-child(even) { background: #fafafa; }
/* 코드 블록 */
pre, code, kbd, samp, tt {
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas,
"Liberation Mono", "Noto Sans Mono", monospace !important;
font-size: .95em;
}
pre {
background: #f8fafc;
border: 1px solid #e5e7eb;
border-radius: 6px;
padding: .7rem;
}
/* 구분선 */
hr { border: 0; border-top: 1px solid #e5e7eb; margin: 1rem 0; }
/* 캡션 살짝 그레이 */
div.thumb .thumbcaption { color: #6b7280; font-size: .92rem; }
/* === Letter-spacing fix: 강제 적용 (TOC/리스트/링크/제목) === */
/* 본문 전체: 코드/모노스페이스 제외하고 자간 적용 */
.mw-parser-output :not(pre):not(code):not(kbd):not(samp):not(tt) {
letter-spacing: -0.25px !important; /* 필요시 -0.20 ~ -0.30px로 조절 */
}
/* H1/H2/H3 가끔 초기화되는 경우 보강 */
#firstHeading,
.mw-body h2, .mw-body h2 .mw-headline,
.mw-body h3 { letter-spacing: -0.25px !important; }
/* TOC(목차) 내부는 별도 강제 */
#toc, .toc,
#toc *, .toc * { letter-spacing: -0.25px !important; }
/* 리스트 항목/링크에도 확실히 적용 */
.mw-parser-output li,
.mw-parser-output a,
.mw-parser-output span { letter-spacing: -0.25px !important; }
/* 코드·모노스페이스 블록은 원래 간격 유지 */
pre, code, kbd, samp, tt { letter-spacing: 0 !important; }