Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
| Line 1: | Line 1: | ||
| − | /* | + | /* === Holdfast header banner (full-width strip w/ right fade) === */ |
| − | + | :root { --hf-banner-h: 150px; } /* tweak height here: 130–170px usually looks best */ | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| + | /* Works for Vector (legacy) and Vector 2022 */ | ||
| + | #mw-head, | ||
| + | .vector-header-container { | ||
| + | /* Two layers: 1) banner image, 2) right-side dark fade */ | ||
| + | background-image: | ||
| + | url("/Special:FilePath/BannerImage.png"), | ||
| + | linear-gradient(to right, rgba(0,0,0,0) 65%, rgba(30,30,29,0.9) 100%); | ||
| + | background-repeat: no-repeat, no-repeat; | ||
| + | background-position: left top, left top; | ||
| + | /* Image fills the header; gradient is exactly banner height */ | ||
| + | background-size: cover, 100% var(--hf-banner-h); | ||
| + | min-height: var(--hf-banner-h); | ||
| + | border-bottom: 0; /* remove any stray separator */ | ||
} | } | ||
| − | /* | + | /* Some skins paint base strips; kill them so the banner shows clean */ |
#mw-page-base, #mw-head-base { background: transparent !important; } | #mw-page-base, #mw-head-base { background: transparent !important; } | ||
| + | |||
| + | /* Main content containers shouldn't overpaint the header */ | ||
| + | #content, .mw-body, .vector-body .mw-body { background: transparent; } | ||
Revision as of 09:35, 10 October 2025
/* === Holdfast header banner (full-width strip w/ right fade) === */
:root { --hf-banner-h: 150px; } /* tweak height here: 130–170px usually looks best */
/* Works for Vector (legacy) and Vector 2022 */
#mw-head,
.vector-header-container {
/* Two layers: 1) banner image, 2) right-side dark fade */
background-image:
url("/Special:FilePath/BannerImage.png"),
linear-gradient(to right, rgba(0,0,0,0) 65%, rgba(30,30,29,0.9) 100%);
background-repeat: no-repeat, no-repeat;
background-position: left top, left top;
/* Image fills the header; gradient is exactly banner height */
background-size: cover, 100% var(--hf-banner-h);
min-height: var(--hf-banner-h);
border-bottom: 0; /* remove any stray separator */
}
/* Some skins paint base strips; kill them so the banner shows clean */
#mw-page-base, #mw-head-base { background: transparent !important; }
/* Main content containers shouldn't overpaint the header */
#content, .mw-body, .vector-body .mw-body { background: transparent; }