MediaWiki:Vector-2022.css - Revision history

Maintenance script: Header grid: pin items to row 1

2026-10-15T16:49:26Z

Header grid: pin items to row 1

← Older revision		Revision as of 11:49, 15 October 2026
Line 38:		Line 38:
	}		}

			/* grid-row is needed too: Vector's "grid-area: headerStart" (>= 1680px) would otherwise push the logo to a new row */
	.vector-header.mw-header .vector-header-start {		.vector-header.mw-header .vector-header-start {
			grid-row: 1;
	grid-column: 1;		grid-column: 1;
	}		}

	.vector-header.mw-header .vector-search-box {		.vector-header.mw-header .vector-search-box {
			grid-row: 1;
	grid-column: 2;		grid-column: 2;
	}		}

	.vector-header.mw-header .vector-user-links {		.vector-header.mw-header .vector-user-links {
			grid-row: 1;
	grid-column: 3;		grid-column: 3;
	justify-self: end;		justify-self: end;

Maintenance script: Centre search bar via header grid

2026-10-15T16:49:02Z

Centre search bar via header grid

← Older revision		Revision as of 11:49, 15 October 2026
Line 21:		Line 21:
	/*		/*
	* Centre the search bar in the header. The search box is only expanded at desktop widths		* Centre the search bar in the header. The search box is only expanded at desktop widths
	* (below ~~that~~ Vector collapses it to an icon). ~~Unwrapping~~ ~~.vector-~~header~~-end~~ ~~leaves~~ ~~three~~ ~~flex~~		* (below 1120px Vector collapses it to an icon). The header becomes a 3-column grid,
	* ~~items:~~ logo \| search \| user links. ~~Giving~~ ~~the~~ outer ~~two~~ ~~equal~~ ~~flex-basis puts~~ search in the middle.		* logo \| search \| user links, with equal outer columns so the search sits in the middle.
			* Vector uses flexbox at 1120-1679px and its own 2-column grid from 1680px. The
			* ".vector-header.mw-header" selectors are deliberately more specific so they win in both ranges.
	*/		*/
	@media screen and ( min-width: 1120px ) {		@media screen and ( min-width: 1120px ) {
	.vector-header-~~end~~ {		.vector-header.mw-header {
			display: grid;
			grid-template-areas: none;
			grid-template-columns: minmax( 0, 1fr ) minmax( 0, 40rem ) minmax( 0, 1fr );
			column-gap: 16px;
			}

		⚫	.vector-header.mw-header .vector-header-end {
	display: contents;		display: contents;
	}		}

	.vector-header-start,		.vector-header.mw-header .vector-header-start {
			grid-column: 1;
⚫	.vector-header .vector-~~user~~-~~links~~ {
	flex: 1 1 0;
	min-width: 0;
	}		}

	.vector-header .vector-~~user~~-~~links~~ {		.vector-header.mw-header .vector-search-box {
	~~display~~: ~~flex~~;		grid-column: 2;
⚫	justify-~~content~~: ~~flex-~~end;
	}		}

	.vector-header .vector-~~search~~-~~box~~ {		.vector-header.mw-header .vector-user-links {
			grid-column: 3;
	flex: 0 1 40rem;
		⚫	justify-self: end;
	}		}

	.vector-header .vector-search-box .vector-typeahead-search-container {		.vector-header.mw-header .vector-search-box .vector-typeahead-search-container {
	max-width: none;		max-width: none;
	margin-right: 0;		margin-right: 0;
			}

			/* Vector shifts the search box left by its focus-expansion width at >= 1680px; not wanted when centred */
			.client-js .vector-header.mw-header .vector-search-box.vector-search-box-auto-expand-width {
			margin-left: 0;
	}		}
	}		}

Maintenance script: Theme-aware styling and dark mode for MediaWiki 1.47 (site-pages/MediaWiki_Vector-2022.css.wiki)

2026-10-15T16:47:09Z

Theme-aware styling and dark mode for MediaWiki 1.47 (site-pages/MediaWiki_Vector-2022.css.wiki)

@@ Line 1: / Line 1: @@
+}
 .mw-body-content h2 {
 	font-size: 1.65em;
+}
+}
-#mw-sidebar-checkbox:not(:checked) ~ .vector-sidebar-container-no-toc ~ .mw-content-container {
+	.vector-header .vector-search-box .vector-typeahead-search-container {
-	max-width: 98%;
+		max-width: none;
+}
+}
+}
+}

Eelt at 03:04, 30 January 2023

2023-01-30T03:04:50Z

← Older revision		Revision as of 22:04, 29 January 2023
Line 30:		Line 30:
	.vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-content-container, .vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-table-of-contents-container {		.vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-content-container, .vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-table-of-contents-container {
	max-width: 98%;		max-width: 98%;
			}

			.mw-logo-wordmark {
			font-size: larger;
	}		}

Eelt at 03:02, 30 January 2023

2023-01-30T03:02:20Z

← Older revision		Revision as of 22:02, 29 January 2023
Line 1:		Line 1:
	h1#firstHeading.firstHeading {		h1#firstHeading.firstHeading {
	font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif';		font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif';
			}

			.vector-sticky-header-context-bar-primary {
			font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif';
	}		}

Eelt at 02:47, 30 January 2023

2023-01-30T02:47:59Z

← Older revision		Revision as of 21:47, 29 January 2023
Line 21:		Line 21:

	.mw-content-container {		.mw-content-container {
			max-width: 98%;
			}

			.vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-content-container, .vector-toc-collapsed #mw-sidebar-checkbox:not(:checked) ~ .mw-table-of-contents-container {
	max-width: 98%;		max-width: 98%;
	}		}

Eelt at 21:06, 29 January 2023

2023-01-29T21:06:05Z

← Older revision		Revision as of 16:06, 29 January 2023
Line 18:		Line 18:
	#mw-sidebar-checkbox:not(:checked) ~ .vector-sidebar-container-no-toc ~ .mw-content-container {		#mw-sidebar-checkbox:not(:checked) ~ .vector-sidebar-container-no-toc ~ .mw-content-container {
	max-width: 98%;		max-width: 98%;
			}

			.mw-content-container {
			max-width: 98%;
	}		}

Eelt at 20:43, 29 January 2023

2023-01-29T20:43:39Z

← Older revision		Revision as of 15:43, 29 January 2023
Line 14:		Line 14:
	p {		p {
	font-size: 1.15em;		font-size: 1.15em;
			}

			#mw-sidebar-checkbox:not(:checked) ~ .vector-sidebar-container-no-toc ~ .mw-content-container {
			max-width: 98%;
	}		}

Eelt: Created page with "h1#firstHeading.firstHeading { font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif'; } .mw-body-content h2 { font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif'; font-size: 1.65em; } html, body { font-family: 'Zen Kaku Gothic New', sans-serif; } p { font-size: 1.15em; }"

2023-01-29T20:39:01Z

Created page with "h1#firstHeading.firstHeading { font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif'; } .mw-body-content h2 { font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif'; font-size: 1.65em; } html, body { font-family: 'Zen Kaku Gothic New', sans-serif; } p { font-size: 1.15em; }"

New page

h1#firstHeading.firstHeading {
font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif';
}

.mw-body-content h2 {
font-family: 'EB Garamond', 'P052', 'Liberation Serif', 'Palatino', 'Palatino Linotype', 'serif';
font-size: 1.65em;
}

html, body {
font-family: 'Zen Kaku Gothic New', sans-serif;
}

p {
font-size: 1.15em;
}