MediaWiki:Common.css
Appearance
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* =========================================================
Vector 2022: prevent overlapping duplicate search
Keep normal header search, hide sticky-header duplicate only
========================================================= */
/* Hide only the search inside the sticky header (duplicate) */
.vector-sticky-header input[type="search"],
.vector-sticky-header #searchInput,
.vector-sticky-header .vector-search-box,
.vector-sticky-header form.mw-search,
.vector-sticky-header [role="search"] {
display: none !important;
}
/* Ensure the normal header search stays visible */
.mw-header input[type="search"],
.mw-header #searchInput,
.mw-header .vector-search-box,
.mw-header form.mw-search,
.mw-header [role="search"] {
display: block !important;
}
/* =========================================================
Center ONLY the search area; keep user/login far right
Works even if Vector header wrappers differ
========================================================= */
/* PROOF (temporary): if you don't see this outline, Common.css isn't applying */
.mw-header { outline: 2px solid transparent; } /* change to red in debug if needed */
/* Make the header a simple 3-part flex row */
.mw-header {
display: flex !important;
align-items: center !important;
}
/* Logo stays left */
.mw-header .mw-logo {
flex: 0 0 auto !important;
}
/* Search lane takes remaining space and centers its contents */
.mw-header [role="search"],
.mw-header form.mw-search,
.mw-header #p-search,
.mw-header .vector-search-box,
.mw-header .vector-search-box-vue {
flex: 1 1 auto !important;
display: flex !important;
justify-content: center !important;
}
.mw-header [role="search"] input[type="search"],
.mw-header form.mw-search input[type="search"],
.mw-header #searchInput {
width: min(1240px, 100%) !important; /* slightly wider */
max-width: 1240px !important;
}
/* User/login tools forced far right */
.mw-header .vector-user-links,
.mw-header #p-personal,
.mw-header .mw-header-user,
.mw-header .vector-user-menu,
.mw-header .vector-user-menu-container {
flex: 0 0 auto !important;
margin-left: auto !important;
justify-self: end !important;
}
/* =========================================================
Lumenward link color policy
Uniform black / light black links across the site
========================================================= */
/* All links: default + visited */
a,
a:visited {
color: #0a0a0a !important; /* near-black */
text-decoration: none !important;
}
/* Hover / focus: subtle indication, no color shift */
a:hover,
a:focus {
color: #0a0a0a !important;
text-decoration: underline !important;
}
/* Active links */
a:active {
color: #0a0a0a !important;
}
/* Secondary / muted links (tabs, edit links, etc.) */
.mw-editsection a,
.mw-editsection a:visited,
.mw-tabs a,
.mw-tabs a:visited,
.vector-menu-tabs a,
.vector-menu-tabs a:visited {
color: #3a3a3a !important; /* light black / muted */
}
/* =========================================================
Force Lumenward logo text to pure black
========================================================= */
.mw-logo,
.mw-logo a,
.mw-logo a:visited,
.mw-logo a:hover,
.mw-logo a:active {
color: #000000 !important;
text-decoration: none !important;
}