MediaWiki:Common.css - Revision history

JMyles at 17:05, 15 September 2026

2026-09-15T17:05:10Z

@@ Line 650: / Line 650: @@
 @media screen and (max-width: 600px) {
    .pp-record-box { float: none; width: 100%; margin: 0 0 1em 0; }
+}

Magent: Listening list art cell + Record infobox styles (first use of the interface-admin grant) (via update-page on MediaWiki MCP Server)

2026-09-02T22:09:44Z

Listening list art cell + Record infobox styles (first use of the interface-admin grant) (via update-page on MediaWiki MCP Server)

@@ Line 589: / Line 589: @@
    .pp-ll-row  { flex-wrap: wrap; }
    .pp-ll-side { flex-basis: 100%; text-align: left; padding-top: 0.25em; }
+}

JMyles at 21:53, 31 August 2026

2026-08-31T21:53:49Z

@@ Line 485: / Line 485: @@
+   }
    .pickipedia-variant-masthead .mw-parser-output > * { grid-column: 1; }
+}

JMyles: Reverted edit by Magent (talk) to last revision by JMyles

2026-04-29T04:21:47Z

Reverted edit by Magent (talk) to last revision by JMyles

@@ Line 291: / Line 291: @@
    width: 100% !important;
    max-width: 100% !important;
+}

Magent: Cap video height (max-height:70vh, width:auto) so portrait videos don't dominate the page (via update-page on MediaWiki MCP Server)

2026-04-29T04:18:47Z

Cap video height (max-height:70vh, width:auto) so portrait videos don't dominate the page (via update-page on MediaWiki MCP Server)

@@ Line 291: / Line 291: @@
    width: 100% !important;
    max-width: 100% !important;
+}

JMyles at 04:12, 29 April 2026

2026-04-29T04:12:53Z

← Older revision		Revision as of 04:12, 29 April 2026
Line 433:		Line 433:
	/* ---------- Light/dark toggle ---------- */		/* ---------- Light/dark toggle ---------- */
	.pickipedia-mode {		.pickipedia-mode {
	position: ~~fixed~~;		position: absolute;
	bottom: ~~19px~~;		bottom: 5px;
	right: ~~24px~~;		right: 10px;
	background: var(--pp-card);		background: var(--pp-card);
	color: var(--pp-ink);		color: var(--pp-ink);

JMyles at 04:11, 29 April 2026

2026-04-29T04:11:36Z

← Older revision		Revision as of 04:11, 29 April 2026
Line 206:		Line 206:
	font-family: var(--pp-serif);		font-family: var(--pp-serif);
	color: var(--pp-ink);		color: var(--pp-ink);
	~~margin-top: 28px;~~
	}		}

Line 338:		Line 337:
	font-size: 19px;		font-size: 19px;
	line-height: 1.65;		line-height: 1.65;
	~~padding-bottom: 80px;~~
	}		}
	.pickipedia-variant-letter .mw-parser-output > h2 { font-size: 28px; line-height: 1.2; }		.pickipedia-variant-letter .mw-parser-output > h2 { font-size: 28px; line-height: 1.2; }

JMyles at 04:09, 29 April 2026

2026-04-29T04:09:37Z

← Older revision		Revision as of 04:09, 29 April 2026
Line 280:		Line 280:
	.pickipedia-userpost .mw-parser-output embed,		.pickipedia-userpost .mw-parser-output embed,
	.pickipedia-userpost .mw-parser-output .hls-video-player {		.pickipedia-userpost .mw-parser-output .hls-video-player {
	~~margin: 28px 0;~~
	max-width: 100%;		max-width: 100%;
	}		}
