MediaWiki:Common.css - Revision history

Maintenance script: Make .cdx-button transparent (fixes Tools dropdown dark fill)

2026-07-13T20:54:21Z

Make .cdx-button transparent (fixes Tools dropdown dark fill)

← Older revision		Revision as of 22:54, 13 July 2026
Line 35:		Line 35:
	.vector-menu-content-list,		.vector-menu-content-list,
	#toc, .vector-toc, .vector-toc-contents, .vector-toc-list,		#toc, .vector-toc, .vector-toc-contents, .vector-toc-list,
	.sidebar-toc~~, .cdx-button~~, .cdx-text-input__input {		.sidebar-toc, .cdx-text-input__input {
	background-color: var(--maroon-dark) !important;		background-color: var(--maroon-dark) !important;
			color: var(--mint) !important;
			border-color: var(--mint) !important;
			box-shadow: none !important;
			}

			/* Buttons (sidebar "hide", Tools dropdown label, watch star, etc.) —
			outline-only, no fill, so they don't show a dark chip against the page. */
			.cdx-button {
			background-color: transparent !important;
	color: var(--mint) !important;		color: var(--mint) !important;
	border-color: var(--mint) !important;		border-color: var(--mint) !important;

Maintenance script: Remove background from Tools dropdown popover

2026-07-13T20:51:03Z

Remove background from Tools dropdown popover

← Older revision		Revision as of 22:51, 13 July 2026
Line 129:		Line 129:
	.vector-column-end .mw-portlet {		.vector-column-end .mw-portlet {
	background-color: transparent !important;		background-color: transparent !important;
			}

			/* Dropdown popovers (the "Tools" tab dropdown, language-variant dropdown,
			user-menu dropdown, etc.) — separate floating panel, not covered above. */
			.vector-dropdown-content {
			background-color: transparent !important;
			box-shadow: none !important;
			border-color: var(--mint) !important;
	}		}

Maintenance script: Fix tab background: correct portlet id + selected-tab state

2026-07-13T20:44:52Z

Fix tab background: correct portlet id + selected-tab state

← Older revision		Revision as of 22:44, 13 July 2026
Line 111:		Line 111:
	#left-navigation, #right-navigation,		#left-navigation, #right-navigation,
	#left-navigation .vector-menu-content, #right-navigation .vector-menu-content,		#left-navigation .vector-menu-content, #right-navigation .vector-menu-content,
	#p-~~namespaces~~, #p-views, #p-cactions {		#p-associated-pages, #p-views, #p-cactions,
			#left-navigation .vector-menu-content-list,
			#right-navigation .vector-menu-content-list,
			#left-navigation li, #right-navigation li,
			#left-navigation li.selected, #right-navigation li.selected,
			#left-navigation a, #right-navigation a {
	background-color: transparent !important;		background-color: transparent !important;
			background: transparent !important;
	}		}

Maintenance script: Remove dark band from right sidebar (Tools/General/Appearance)

2026-07-13T20:43:52Z

Remove dark band from right sidebar (Tools/General/Appearance)

@@ Line 112: / Line 112: @@
 #left-navigation .vector-menu-content, #right-navigation .vector-menu-content,
 #p-namespaces, #p-views, #p-cactions {
 	background-color: transparent !important;
+}

Maintenance script: Remove dark band from tab bars and footer

2026-07-13T20:42:56Z

Remove dark band from tab bars and footer

← Older revision		Revision as of 22:42, 13 July 2026
Line 105:		Line 105:
	}		}
	.vector-menu-content a, #mw-panel a { color: var(--mint) !important; font-weight: 500 !important; }		.vector-menu-content a, #mw-panel a { color: var(--mint) !important; font-weight: 500 !important; }

			/* Page tab bars (Main Page/Discussion, Read/Edit/Edit source/View history) —
			these are also .vector-menu-content internally, so un-set the dark band
			the rule above gives them; blend into the page background instead. */
			#left-navigation, #right-navigation,
			#left-navigation .vector-menu-content, #right-navigation .vector-menu-content,
			#p-namespaces, #p-views, #p-cactions {
			background-color: transparent !important;
			}

	/* Tables — Cargo output, wikitables */		/* Tables — Cargo output, wikitables */
Line 129:		Line 138:
	table[style*="float:right"] { border: 2px solid var(--mint) !important; }		table[style*="float:right"] { border: 2px solid var(--mint) !important; }

	/* Category strip~~, footer~~ */		/* Category strip */
	#catlinks~~, #footer, .mw-footer~~ {		#catlinks {
	background-color: var(--maroon-dark) !important;		background-color: var(--maroon-dark) !important;
			color: var(--mint) !important;
			border-color: var(--mint) !important;
			}

			/* Footer — blend into the page background, no dark band */
			#footer, .mw-footer {
			background-color: transparent !important;
	color: var(--mint) !important;		color: var(--mint) !important;
	border-color: var(--mint) !important;		border-color: var(--mint) !important;
	}		}

Maintenance script: Fix invisible table header text (CSS specificity bug)

2026-07-13T19:40:04Z

Fix invisible table header text (CSS specificity bug)

