MediaWiki:Common.css - Revision history

Info216 at 11:15, 27 February 2026

2026-02-27T11:15:45Z

← Older revision		Revision as of 11:15, 27 February 2026
Line 8:		Line 8:
	:root {		:root {
	/* STUDY Academic Color Palette v2 */		/* STUDY Academic Color Palette v2 */
	--burnt-rose: #~~8C3B3B~~; /* Primary - Burnt Rose */		--burnt-rose: #761a19; /* Primary - Burnt Rose */
	--shadow-grey: #19171D; /* Dark text/elements - Shadow Grey */		--shadow-grey: #19171D; /* Dark text/elements - Shadow Grey */
	--graphite: #323033; /* Secondary text - Graphite */		--graphite: #323033; /* Secondary text - Graphite */
	--floral-white: #~~FDF8F0~~; /* Background - Floral White */		--floral-white: #fef9f1; /* Background - Floral White */
	--old-lace: #FDF6E7; /* Secondary background - Old Lace */		--old-lace: #FDF6E7; /* Secondary background - Old Lace */

Line 89:		Line 89:
	#mw-related-navigation a:hover {		#mw-related-navigation a:hover {
	color: var(--burnt-rose);		color: var(--burnt-rose);
	background-color: rgba(~~140~~, 59, 59, 0.1);		background-color: rgba(118, 26, 25, 0.1);
	}		}

Line 96:		Line 96:
	background-color: var(--bg-white);		background-color: var(--bg-white);
	border: 1px solid var(--border-light);		border: 1px solid var(--border-light);
	box-shadow: 0 2px 8px rgba(~~140~~, 59, 59, 0.08);		box-shadow: 0 2px 8px rgba(118, 26, 25, 0.08);
	}		}

Line 214:		Line 214:
	border: 1px solid var(--border-light);		border: 1px solid var(--border-light);
	border-left: 4px solid var(--burnt-rose);		border-left: 4px solid var(--burnt-rose);
	box-shadow: 0 1px 3px rgba(~~140~~, 59, 59, 0.1);		box-shadow: 0 1px 3px rgba(118, 26, 25, 0.1);
	}		}

Line 245:		Line 245:

	table.wikitable tr:hover {		table.wikitable tr:hover {
	background-color: rgba(~~140~~, 59, 59, 0.08);		background-color: rgba(118, 26, 25, 0.08);
	}		}

Line 310:		Line 310:
	#searchInput:focus {		#searchInput:focus {
	border-color: var(--burnt-rose);		border-color: var(--burnt-rose);
	box-shadow: 0 0 0 2px rgba(~~140~~, 59, 59, 0.1);		box-shadow: 0 0 0 2px rgba(118, 26, 25, 0.1);
	outline: none;		outline: none;
	}		}
Line 355:		Line 355:
	input[type="search"]:focus {		input[type="search"]:focus {
	border-color: var(--burnt-rose);		border-color: var(--burnt-rose);
	box-shadow: 0 0 0 2px rgba(~~140~~, 59, 59, 0.1);		box-shadow: 0 0 0 2px rgba(118, 26, 25, 0.1);
	}		}

Line 398:		Line 398:
	background-color: var(--bg-white);		background-color: var(--bg-white);
	border: 1px solid var(--border-light);		border: 1px solid var(--border-light);
	box-shadow: 0 4px 12px rgba(~~140~~, 59, 59, 0.15);		box-shadow: 0 4px 12px rgba(118, 26, 25, 0.15);
	}		}

