Foreground.css: 두 판 사이의 차이
CABAL WIKI
편집 요약 없음 태그: 되돌려진 기여 |
편집 요약 없음 태그: 되돌려진 기여 |
||
| 1번째 줄: | 1번째 줄: | ||
html { scroll-behavior: smooth; } | html { scroll-behavior: smooth; } | ||
| 90번째 줄: | 8번째 줄: | ||
right: max(calc((100vw - 1180px)/2), 16px); | right: max(calc((100vw - 1180px)/2), 16px); | ||
width: 300px; | width: 300px; | ||
height: calc(100vh - 100px); | |||
overflow: auto; | overflow: auto; | ||
-webkit-overflow-scrolling: touch; | -webkit-overflow-scrolling: touch; | ||
| 116번째 줄: | 34번째 줄: | ||
.skin-foreground .mw-parser-output .mw-headline { scroll-margin-top: 92px; } | .skin-foreground .mw-parser-output .mw-headline { scroll-margin-top: 92px; } | ||
} | } | ||
@media screen and (max-width: 1024px) { | @media screen and (max-width: 1024px) { | ||
| 123번째 줄: | 40번째 줄: | ||
position: static !important; | position: static !important; | ||
width: auto !important; | width: auto !important; | ||
height: auto !important; | |||
overflow: visible !important; | overflow: visible !important; | ||
margin: .5em 0 !important; | margin: .5em 0 !important; | ||
| 129번째 줄: | 46번째 줄: | ||
} | } | ||
} | } | ||
.skin-foreground #toc a[href="#"], | .skin-foreground #toc a[href="#"], | ||
.skin-foreground #toc a[href="#top"], | .skin-foreground #toc a[href="#top"], | ||
.skin-foreground #toc a[href="#toc"] { pointer-events: none; opacity: .5; } | .skin-foreground #toc a[href="#toc"] { pointer-events: none; opacity: .5; } | ||
2025년 9월 22일 (월) 01:53 판
html { scroll-behavior: smooth; }
@media screen and (min-width: 1025px) {
.skin-foreground #toc,
.skin-foreground .toc {
position: fixed !important;
top: 84px;
right: max(calc((100vw - 1180px)/2), 16px);
width: 300px;
height: calc(100vh - 100px);
overflow: auto;
-webkit-overflow-scrolling: touch;
margin: 0 !important;
padding: 8px 10px !important;
border: 1px solid #eee !important;
background: #fff !important;
z-index: 20;
float: none !important;
font-size: 0.9rem !important;
line-height: 1.25 !important;
}
.skin-foreground #toc ul,
.skin-foreground .toc ul { margin: 0 !important; padding-left: 0 !important; }
.skin-foreground #toc li,
.skin-foreground .toc li { margin: 0 !important; line-height: 1.25 !important; }
.skin-foreground #toc a,
.skin-foreground .toc a { display: block !important; padding: 2px 0 !important; text-decoration: none; }
.skin-foreground #toc ul ul,
.skin-foreground .toc ul ul { margin-left: 0.6em !important; }
.skin-foreground #toc ul ul ul,
.skin-foreground .toc ul ul ul { margin-left: 0.5em !important; }
.skin-foreground .mw-parser-output .mw-headline { scroll-margin-top: 92px; }
}
@media screen and (max-width: 1024px) {
.skin-foreground #toc,
.skin-foreground .toc {
position: static !important;
width: auto !important;
height: auto !important;
overflow: visible !important;
margin: .5em 0 !important;
padding: 6px 8px !important;
}
}
.skin-foreground #toc a[href="#"],
.skin-foreground #toc a[href="#top"],
.skin-foreground #toc a[href="#toc"] { pointer-events: none; opacity: .5; }