MediaWiki:Common.css: Difference between revisions

Revision as of 06:10, 14 December 2025

/* =========================================================
   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;
}