Line 422:		Line 422:
	/* User icon - replace with light-colored version */		/* User icon - replace with light-colored version */
	#personal h2 {		#personal h2 {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="6" r="3" fill="%~~23FDF8F0~~"/><path d="M10 10c-3 0-7 2-7 5v2h14v-2c0-3-4-5-7-5z" fill="%~~23FDF8F0~~"/></svg>') !important;		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="6" r="3" fill="%23fef9f1"/><path d="M10 10c-3 0-7 2-7 5v2h14v-2c0-3-4-5-7-5z" fill="%23fef9f1"/></svg>') !important;
	}		}

	/* Site tools gear icon - replace with light-colored version */		/* Site tools gear icon - replace with light-colored version */
	#site-tools h2 {		#site-tools h2 {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M10 1.5c-.85 0-1.6.55-1.85 1.35l-.35 1.1c-.25.05-.5.15-.75.25l-1-.6c-.75-.45-1.7-.3-2.3.35l-.7.7c-.65.65-.8 1.55-.35 2.3l.6 1c-.1.25-.2.5-.25.75l-1.1.35C1.05 9.4.5 10.15.5 11s.55 1.6 1.35 1.85l1.1.35c.05.25.15.5.25.75l-.6 1c-.45.75-.3 1.7.35 2.3l.7.7c.65.65 1.55.8 2.3.35l1-.6c.25.1.5.2.75.25l.35 1.1c.25.8 1 1.35 1.85 1.35s1.6-.55 1.85-1.35l.35-1.1c.25-.05.5-.15.75-.25l1 .6c.75.45 1.7.3 2.3-.35l.7-.7c.65-.65.8-1.55.35-2.3l-.6-1c.1-.25.2-.5.25-.75l1.1-.35c.8-.25 1.35-1 1.35-1.85s-.55-1.6-1.35-1.85l-1.1-.35c-.05-.25-.15-.5-.25-.75l.6-1c.45-.75.3-1.7-.35-2.3l-.7-.7c-.65-.65-1.55-.8-2.3-.35l-1 .6c-.25-.1-.5-.2-.75-.25l-.35-1.1C11.6 2.05 10.85 1.5 10 1.5zm0 5.5c1.65 0 3 1.35 3 3s-1.35 3-3 3-3-1.35-3-3 1.35-3 3-3z" fill="%~~23FDF8F0~~"/></svg>') !important;		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M10 1.5c-.85 0-1.6.55-1.85 1.35l-.35 1.1c-.25.05-.5.15-.75.25l-1-.6c-.75-.45-1.7-.3-2.3.35l-.7.7c-.65.65-.8 1.55-.35 2.3l.6 1c-.1.25-.2.5-.25.75l-1.1.35C1.05 9.4.5 10.15.5 11s.55 1.6 1.35 1.85l1.1.35c.05.25.15.5.25.75l-.6 1c-.45.75-.3 1.7.35 2.3l.7.7c.65.65 1.55.8 2.3.35l1-.6c.25.1.5.2.75.25l.35 1.1c.25.8 1 1.35 1.85 1.35s1.6-.55 1.85-1.35l.35-1.1c.25-.05.5-.15.75-.25l1 .6c.75.45 1.7.3 2.3-.35l.7-.7c.65-.65.8-1.55.35-2.3l-.6-1c.1-.25.2-.5.25-.75l1.1-.35c.8-.25 1.35-1 1.35-1.85s-.55-1.6-1.35-1.85l-1.1-.35c-.05-.25-.15-.5-.25-.75l.6-1c.45-.75.3-1.7-.35-2.3l-.7-.7c-.65-.65-1.55-.8-2.3-.35l-1 .6c-.25-.1-.5-.2-.75-.25l-.35-1.1C11.6 2.05 10.85 1.5 10 1.5zm0 5.5c1.65 0 3 1.35 3 3s-1.35 3-3 3-3-1.35-3-3 1.35-3 3-3z" fill="%23fef9f1"/></svg>') !important;
	}		}

Line 433:		Line 433:
	#site-navigation h2,		#site-navigation h2,
	#mw-site-navigation h2 {		#mw-site-navigation h2 {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M2 4h16v2H2zm0 5h16v2H2zm0 5h16v2H2z" fill="%~~23FDF8F0~~"/></svg>') !important;		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M2 4h16v2H2zm0 5h16v2H2zm0 5h16v2H2z" fill="%23fef9f1"/></svg>') !important;
	}		}

Info216 at 12:38, 19 February 2026

2026-02-19T12:38:56Z

Show changes

Info216 at 12:38, 19 February 2026

2026-02-19T12:38:10Z

Show changes

Info216 at 16:48, 8 February 2026

2026-02-08T16:48:37Z

Show changes

Info216: Created page with "/* CSS plassert i denne fila vil gjelde for alle utseender. / body.page-Hovedside h1.firstHeading { display:none; } / ================================================ INFO Modern Theme for Timeless Skin MediaWiki:Common.css Perfect for: Information Wikis, Modern Documentation ================================================ / :root { / INFO Modern Color Palette / --white: #FFFFFF; / Pure white - content background */ --alab..."

2026-01-09T11:41:05Z