Line 437:		Line 436:
	.pickipedia-mode {		.pickipedia-mode {
	position: fixed;		position: fixed;
	bottom: ~~24px~~;		bottom: 19px;
	right: 24px;		right: 24px;
	background: var(--pp-card);		background: var(--pp-card);
Line 470:		Line 469:
	.pickipedia-variant-letter .pickipedia-hero .pp-title { font-size: 32px; }		.pickipedia-variant-letter .pickipedia-hero .pp-title { font-size: 32px; }
	.pickipedia-variant-letter .pickipedia-hero .pp-dek { font-size: 17px; }		.pickipedia-variant-letter .pickipedia-hero .pp-dek { font-size: 17px; }
	~~.pickipedia-userpost .mw-parser-output { margin-top: 18px; }~~
	.pickipedia-variant-letter .mw-parser-output { font-size: 17px; }		.pickipedia-variant-letter .mw-parser-output { font-size: 17px; }
	.pickipedia-variant-letter .mw-parser-output > p:first-of-type::first-letter { font-size: 56px; }		.pickipedia-variant-letter .mw-parser-output > p:first-of-type::first-letter { font-size: 56px; }

Magent: Logo flush to top:0 left:0; add space between title and kicker (which now follows title) (via update-page on MediaWiki MCP Server)

2026-04-29T04:03:00Z

Logo flush to top:0 left:0; add space between title and kicker (which now follows title) (via update-page on MediaWiki MCP Server)

← Older revision		Revision as of 04:03, 29 April 2026
Line 101:		Line 101:
	}		}

	/* ---------- Corner logo: ~~absolute-positioned~~ upper-left, fluid-sized		/* ---------- Corner logo: flush to upper-left, fluid sized. ---------- */
	~~so it shrinks proportionally at narrower viewports and never crowds~~
	~~the content~~. ---------- */
	.pp-corner-logo {		.pp-corner-logo {
	position: absolute;		position: absolute;
	top: ~~16px~~;		top: 0;
	left: ~~16px~~;		left: 0;
	width: clamp(60px, 9vw, 130px);		width: clamp(60px, 9vw, 130px);
	z-index: 5;		z-index: 5;
Line 169:		Line 167:
	}		}
	.pickipedia-hero .pp-kicker a:hover { color: var(--pp-ink); }		.pickipedia-hero .pp-kicker a:hover { color: var(--pp-ink); }

			/* When the kicker follows the title (letter variant), give it a small
			gap so it reads as a byline. */
			.pickipedia-hero h1.pp-title + .pp-kicker {
			margin-top: 12px;
			}

	.pickipedia-hero h1.pp-title {		.pickipedia-hero h1.pp-title {
Line 193:		Line 197:
	text-transform: uppercase;		text-transform: uppercase;
	color: var(--pp-muted);		color: var(--pp-muted);
	margin: 0;		margin: 12px 0 0;
	padding: 0;		padding: 0;
	border: none;		border: none;
Line 341:		Line 345:
	.pickipedia-variant-letter .mw-parser-output blockquote { font-size: 22px; line-height: 1.45; }		.pickipedia-variant-letter .mw-parser-output blockquote { font-size: 22px; line-height: 1.45; }

	/* On medium-narrow viewports~~, the logo and~~ the centered ~~reading~~ column		/* On medium-narrow viewports the centered column would slide under
	~~start to overlap (~~logo ~~extends to ~16px+130px=~146px from the left,~~		the corner logo — push it right enough to clear. */
	~~while the centered column's left edge moves further left as the~~
	~~viewport narrows). Push the hero/content~~ right enough to clear ~~the~~
	~~logo~~. */
	@media (min-width: 720px) and (max-width: 1100px) {		@media (min-width: 720px) and (max-width: 1100px) {
	.pickipedia-variant-letter .pickipedia-hero,		.pickipedia-variant-letter .pickipedia-hero,
Line 460:		Line 461:
	.pickipedia-topbar { padding: 10px 16px; }		.pickipedia-topbar { padding: 10px 16px; }
	.pickipedia-topbar-nav { gap: 12px; font-size: 10px; }		.pickipedia-topbar-nav { gap: 12px; font-size: 10px; }

	~~/* Logo top-left, smaller, with hero padded to clear it. */~~
	~~.pp-corner-logo { top: 10px; left: 10px; }~~

	.pickipedia-variant-letter .pickipedia-hero,		.pickipedia-variant-letter .pickipedia-hero,

Magent: Logo: smaller and fluid-sized via clamp; add hero/content left padding so they clear the logo (via update-page on MediaWiki MCP Server)

2026-04-29T03:54:25Z

Logo: smaller and fluid-sized via clamp; add hero/content left padding so they clear the logo (via update-page on MediaWiki MCP Server)

← Older revision		Revision as of 03:54, 29 April 2026
Line 43:		Line 43:
	background: var(--pp-paper) !important;		background: var(--pp-paper) !important;
	color: var(--pp-ink);		color: var(--pp-ink);
	position: relative; ~~/* anchor for the absolute corner logo */~~		position: relative;
	}		}

Line 101:		Line 101:
	}		}

	/* ---------- Corner logo: absolute-positioned upper-left ~~of the body~~		/* ---------- Corner logo: absolute-positioned upper-left, fluid-sized
	so it ~~doesn't take any space in the document flow — content flows~~		so it shrinks proportionally at narrower viewports and never crowds
	~~underneath it. The topbar / hero get padding to keep their~~ content		the content. ---------- */
	~~from sliding under it~~. ---------- */
	.pp-corner-logo {		.pp-corner-logo {
	position: absolute;		position: absolute;
	top: 16px;		top: 16px;
	left: 16px;		left: 16px;
	width: ~~180px~~;		width: clamp(60px, 9vw, 130px);
	z-index: 5;		z-index: 5;
	display: block;		display: block;
Line 341:		Line 340:
	.pickipedia-variant-letter .mw-parser-output > h3 { font-size: 22px; line-height: 1.25; }		.pickipedia-variant-letter .mw-parser-output > h3 { font-size: 22px; line-height: 1.25; }
	.pickipedia-variant-letter .mw-parser-output blockquote { font-size: 22px; line-height: 1.45; }		.pickipedia-variant-letter .mw-parser-output blockquote { font-size: 22px; line-height: 1.45; }

			/* On medium-narrow viewports, the logo and the centered reading column
			start to overlap (logo extends to ~16px+130px=~146px from the left,
			while the centered column's left edge moves further left as the
			viewport narrows). Push the hero/content right enough to clear the
			logo. */
			@media (min-width: 720px) and (max-width: 1100px) {
			.pickipedia-variant-letter .pickipedia-hero,
			.pickipedia-variant-letter .mw-parser-output {
			margin-left: 160px;
			margin-right: 24px;
			}
			}

	/* ---------- Variant: Masthead ---------- */		/* ---------- Variant: Masthead ---------- */
Line 444:		Line 456:
	}		}

	/* ---------- Responsive ---------- */		/* ---------- Responsive (small screens) ---------- */
	@media (max-width: ~~880px~~) {		@media (max-width: 720px) {
	.pickipedia-topbar { padding: 10px 16px; }		.pickipedia-topbar { padding: 10px 16px; }
	.pickipedia-topbar-nav { gap: 12px; font-size: 10px; }		.pickipedia-topbar-nav { gap: 12px; font-size: 10px; }

	.pp-corner-logo { ~~width~~: ~~90px~~; ~~top~~: 10px; left: ~~10px~~; }		/* Logo top-left, smaller, with hero padded to clear it. */
			.pp-corner-logo { top: 10px; left: 10px; }

			.pickipedia-variant-letter .pickipedia-hero,
			.pickipedia-variant-letter .mw-parser-output {
			padding-left: max(24px, calc(9vw + 24px));
			}

	.pickipedia-variant-letter .pickipedia-hero { padding-top: 10px; }		.pickipedia-variant-letter .pickipedia-hero { padding-top: 10px; }