MediaWiki:Common.css - Revision history

Anurag at 15:31, 14 November 2026

2026-11-14T15:31:25Z

@@ Line 28,052: / Line 28,052: @@
          margin: 0 !important;
+     }
+}

Kashya at 15:26, 13 November 2026

2026-11-13T15:26:22Z

Show changes

Kashya at 02:57, 13 November 2026

2026-11-13T02:57:19Z

← Older revision		Revision as of 02:57, 13 November 2026
Line 27,990:		Line 27,990:
	visibility: visible !important;		visibility: visible !important;
	opacity: 1 !important;		opacity: 1 !important;
			}
			/* Ensure VaniSearch popup modal (#mspu_div_wrapper) stays on top of the sticky header */
			#mspu_div_wrapper {
			z-index: 2147483647 !important;
	}		}

Kashya at 02:23, 13 November 2026

2026-11-13T02:23:06Z

@@ Line 27,960: / Line 27,960: @@
+}
-/* 2. Position the replacement mobile search box (and fallback form) next to burger icon */
+/* 2. Ensure the top bar and search input are selectable and never blocked by a mask */
-body.skin-minerva .minerva-header .vani-mobile-search-box,
+body.skin-minerva .minerva-header,
-body.skin-minerva .minerva-header .minerva-search-form {
+body.skin-minerva .minerva-header .vani-mobile-search-wrap,
-     flex: 1 1 auto !important;
+body.skin-minerva #vani-mobile-search-input {
-     width: auto !important;
+     pointer-events: auto !important;
-     max-width: calc(100vw - 145px) !important;
+     user-select: text !important;
-    margin: 0 auto 0 10px !important;
+     -webkit-user-select: text !important;
+}
-/* 3. Keep search box visible at all times */
+/* 3. Disable Minerva's page mask and search overlay so they cannot block clicks or hide content */
-body.skin-minerva .minerva-header .search-box,
+.search-overlay,
-html.overlay-enabled body.skin-minerva .minerva-header .search-box,
+.minerva-search-overlay,
-body.skin-minerva.search-enabled .minerva-header .search-box {
+div.mw-ui-overlay.search-overlay,
-    display: flex !important;
+body.search-enabled .mw-mf-page-center__mask,
-    align-items: center !important;
+html.overlay-enabled .mw-mf-page-center__mask,
-    width: 100% !important;
+.cdx-menu,
-    visibility: visible !important;
+.cdx-typeahead-search__menu,
-    opacity: 1 !important;
+.suggestions,
-    position: relative !important;
+.mw-searchSuggest {
      display: none !important;
+}
 html.overlay-enabled #mw-mf-page-center,
 html.overlay-enabled #content,
@@ Line 28,037: / Line 27,990: @@
      visibility: visible !important;
      opacity: 1 !important;
+}

Kashya at 02:05, 13 November 2026

2026-11-13T02:05:51Z