Created page with "CSS plassert i denne fila vil gjelde for alle utseender.: body.page-Hovedside h1.firstHeading { display:none; } ================================================ INFO Modern Theme for Timeless Skin MediaWiki:Common.css Perfect for: Information Wikis, Modern Documentation ================================================: :root { INFO Modern Color Palette: --white: #FFFFFF; Pure white - content background: --alab..."

New page

/* CSS plassert i denne fila vil gjelde for alle utseender. */
body.page-Hovedside h1.firstHeading { display:none; }

/* ================================================
INFO Modern Theme for Timeless Skin
MediaWiki:Common.css
Perfect for: Information Wikis, Modern Documentation
================================================ */

:root {
/* INFO Modern Color Palette */
--white: #FFFFFF; /* Pure white - content background */
--alabaster-grey: #E8E4E0; /* Background - Alabaster Grey */
--almond-cream: #F4DBBF; /* Accent - Almond Cream */
--rosy-copper: #C14C40; /* Primary - Rosy Copper */
--graphite: #3D3939; /* Text - Graphite */

/* Extended palette for UI elements */
--rosy-copper-light: #d16555; /* Lighter copper for hover */
--rosy-copper-dark: #a13c31; /* Darker copper */
--border-light: #d9d3cf; /* Subtle borders */
--text-primary: #3D3939; /* Primary text - graphite */
--text-secondary: #5a5555; /* Secondary text */
--link-blue: #2A50AD; /* Hyperlink blue */
--link-blue-hover: #1a3a8d; /* Darker blue for hover */
}

/* Main page background */
body {
background-color: var(--alabaster-grey);
color: var(--text-primary);
}

/* Header/top navigation - modern rosy copper */
#mw-header-container {
background-color: var(--rosy-copper) !important;
background: var(--rosy-copper) !important;
border-bottom: 2px solid var(--almond-cream);
}

#mw-header-nav-hack {
background-color: var(--rosy-copper) !important;
background: var(--rosy-copper) !important;
}

/* Ensure header elements use rosy copper */
.mw-header,
header {
background-color: var(--rosy-copper) !important;
}

/* Site logo area */
#p-logo a {
background-color: transparent;
}

/* Navigation links in header */
#mw-header-nav-hack a,
#user-tools a {
color: var(--white);
font-weight: 500;
}

#mw-header-nav-hack a:hover,
#user-tools a:hover {
color: var(--almond-cream);
}

/* Sidebar - modern information style */
#mw-site-navigation,
#mw-related-navigation {
background-color: var(--alabaster-grey);
border-right: 1px solid var(--border-light);
}

#mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk {
background-color: transparent;
}

#mw-site-navigation h3,
#mw-related-navigation h3 {
background-color: var(--rosy-copper);
color: white;
border-bottom: 2px solid var(--almond-cream);
font-weight: 600;
text-transform: uppercase;
font-size: 0.875rem;
letter-spacing: 0.5px;
}

/* Sidebar links - use dark text for WCAG AA compliance */
#mw-site-navigation a,
#mw-related-navigation a {
color: var(--text-primary);
font-weight: 400;
}

#mw-site-navigation a:hover,
#mw-related-navigation a:hover {
color: var(--rosy-copper);
background-color: rgba(193, 76, 64, 0.1);
}

/* Main content area - clean white pages */
#mw-content-container {
background-color: var(--white);
border: 1px solid var(--border-light);
box-shadow: 0 2px 8px rgba(193, 76, 64, 0.08);
}

#mw-content {
background-color: var(--white);
color: var(--text-primary);
}

/* Page title - modern heading */
#firstHeading {
color: var(--rosy-copper);
border-bottom: 3px solid var(--almond-cream);
font-weight: 600;
padding-bottom: 12px;
}

/* Content headings - hierarchical typography */
.mw-body h1 {
color: var(--rosy-copper);
font-weight: 600;
}

.mw-body h2 {
color: var(--rosy-copper);
font-weight: 600;
border-bottom: 2px solid var(--almond-cream);
padding-bottom: 8px;
margin-top: 32px;
}

.mw-body h3 {
color: var(--rosy-copper-dark);
font-weight: 600;
margin-top: 24px;
}

.mw-body h4 {
color: var(--text-secondary);
font-weight: 600;
}

/* Body text - optimal readability */
.mw-body,
.mw-body p {
color: var(--text-primary);
line-height: 1.7;
font-size: 1rem;
}

/* Links - modern style */
.mw-body a:not(.new) {
color: var(--link-blue);
text-decoration: none;
border-bottom: 1px solid transparent;
transition: border-color 0.2s ease;
}

