Mobile.css: 두 판 사이의 차이
CABAL WIKI
편집 요약 없음 |
편집 요약 없음 |
||
74번째 줄: | 74번째 줄: | ||
.mw-parser-output > :not(#toc):not(.toc):first-child { | .mw-parser-output > :not(#toc):not(.toc):first-child { | ||
clear: both !important; | clear: both !important; | ||
} | |||
} | |||
@media screen and (max-width: 768px) { | |||
/* 📌 목차 기본 스타일 초기화 */ | |||
#toc, .toc { | |||
float: none !important; | |||
position: relative !important; | |||
clear: both !important; | |||
width: 100% !important; | |||
margin: 1em 0 !important; | |||
padding: 12px !important; | |||
background: #f8f8f8 !important; | |||
border: 1px solid #ccc !important; | |||
box-sizing: border-box !important; | |||
z-index: 1 !important; | |||
} | |||
/* 📌 목차 아래 첫 문단 강제 띄우기 */ | |||
.mw-parser-output > #toc + * { | |||
margin-top: 1em !important; | |||
clear: both !important; | |||
display: block !important; | |||
} | |||
/* 📌 본문 전반 margin 조정 */ | |||
.mw-parser-output { | |||
padding: 0 10px !important; | |||
} | |||
/* 📌 이미지/표도 겹치지 않도록 강제 block 처리 */ | |||
.thumb, .infobox, .navbox, .wikitable, table { | |||
float: none !important; | |||
clear: both !important; | |||
display: block !important; | |||
width: 100% !important; | |||
margin: 1em 0 !important; | |||
} | } | ||
} | } |
2025년 7월 25일 (금) 06:34 판
/* ===================== */ /* 📱 Timeless 모바일 최적화 패키지 */ /* 위치: MediaWiki:Mobile.css */ /* ===================== */ @media screen and (max-width: 768px) { /* 📌 본문 여백 최소화 */ .mw-body, .mw-body-content, .mw-parser-output { padding: 10px !important; margin: 0 !important; } /* 📌 목차 상단 고정 해제 + 줄바꿈 */ #toc, .toc { float: none !important; position: static !important; display: block !important; width: 100% !important; max-width: 100% !important; margin: 1em 0 !important; padding: 10px !important; background: #f9f9f9 !important; border: 1px solid #ccc !important; font-size: 14px !important; box-sizing: border-box; z-index: 1 !important; } /* 📌 목차 리스트 줄바꿈 */ #toc li, .toc li { line-height: 1.6em; word-break: break-word; } /* 📌 infobox 폭 자동 줄이기 */ .infobox, table.infobox { width: 100% !important; float: none !important; display: block !important; clear: both !important; margin: 1em 0 !important; box-sizing: border-box; } /* 📌 이미지/표 줄바꿈 */ .thumb, .navbox, .wikitable, table { width: 100% !important; display: block !important; overflow-x: auto !important; box-sizing: border-box; } /* 📌 리스트 들여쓰기 */ ul, ol { padding-left: 1.2em; } li { line-height: 1.6em; word-break: break-word; } /* 📌 전체 폰트 크기 축소 */ body { font-size: 14px !important; } /* 📌 사이드바 감추기 */ #mw-panel, #site-navigation, .sidebar { display: none !important; } /* 📌 목차 아래 첫 번째 요소 겹침 방지 */ .mw-parser-output > :not(#toc):not(.toc):first-child { clear: both !important; } } @media screen and (max-width: 768px) { /* 📌 목차 기본 스타일 초기화 */ #toc, .toc { float: none !important; position: relative !important; clear: both !important; width: 100% !important; margin: 1em 0 !important; padding: 12px !important; background: #f8f8f8 !important; border: 1px solid #ccc !important; box-sizing: border-box !important; z-index: 1 !important; } /* 📌 목차 아래 첫 문단 강제 띄우기 */ .mw-parser-output > #toc + * { margin-top: 1em !important; clear: both !important; display: block !important; } /* 📌 본문 전반 margin 조정 */ .mw-parser-output { padding: 0 10px !important; } /* 📌 이미지/표도 겹치지 않도록 강제 block 처리 */ .thumb, .infobox, .navbox, .wikitable, table { float: none !important; clear: both !important; display: block !important; width: 100% !important; margin: 1em 0 !important; } }