← Older revision		Revision as of 02:05, 13 November 2026
Line 27,953:		Line 27,953:
	}		}

	/* ~~==========================================================================~~		/* Mobile and Desktop Search Bar Layout */
	~~DEFINITIVE MINERVA MOBILE SEARCH BAR (REPLACES TITLE, NO OVERLAP, NO BLANK SCREEN)~~
	~~==========================================================================~~ */

	/* 1. Hide "Vanipedia" title on mobile so ~~the~~ search bar ~~takes~~ its place ~~cleanly~~ */		/* 1. Hide "Vanipedia" title on mobile so search bar sits in its place */
	body.skin-minerva .minerva-header .branding-box {		body.skin-minerva .minerva-header .branding-box {
	display: none !important;		display: none !important;
	}		}

	/* 2. Position the search form ~~cleanly right~~ next to ~~the Burger menu~~ */		/* 2. Position the replacement mobile search box (and fallback form) next to burger icon */
			body.skin-minerva .minerva-header .vani-mobile-search-box,
	body.skin-minerva .minerva-header .minerva-search-form {		body.skin-minerva .minerva-header .minerva-search-form {
	flex: 1 1 auto !important;		flex: 1 1 auto !important;
Line 27,973:		Line 27,972:
	}		}

	/* 3. Keep .search-box ~~ALWAYS~~ visible ~~(even if Minerva adds .search-enabled)~~ */		/* 3. Keep search box visible at all times */
	body.skin-minerva .minerva-header .minerva-~~search-form~~ .search-box,		body.skin-minerva .minerva-header .search-box,
	body.skin-minerva.search-enabled .minerva-header ~~.minerva-search-form~~ .search-box {		html.overlay-enabled body.skin-minerva .minerva-header .search-box,
			body.skin-minerva.search-enabled .minerva-header .search-box {
	display: flex !important;		display: flex !important;
	align-items: center !important;		align-items: center !important;
Line 27,984:		Line 27,984:
	}		}

	/* 4. Style the ~~search~~ input ~~& strip~~ the ~~dark~~ left ~~magnifier~~ icon */		/* 4. Style the mobile input and remove the left background icon */
	body.skin-minerva .minerva-header ~~.minerva-search-form~~ input.vani-clean-search-input,		body.skin-minerva .minerva-header input.vani-clean-search-input,
	body.skin-minerva .minerva-header ~~.minerva-search-form~~ .search-box input {		body.skin-minerva .minerva-header .search-box input {
	display: block !important;		display: block !important;
	width: 100% !important;		width: 100% !important;
	~~max-width: 100% !important;~~
	~~min-width: 0 !important;~~
	height: 32px !important;		height: 32px !important;
	background: #1f3e45 !important;		background: #1f3e45 !important;
	background-image: none !important; ~~/* Removes native dark left magnifier */~~		background-image: none !important;
	color: #ffffff !important;		color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;		-webkit-text-fill-color: #ffffff !important;
	border: 1.5px solid #f5d77f !important;		border: 1.5px solid #f5d77f !important;
	border-radius: 16px !important;		border-radius: 16px !important;
	padding: 2px 32px 2px 12px !important; ~~/* 12px left padding (no left icon), 32px right for 🔍 */~~		padding: 2px 32px 2px 12px !important;
	font-size: 15px !important;		font-size: 15px !important;
	line-height: 26px !important;		line-height: 26px !important;
Line 28,007:		Line 28,005:
	}		}

	/* ~~Hide any native Codex/Minerva left start~~-~~icons inside the search box~~ */		/* 5. Style the right-side magnifier button */
	~~body~~.~~skin~~-~~minerva .minerva~~-~~header .minerva~~-~~search~~-~~form .cdx-text-input__start-icon,~~		.vani-inline-go {
	~~body.skin-minerva .minerva-header .minerva-search-form .cdx-text-input__icon,~~		position: absolute !important;
	~~body.skin~~-~~minerva .minerva-header .minerva-search-form .minerva-icon {~~		right: 8px !important;
	~~display~~: ~~none~~ !important;		top: 50% !important;
			transform: translateY(-50%) !important;
			background: none !important;
			border: none !important;
			font-size: 15px !important;
			cursor: pointer !important;
			padding: 0 !important;
			line-height: 1 !important;
			z-index: 20 !important;
	}		}

	/* 5. Hide ~~the dummy #searchIcon trigger button~~ */		/* 6. Hide native Minerva search icons */
			body.skin-minerva .minerva-header .cdx-text-input__start-icon,
			body.skin-minerva .minerva-header .cdx-text-input__icon,
			body.skin-minerva .minerva-header .minerva-search-form .minerva-icon,
	body.skin-minerva .minerva-header #searchIcon,		body.skin-minerva .minerva-header #searchIcon,
	body.skin-minerva .minerva-header .skin-minerva-search-trigger {		body.skin-minerva .minerva-header .skin-minerva-search-trigger {
Line 28,020:		Line 28,029:
	}		}

	/* 6. Prevent ~~Minerva's~~ overlay-enabled ~~class~~ from hiding ~~the~~ page content! */		/* 7. Prevent html.overlay-enabled from hiding page content if triggered before JS loads */
	~~body~~.~~skin-minerva.search~~-enabled #mw-mf-page-center,		html.overlay-enabled #mw-mf-page-center,
	~~body~~.~~skin~~-~~minerva~~.~~overlay~~-enabled #mw-mf-page-center,		html.overlay-enabled #content,
	body.~~skin-minerva.search~~-enabled #~~content,~~		body.search-enabled #mw-mf-page-center,
	~~body.skin~~-~~minerva.overlay~~-~~enabled #content~~ {		body.overlay-enabled #mw-mf-page-center {
	display: block !important;		display: block !important;
	visibility: visible !important;		visibility: visible !important;