.mw-body a:not(.new):hover {
color: var(--link-blue-hover);
border-bottom-color: var(--link-blue);
}

.mw-body a:not(.new):visited {
color: var(--link-blue-hover);
}

/* Red links (non-existent pages) */
.mw-body a.new {
color: #9f4444;
}

/* Tabs (page actions) */
#p-namespaces ul li,
#p-views ul li {
background-color: var(--alabaster-grey);
border: 1px solid var(--border-light);
}

#p-namespaces ul li.selected,
#p-views ul li.selected {
background-color: var(--white);
border-bottom-color: var(--white);
border-top: 2px solid var(--rosy-copper);
}

#p-namespaces a,
#p-views a {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.875rem;
}

#p-namespaces ul li.selected a,
#p-views ul li.selected a {
color: var(--rosy-copper);
}

/* Buttons - modern actions */
.mw-ui-button,
.oo-ui-buttonElement-button {
background-color: var(--rosy-copper);
color: white;
border: none;
font-weight: 500;
padding: 10px 20px;
transition: background-color 0.2s ease;
}

.mw-ui-button:hover,
.oo-ui-buttonElement-button:hover {
background-color: var(--rosy-copper-dark);
}

/* Info boxes - information notes */
.infobox {
background-color: var(--alabaster-grey);
border: 1px solid var(--almond-cream);
border-left: 4px solid var(--rosy-copper);
box-shadow: 0 1px 3px rgba(193, 76, 64, 0.1);
}

/* Table styling - modern data presentation */
table.wikitable {
background-color: var(--white);
border: 1px solid var(--border-light);
color: var(--text-primary);
}

table.wikitable th {
background-color: var(--rosy-copper);
color: white;
border: 1px solid var(--almond-cream);
font-weight: 600;
text-transform: uppercase;
font-size: 0.875rem;
letter-spacing: 0.5px;
padding: 12px 16px;
}

table.wikitable td {
border: 1px solid var(--border-light);
padding: 10px 16px;
}

table.wikitable tr:nth-child(even) {
background-color: var(--alabaster-grey);
}

table.wikitable tr:hover {
background-color: rgba(193, 76, 64, 0.05);
}

/* Code blocks - technical documentation */
pre, code {
background-color: var(--alabaster-grey);
border: 1px solid var(--border-light);
border-left: 3px solid var(--almond-cream);
color: var(--text-primary);
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
font-size: 0.9rem;
}

pre {
padding: 16px;
overflow-x: auto;
}

code {
padding: 2px 6px;
}

/* Footer - modern information style */
#footer,
#mw-footer,
#mw-footer-container {
background-color: var(--alabaster-grey);
border-top: 2px solid var(--almond-cream);
color: var(--text-primary) !important;
font-size: 0.875rem;
}

/* Footer text - dark for better contrast (WCAG AA) */
#footer-info,
#footer-places,
#footer-list,
#mw-footer ul,
#mw-footer li {
color: var(--text-primary) !important;
}

/* Footer links */
#footer a,
#mw-footer a,
#footer-places a,
#footer-info a {
color: var(--text-primary) !important;
font-weight: 500;
}

#footer a:hover,
#mw-footer a:hover {
color: var(--rosy-copper) !important;
}

/* Search box */
#searchInput {
border: 1px solid var(--border-light);
background-color: var(--white);
color: var(--text-primary);
padding: 8px 12px;
}

#searchInput:focus {
border-color: var(--rosy-copper);
box-shadow: 0 0 0 2px rgba(193, 76, 64, 0.1);
outline: none;
}

#searchInput::placeholder {
color: var(--text-secondary);
}

/* Blockquotes - citations and references */
blockquote {
border-left: 4px solid var(--almond-cream);
background-color: var(--alabaster-grey);
padding: 16px 20px;
margin: 20px 0;
color: var(--text-secondary);
font-style: italic;
}

/* Lists - structured documentation */
.mw-body ul,
.mw-body ol {
line-height: 1.8;
color: var(--text-primary);
}

/* Categories and metadata */
#catlinks {
background-color: var(--alabaster-grey);
border: 1px solid var(--border-light);
color: var(--text-secondary);
}

/* Edit forms and inputs */
textarea,
input[type="text"],
input[type="search"] {
background-color: var(--white);
color: var(--text-primary);
border: 1px solid var(--border-light);
}