← Older revision		Revision as of 21:40, 13 July 2026
Line 112:		Line 112:
	color: var(--mint) !important;		color: var(--mint) !important;
	}		}
	table.wikitable th, table.cargoTable th {		/* NOTE: prefixed with #content so specificity beats the generic
			"#content th { color: mint }" rule above — otherwise header labels
			render as mint-on-mint (invisible), since ID beats class regardless
			of !important or source order when specificity differs. */
			#content table.wikitable th, #content table.cargoTable th,
			#content table[style*="float:right"] th {
	font-family: 'Anton', 'Arial Narrow', sans-serif !important;		font-family: 'Anton', 'Arial Narrow', sans-serif !important;
	background-color: var(--mint) !important;		background-color: var(--mint) !important;
Line 123:		Line 128:
	/* Infoboxes from Group/Artist/Album/Place/Label templates */		/* Infoboxes from Group/Artist/Album/Place/Label templates */
	table[style*="float:right"] { border: 2px solid var(--mint) !important; }		table[style*="float:right"] { border: 2px solid var(--mint) !important; }
	~~table[style*="float:right"] th { font-family: 'Anton', 'Arial Narrow', sans-serif !important; }~~

	/* Category strip, footer */		/* Category strip, footer */

Maintenance script: Fix white boxes: override Codex design tokens

2026-07-13T19:37:39Z

Fix white boxes: override Codex design tokens

@@ Line 8: / Line 8: @@
 	--mint:        #45b87d;
 	--mint-soft:   #8fcfa8;
+}
 body,

Maintenance script: Site theme: frameinframe.nyc-inspired maroon/mint

2026-07-13T19:35:53Z

Site theme: frameinframe.nyc-inspired maroon/mint

New page

/* ===== Rumba Congolaise wiki — theme after frameinframe.nyc ===== */
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Roboto+Condensed:wght@400;500;700&display=swap');

:root {
--maroon: #4a0e11;
--maroon-dark: #2b0a0d;
--ivory: #f3ece0;
--mint: #45b87d;
--mint-soft: #8fcfa8;
}

body,
.mw-page-container,
.mw-body,
#content,
.vector-body,
.mw-body-content {
background-color: var(--maroon) !important;
color: var(--mint) !important;
font-family: 'Roboto Condensed', 'Segoe UI', Arial, sans-serif !important;
font-weight: 400;
}

#content p,
#content li,
#content dd,
#content dt,
#content td,
#content th,
.mw-body-content p,
.mw-body-content li {
color: var(--mint) !important;
font-family: 'Roboto Condensed', 'Segoe UI', Arial, sans-serif !important;
font-weight: 400;
}

/* Headings — bold condensed display face, like the wordmark */
h1, h2, h3, h4, h5, h6,
.firstHeading,
#firstHeading {
font-family: 'Anton', 'Arial Narrow', sans-serif !important;
color: var(--ivory) !important;
font-weight: 400 !important;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.firstHeading, #firstHeading { border-bottom: 3px solid var(--mint); padding-bottom: 0.2em; }

/* Site title / logo area, echoing the wordmark treatment */
.mw-logo-wordmark, #p-logo-text, .mw-logo-container {
font-family: 'Anton', 'Arial Narrow', sans-serif !important;
color: var(--ivory) !important;
text-transform: uppercase;
}

/* Links */
a, a:visited { color: var(--mint) !important; font-weight: 700 !important; }
a:hover, a:focus { color: var(--mint-soft) !important; text-decoration: underline; }
a.new, a.new:visited { color: #c98a4a !important; }

/* Nav / sidebar / header bars — the darker maroon band, like the top nav */
#mw-panel, .vector-menu-content, .mw-portlet,
.mw-header, .vector-header, #p-logo,
.vector-pinnable-header {
background-color: var(--maroon-dark) !important;
}
.vector-menu-heading, .mw-portlet-body h3 {
font-family: 'Anton', 'Arial Narrow', sans-serif !important;
color: var(--ivory) !important;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.vector-menu-content a, #mw-panel a { color: var(--mint) !important; font-weight: 500 !important; }

/* Tables — Cargo output, wikitables */
table.wikitable, table.cargoTable, table.cargoDynamicTableFormat {
background-color: var(--maroon-dark) !important;
border: 2px solid var(--mint) !important;
color: var(--mint) !important;
}
table.wikitable th, table.cargoTable th {
font-family: 'Anton', 'Arial Narrow', sans-serif !important;
background-color: var(--mint) !important;
color: var(--maroon-dark) !important;
text-transform: uppercase;
letter-spacing: 0.02em;
}
table.wikitable td, table.cargoTable td { border-color: var(--mint) !important; }

/* Infoboxes from Group/Artist/Album/Place/Label templates */
table[style*="float:right"] { border: 2px solid var(--mint) !important; }
table[style*="float:right"] th { font-family: 'Anton', 'Arial Narrow', sans-serif !important; }

/* Category strip, footer */
#catlinks, #footer, .mw-footer {
background-color: var(--maroon-dark) !important;
color: var(--mint) !important;
border-color: var(--mint) !important;
}