Line 28,030:		Line 28,039:
	}		}

	/* 7. Hide native autocomplete ~~dropdowns and Minerva's blank search overlay~~ */		/* 8. Hide native search overlays and autocomplete menus */
	.search-overlay,		.search-overlay,
	.minerva-search-overlay,		.minerva-search-overlay,

Kashya at 01:57, 13 November 2026

2026-11-13T01:57:44Z

← Older revision		Revision as of 01:57, 13 November 2026
Line 27,952:		Line 27,952:
	pointer-events: none !important;		pointer-events: none !important;
	}		}

	/* ==========================================================================		/* ==========================================================================
	~~UNIFIED RESPONSIVE~~ SEARCH BAR (~~DESKTOP & MOBILE VECTOR 2022~~)		DEFINITIVE MINERVA MOBILE SEARCH BAR (REPLACES TITLE, NO OVERLAP, NO BLANK SCREEN)
	========================================================================== */		========================================================================== */

	/* ~~Permanently suppress Minerva's broken blank #/~~search ~~overlay~~ */		/* 1. Hide "Vanipedia" title on mobile so the search bar takes its place cleanly */
	.~~search~~-~~overlay,~~		body.skin-minerva .minerva-header .branding-box {
	.minerva-~~search-overlay,~~
	~~div.mw-ui-overlay~~.~~search~~-~~overlay~~ {
	display: none !important;		display: none !important;
	~~visibility: hidden !important;~~
	~~pointer-events: none !important;~~
	}		}

	/* ~~Hide native MediaWiki autocomplete suggestions on desktop */~~		/* 2. Position the search form cleanly right next to the Burger menu */
	.~~cdx-menu,~~
	~~.cdx-typeahead-search__menu,~~
	~~.suggestions,~~
	~~.mw-searchSuggest {~~
	~~display: none !important;~~
	}
	~~/* ==========================================================================~~
	~~FIX MINERVA MOBILE SEARCH: SHOW INLINE SEARCH BOX, HIDE BROKEN #searchIcon~~
	~~========================================================================== */~~
	~~/* 1. Allow~~ the search form in the ~~Minerva header to expand instead of being 32px~~ */
	body.skin-minerva .minerva-header .minerva-search-form {		body.skin-minerva .minerva-header .minerva-search-form {
	flex: 1 1 auto !important;		flex: 1 1 auto !important;
	width: auto !important;		width: auto !important;
	max-width: ~~170px~~ !important;		max-width: calc(100vw - 145px) !important;
	margin~~-left~~: auto ~~!important;~~		margin: 0 auto 0 10px !important;
	~~margin-right: 6px~~ !important;
	display: flex !important;		display: flex !important;
	align-items: center !important;		align-items: center !important;
			position: relative !important;
	}		}

	/* 2. ~~Show the actual~~ search ~~input~~ box ~~inside the header~~ (~~overrides line 1872 display:none~~) */		/* 3. Keep .search-box ALWAYS visible (even if Minerva adds .search-enabled) */
	body.skin-minerva .minerva-header .minerva-search-form .search-box {		body.skin-minerva .minerva-header .minerva-search-form .search-box,
			body.skin-minerva.search-enabled .minerva-header .minerva-search-form .search-box {
	display: flex !important;		display: flex !important;
	align-items: center !important;		align-items: center !important;
	width: 100% !important;		width: 100% !important;
			visibility: visible !important;
			opacity: 1 !important;
	position: relative !important;		position: relative !important;
	}		}

	/* 3. Style the input ~~field inside~~ .search-~~box so text is visible */~~		/* 4. Style the search input & strip the dark left magnifier icon */
			body.skin-minerva .minerva-header .minerva-search-form input.vani-clean-search-input,
	body.skin-minerva .minerva-header .minerva-search-form .search-box input {		body.skin-minerva .minerva-header .minerva-search-form .search-box input {
	display: block !important;		display: block !important;
	width: 100% !important;		width: 100% !important;
	height: ~~30px~~ !important;		max-width: 100% !important;
	background~~-color~~: #1f3e45 !important;		min-width: 0 !important;
			height: 32px !important;
			background: #1f3e45 !important;
			background-image: none !important; /* Removes native dark left magnifier */
	color: #ffffff !important;		color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;		-webkit-text-fill-color: #ffffff !important;
	border: 1.5px solid #f5d77f !important;		border: 1.5px solid #f5d77f !important;
	border-radius: 16px !important;		border-radius: 16px !important;
	padding: 2px ~~28px~~ 2px ~~10px~~ !important;		padding: 2px 32px 2px 12px !important; /* 12px left padding (no left icon), 32px right for 🔍 */
	font-size: ~~14px~~ !important;		font-size: 15px !important;
			line-height: 26px !important;
	outline: none !important;		outline: none !important;
	opacity: 1 !important;		opacity: 1 !important;
Line 28,012:		Line 28,007:
	}		}

	/* 4. Hide the dummy #searchIcon button ~~so it never triggers #/search~~ */		/* Hide any native Codex/Minerva left start-icons inside the search box */
			body.skin-minerva .minerva-header .minerva-search-form .cdx-text-input__start-icon,
			body.skin-minerva .minerva-header .minerva-search-form .cdx-text-input__icon,
			body.skin-minerva .minerva-header .minerva-search-form .minerva-icon {
			display: none !important;
			}

			/* 5. Hide the dummy #searchIcon trigger button */
	body.skin-minerva .minerva-header #searchIcon,		body.skin-minerva .minerva-header #searchIcon,
	body.skin-minerva .minerva-header .skin-minerva-search-trigger {		body.skin-minerva .minerva-header .skin-minerva-search-trigger {
Line 28,018:		Line 28,020:
	}		}

	/* 5. Hide native ~~suggestions~~ */		/* 6. Prevent Minerva's overlay-enabled class from hiding the page content! */
	.cdx-menu, .cdx-typeahead-search__menu, .suggestions, .mw-searchSuggest {		body.skin-minerva.search-enabled #mw-mf-page-center,
			body.skin-minerva.overlay-enabled #mw-mf-page-center,
			body.skin-minerva.search-enabled #content,
			body.skin-minerva.overlay-enabled #content {
			display: block !important;
			visibility: visible !important;
			opacity: 1 !important;
			}

			/* 7. Hide native autocomplete dropdowns and Minerva's blank search overlay */
			.search-overlay,
			.minerva-search-overlay,
			div.mw-ui-overlay.search-overlay,
			.cdx-menu,
			.cdx-typeahead-search__menu,
			.suggestions,
			.mw-searchSuggest {
	display: none !important;		display: none !important;
	}		}

Kashya at 01:48, 13 November 2026

2026-11-13T01:48:47Z

@@ Line 27,970: / Line 27,970: @@
 .suggestions,
 .mw-searchSuggest {
      display: none !important;
+}

Kashya at 01:42, 13 November 2026

2026-11-13T01:42:56Z

@@ Line 27,956: / Line 27,956: @@
     ========================================================================== */
-/* 1. Kill native MediaWiki / Vue autocomplete dropdowns everywhere */
+/* Permanently suppress Minerva's broken blank #/search overlay */
 .cdx-menu,
 .cdx-typeahead-search__menu,
 .suggestions,
 .mw-searchSuggest {
      display: none !important;
+}

Kashya at 01:31, 13 November 2026

2026-11-13T01:31:51Z

Show changes

Kashya at 01:05, 13 November 2026

2026-11-13T01:05:50Z

@@ Line 28,041: / Line 28,041: @@
 /* 4. Ensure the custom magnifying glass icon aligns perfectly */
 .overlay.search-overlay .vani-mobile-search-btn {
      z-index: 2147483647 !important;