MediaWiki:Common.css: Difference between revisions
No edit summary |
Revert caption table width stabilization Tag: Manual revert |
||
| (18 intermediate revisions by 3 users not shown) | |||
| Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
@import url( 'https://fonts.googleapis.com/ | @import url('https://fonts.googleapis.com/css2?family=Baloo+Paaji+2:wght@600;800&display=swap'); | ||
/* Changes the default font used for MediaWiki to Noto Sans (does not include headings or monospaced text): */ | /* Changes the default font used for MediaWiki to Noto Sans (does not include headings or monospaced text): */ | ||
| Line 17: | Line 17: | ||
#ca-viewsource { display: none !important; } | #ca-viewsource { display: none !important; } | ||
#footer-places-disclaimer { display: none; } | #footer-places-disclaimer { display: none; } | ||
.muhro-floating-tools { | |||
position: fixed; | |||
top: 4.5rem; | |||
right: 1rem; | |||
z-index: 1002; | |||
display: flex; | |||
flex-direction: column; | |||
align-items: flex-end; | |||
gap: 0.45rem; | |||
max-width: min(22rem, calc(100vw - 2rem)); | |||
} | |||
.muhro-collapse-controls { | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 0.35rem; | |||
justify-content: flex-end; | |||
padding: 0.35rem; | |||
border: 1px solid #a2a9b1; | |||
border-radius: 4px; | |||
background: #fff; | |||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18); | |||
} | |||
.muhro-floating-toc { | |||
max-width: min(22rem, calc(100vw - 2rem)); | |||
} | |||
.muhro-floating-toc-button, | |||
.muhro-collapse-button { | |||
border: 1px solid #a2a9b1; | |||
border-radius: 4px; | |||
background: #f8f9fa; | |||
color: #202122; | |||
cursor: pointer; | |||
font: inherit; | |||
line-height: 1.4; | |||
} | |||
.muhro-floating-toc-button { | |||
float: right; | |||
padding: 0.3rem 0.8rem; | |||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16); | |||
} | |||
.muhro-collapse-button { | |||
padding: 0.25rem 0.75rem; | |||
} | |||
.muhro-floating-toc-button:hover, | |||
.muhro-floating-toc-button:focus, | |||
.muhro-collapse-button:hover:not(:disabled), | |||
.muhro-collapse-button:focus:not(:disabled) { | |||
border-color: #72777d; | |||
background: #fff; | |||
} | |||
.muhro-collapse-button:disabled { | |||
color: #72777d; | |||
cursor: default; | |||
opacity: 0.7; | |||
} | |||
.muhro-floating-toc-panel { | |||
clear: both; | |||
display: none; | |||
width: 22rem; | |||
max-width: calc(100vw - 2rem); | |||
max-height: min(70vh, 44rem); | |||
margin-top: 0.4rem; | |||
border: 1px solid #a2a9b1; | |||
border-radius: 4px; | |||
background: #fff; | |||
box-shadow: 0 3px 12px rgba(0, 0, 0, 0.22); | |||
overflow: hidden; | |||
} | |||
.muhro-floating-toc.is-open .muhro-floating-toc-panel { | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.muhro-floating-toc-header { | |||
position: sticky; | |||
top: 0; | |||
z-index: 1; | |||
border-bottom: 1px solid #eaecf0; | |||
background: #fff; | |||
padding: 0.55rem 0.65rem; | |||
} | |||
.muhro-floating-toc-filter { | |||
box-sizing: border-box; | |||
width: 100%; | |||
border: 1px solid #a2a9b1; | |||
border-radius: 4px; | |||
background: #fff; | |||
color: #202122; | |||
font: inherit; | |||
line-height: 1.4; | |||
padding: 0.3rem 0.45rem; | |||
} | |||
.muhro-floating-toc-filter:focus { | |||
border-color: #36c; | |||
outline: 1px solid #36c; | |||
} | |||
.muhro-floating-toc-body { | |||
overflow: auto; | |||
padding: 0.55rem 0.85rem 0.65rem; | |||
} | |||
.muhro-floating-toc-panel ul { | |||
margin: 0; | |||
padding-left: 1.2rem; | |||
} | |||
.muhro-floating-toc-panel > .muhro-floating-toc-body > ul { | |||
padding-left: 0; | |||
} | |||
.muhro-floating-toc-panel li { | |||
margin: 0.15rem 0; | |||
list-style: none; | |||
} | |||
.muhro-floating-toc-panel a { | |||
display: block; | |||
color: #36c; | |||
line-height: 1.25; | |||
padding: 0.12rem 0; | |||
text-decoration: none; | |||
} | |||
.muhro-floating-toc-panel a:hover, | |||
.muhro-floating-toc-panel a:focus { | |||
text-decoration: underline; | |||
} | |||
.muhro-floating-toc-panel .tocnumber { | |||
color: #54595d; | |||
margin-right: 0.35rem; | |||
} | |||
.muhro-floating-toc-panel .muhro-toc-hidden { | |||
display: none; | |||
} | |||
.muhro-floating-toc-panel .muhro-toc-match > a { | |||
border-radius: 3px; | |||
background: #eaf3ff; | |||
} | |||
@media (max-width: 720px) { | |||
.muhro-floating-tools { | |||
top: 0.5rem; | |||
right: 0.5rem; | |||
max-width: calc(100vw - 1rem); | |||
} | |||
.muhro-floating-toc, | |||
.muhro-floating-toc-panel { | |||
width: calc(100vw - 1rem); | |||
max-width: calc(100vw - 1rem); | |||
} | |||
.muhro-floating-toc-panel { | |||
max-height: 55vh; | |||
} | |||
.muhro-collapse-button { | |||
padding: 0.2rem 0.55rem; | |||
} | |||
} | |||
/* Keep MediaWiki caption collapsible toggles below section headings. */ | |||
.mw-parser-output table.mw-collapsible > caption > .mw-collapsible-toggle { | |||
display: block; | |||
float: none; | |||
width: max-content; | |||
margin: 0.15rem 0 0; | |||
white-space: nowrap; | |||
font-size: 0.85em; | |||
font-weight: 600; | |||
line-height: 1.2; | |||
} | |||
.mw-parser-output table.mw-collapsible.mw-collapsed:has(> caption) { | |||
width: 100%; | |||
min-width: min(100%, 32rem); | |||
} | |||