textarea:focus,
input[type="text"]:focus,
input[type="search"]:focus {
border-color: var(--rosy-copper);
box-shadow: 0 0 0 2px rgba(193, 76, 64, 0.1);
}

/* ================================================
Additional fixes for header text visibility
================================================ */

/* Wiki name/site title in top left */
#p-logo a,
#p-logo-text a,
.mw-wiki-title,
#sitelogo-text {
color: var(--white) !important;
font-weight: 600 !important;
text-transform: uppercase;
letter-spacing: 1px;
}

#p-logo a:hover,
#p-logo-text a:hover {
color: var(--almond-cream) !important;
}

/* Username in top right corner */
#user-tools .mw-ui-icon + span,
#user-tools #pt-userpage a,
#personal h2,
#personal .mw-portlet-heading {
color: var(--white) !important;
font-weight: 500 !important;
}

#user-tools #pt-userpage a:hover {
color: var(--almond-cream) !important;
}

/* Dropdown menu from username */
#personal .mw-portlet-body,
#personal ul,
#user-tools .dropdown,
#personal .vector-menu-content {
background-color: var(--white);
border: 1px solid var(--border-light);
box-shadow: 0 4px 12px rgba(193, 76, 64, 0.15);
}

#personal .mw-portlet-body a,
#personal ul a,
#user-tools .dropdown a {
color: var(--text-primary) !important;
background-color: var(--white);
font-weight: 400;
}

#personal .mw-portlet-body a:hover,
#personal ul a:hover,
#user-tools .dropdown a:hover {
color: var(--rosy-copper) !important;
background-color: var(--alabaster-grey);
}

/* ================================================
Icon Fixes for Dark Header Background
================================================ */

/* User icon - replace with light-colored version */
#personal h2 {
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="6" r="3" fill="%23FFFFFF"/><path d="M10 10c-3 0-7 2-7 5v2h14v-2c0-3-4-5-7-5z" fill="%23FFFFFF"/></svg>') !important;
}

/* Site tools gear icon - replace with light-colored version */
#site-tools h2 {
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M10 1.5c-.85 0-1.6.55-1.85 1.35l-.35 1.1c-.25.05-.5.15-.75.25l-1-.6c-.75-.45-1.7-.3-2.3.35l-.7.7c-.65.65-.8 1.55-.35 2.3l.6 1c-.1.25-.2.5-.25.75l-1.1.35C1.05 9.4.5 10.15.5 11s.55 1.6 1.35 1.85l1.1.35c.05.25.15.5.25.75l-.6 1c-.45.75-.3 1.7.35 2.3l.7.7c.65.65 1.55.8 2.3.35l1-.6c.25.1.5.2.75.25l.35 1.1c.25.8 1 1.35 1.85 1.35s1.6-.55 1.85-1.35l.35-1.1c.25-.05.5-.15.75-.25l1 .6c.75.45 1.7.3 2.3-.35l.7-.7c.65-.65.8-1.55.35-2.3l-.6-1c.1-.25.2-.5.25-.75l1.1-.35c.8-.25 1.35-1 1.35-1.85s-.55-1.6-1.35-1.85l-1.1-.35c-.05-.25-.15-.5-.25-.75l.6-1c.45-.75.3-1.7-.35-2.3l-.7-.7c-.65-.65-1.55-.8-2.3-.35l-1 .6c-.25-.1-.5-.2-.75-.25l-.35-1.1C11.6 2.05 10.85 1.5 10 1.5zm0 5.5c1.65 0 3 1.35 3 3s-1.35 3-3 3-3-1.35-3-3 1.35-3 3-3z" fill="%23FFFFFF"/></svg>') !important;
}

/* Site navigation hamburger menu icon - replace with light-colored version */
#site-navigation h2,
#mw-site-navigation h2 {
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><path d="M2 4h16v2H2zm0 5h16v2H2zm0 5h16v2H2z" fill="%23FFFFFF"/></svg>') !important;
}

/* User tools icons in header - make light colored */
#user-tools .mw-ui-icon,
#user-tools .mw-ui-icon:before,
#user-tools .mw-ui-icon:after,
#personal .mw-ui-icon {
color: var(--white) !important;
fill: var(--white) !important;
opacity: 0.9;
}

#user-tools .mw-ui-icon:hover,
#personal .mw-ui-icon:hover {
color: var(--almond-cream) !important;
fill: var(--almond-cream) !important;
opacity: 1;
}