MediaWiki:Common.css
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*
* United Vinland Wiki — Custom Theme
* Colonial/Federal period aesthetic: navy blue, antique gold, parchment
*/
/* === Color Variables === */
:root {
--uv-navy: #0a1f3f;
--uv-navy-light: #132d54;
--uv-gold: #c5a44e;
--uv-gold-light: #d4b96a;
--uv-parchment: #f5f0e6;
--uv-parchment-dark: #e8e0d0;
--uv-brown: #2c1810;
--uv-brown-light: #5c3a2e;
--uv-cream: #faf7f0;
}
/* === Page Background === */
body {
background-color: var(--uv-parchment-dark);
}
/* === Content Area & All Inner Containers === */
.mw-body,
.mw-page-container,
.mw-page-container-inner,
.mw-content-container,
.vector-body,
.vector-column-start,
.vector-column-end,
.vector-body-before-content,
.vector-sitenotice-container,
#content,
#bodyContent,
#mw-content-text,
.mw-parser-output,
.mw-body-content {
background-color: var(--uv-parchment);
color: var(--uv-brown);
}
.mw-body {
border: 1px solid var(--uv-gold);
}
/* === Sidebar column background === */
.vector-column-start {
background-color: var(--uv-navy);
}
/* === Pinnable containers (TOC sidebar, tools, etc.) === */
.vector-pinned-container,
.vector-main-menu-container,
.vector-toc-pinned-container {
background-color: var(--uv-parchment) !important;
}
/* === Appearance/settings dropdown === */
.vector-appearance,
.vector-pinnable-header,
.vector-dropdown-content {
background-color: var(--uv-cream);
border-color: var(--uv-gold);
}
/* === Site Title / Logo === */
.mw-logo-wordmark,
.vector-menu-heading,
.mw-wiki-title {
color: var(--uv-gold) !important;
font-family: Georgia, 'Times New Roman', serif;
}
/* === Header Bar (Vector 2022) === */
.vector-header,
.vector-sticky-header,
.mw-header {
background-color: var(--uv-parchment) !important;
border-bottom: 2px solid var(--uv-gold);
}
.vector-header a,
.vector-sticky-header a {
color: var(--uv-navy) !important;
}
.vector-header a:hover,
.vector-sticky-header a:hover {
color: var(--uv-gold) !important;
}
/* === Sidebar === */
.vector-main-menu,
.vector-sidebar,
.mw-sidebar,
.vector-column-start .vector-main-menu {
background-color: var(--uv-navy);
}
.vector-main-menu a,
.vector-sidebar a,
.mw-sidebar a {
color: var(--uv-parchment) !important;
}
.vector-main-menu a:hover,
.vector-sidebar a:hover,
.mw-sidebar a:hover {
color: var(--uv-gold) !important;
}
.vector-main-menu .vector-menu-heading,
.vector-sidebar .vector-menu-heading {
color: var(--uv-gold) !important;
font-family: Georgia, 'Times New Roman', serif;
text-transform: uppercase;
font-size: 0.8em;
letter-spacing: 0.1em;
border-bottom: 1px solid var(--uv-gold);
padding-bottom: 4px;
}
/* === Content Headings === */
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4,
.mw-body-content h5,
.mw-body-content h6,
#firstHeading {
font-family: Georgia, 'Times New Roman', serif;
color: var(--uv-navy);
}
#firstHeading {
font-size: 2em;
border-bottom: 3px solid var(--uv-gold);
padding-bottom: 6px;
}
.mw-body-content h2 {
border-bottom: 2px solid var(--uv-gold);
padding-bottom: 4px;
}
.mw-body-content h3 {
border-bottom: 1px solid var(--uv-gold-light);
padding-bottom: 3px;
}
/* === Links === */
.mw-body-content a:not(.new) {
color: var(--uv-navy);
text-decoration-color: var(--uv-gold-light);
}
.mw-body-content a:not(.new):hover {
color: var(--uv-navy-light);
text-decoration-color: var(--uv-gold);
}
.mw-body-content a:visited:not(.new) {
color: var(--uv-brown-light);
}
.mw-body-content a.new {
color: #8b0000;
}
/* === Infobox (Character Template) === */
.infobox {
background-color: var(--uv-cream);
border: 2px solid var(--uv-gold);
border-collapse: collapse;
margin: 0 0 1em 1.5em;
font-size: 0.9em;
}
.infobox th,
.infobox .infobox-header {
background-color: var(--uv-navy);
color: var(--uv-gold);
font-family: Georgia, 'Times New Roman', serif;
font-size: 1.1em;
padding: 8px 12px;
text-align: center;
border: 1px solid var(--uv-gold);
}
.infobox td {
padding: 5px 10px;
border: 1px solid var(--uv-parchment-dark);
}
.infobox .infobox-label {
background-color: var(--uv-parchment-dark);
font-weight: bold;
color: var(--uv-navy);
width: 35%;
}
.infobox .infobox-data {
background-color: var(--uv-cream);
}
/* === Table of Contents === */
.toc,
.toccolours {
background-color: var(--uv-cream);
border: 1px solid var(--uv-gold);
padding: 10px;
}
.toc h2,
.toc .toctitle {
font-family: Georgia, 'Times New Roman', serif;
color: var(--uv-navy);
}
.toc a {
color: var(--uv-navy);
}
.toc a:hover {
color: var(--uv-gold);
}
/* Vector 2022 TOC sidebar */
.vector-toc .vector-toc-link {
color: var(--uv-navy);
}
.vector-toc .vector-toc-link:hover {
color: var(--uv-gold);
}
/* === Category Links Bar === */
.catlinks {
background-color: var(--uv-cream);
border: 1px solid var(--uv-gold);
padding: 8px 12px;
margin-top: 1.5em;
font-family: Georgia, 'Times New Roman', serif;
font-size: 0.9em;
}
.catlinks a {
color: var(--uv-navy);
}
.catlinks a:hover {
color: var(--uv-gold);
}
/* === Tables (general) === */
.wikitable {
background-color: var(--uv-cream);
border: 1px solid var(--uv-gold);
}
.wikitable th {
background-color: var(--uv-navy);
color: var(--uv-gold);
font-family: Georgia, 'Times New Roman', serif;
border: 1px solid var(--uv-gold);
padding: 6px 10px;
}
.wikitable td {
border: 1px solid var(--uv-parchment-dark);
padding: 5px 8px;
}
/* === Search Box === */
.vector-search-box input[type="search"],
.vector-search-box-input {
background-color: var(--uv-cream);
border: 1px solid var(--uv-gold);
color: var(--uv-brown);
}
.vector-search-box input[type="search"]:focus,
.vector-search-box-input:focus {
border-color: var(--uv-gold-light);
box-shadow: 0 0 4px rgba(197, 164, 78, 0.3);
}
/* === Footer === */
.vector-footer,
#footer {
background-color: var(--uv-navy);
color: var(--uv-parchment);
border-top: 2px solid var(--uv-gold);
}
.vector-footer a,
#footer a {
color: var(--uv-gold-light) !important;
}
.vector-footer a:hover,
#footer a:hover {
color: var(--uv-gold) !important;
}
/* === Tabs (Actions: Read / Edit / History) === */
.vector-menu-tabs a {
color: var(--uv-navy) !important;
}
.vector-menu-tabs a:hover {
color: var(--uv-gold) !important;
}
.vector-menu-tabs .selected a {
color: var(--uv-navy) !important;
border-bottom: 2px solid var(--uv-gold);
}
/* === Body text tuning === */
.mw-body-content {
font-size: 0.95em;
line-height: 1.65;
}
/* === Decorative flourish on page title === */
#firstHeading::after {
content: '';
display: block;
width: 60px;
height: 2px;
background: var(--uv-gold);
margin-top: 4px;
}