MediaWiki:Common.css: Difference between revisions

/* CSS placed here will be applied to all skins */
body.page-Main_Page h1.firstHeading { display:none; }

body.page-Main_Page h1.firstHeading { display:none; }
body.page-Main_Page h2.firstHeading { display:none !important; }
body.page-Main_Page h2#firstHeading.title { display:none; }
body.page-Forside h1.firstHeading { display:none; }
/* ================================================
   Warm Autumn Theme for Timeless Skin
   MediaWiki:Common.css
   ================================================ */

:root {
    /* Primary autumn colors - warm harvest palette */
    --autumn-brown: #8b4513;          /* Rich saddle brown */
    --harvest-orange: #d97736;        /* Warm harvest orange */
    --autumn-cream: #fef5e7;          /* Light cream background */
    --burnt-sienna: #a0522d;          /* Burnt sienna for headers */
    
    /* Accent colors */
    --maple-red: #c44536;             /* Maple leaf red for links */
    --golden-yellow: #daa520;         /* Golden yellow for hover */
    --pumpkin: #e97d3d;               /* Pumpkin orange */
    
    /* Neutrals */
    --warm-beige: #f9f3e8;
    --tan: #d4a76a;
    --dark-brown: #3d2817;
}

/* Main page background */
body {
    background-color: var(--warm-beige);
}

/* Header/top navigation */
#mw-header-container {
    background-color: var(--autumn-brown);
    border-bottom: 3px solid var(--harvest-orange);
}

#mw-header-nav-hack {
    background-color: var(--autumn-brown);
}

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

/* Navigation links in header */
#mw-header-nav-hack a,
#user-tools a {
    color: var(--autumn-cream);
}

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

/* Sidebar */
#mw-site-navigation,
#mw-related-navigation {
    background-color: var(--autumn-cream);
    border-right: 1px solid var(--tan);
}

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

#mw-site-navigation h3,
#mw-related-navigation h3 {
    background-color: var(--harvest-orange);
    color: white;
    border-bottom: 2px solid var(--burnt-sienna);
}

/* Sidebar links */
#mw-site-navigation a,
#mw-related-navigation a {
    color: var(--burnt-sienna);
}

#mw-site-navigation a:hover,
#mw-related-navigation a:hover {
    color: var(--maple-red);
    background-color: rgba(217, 119, 54, 0.1);
}

/* Main content area */
#mw-content-container {
    background-color: white;
    border: 1px solid var(--tan);
    box-shadow: 0 2px 8px rgba(139, 69, 19, 0.15);
}

#mw-content {
    background-color: white;
}

/* Page title */
#firstHeading {
    color: var(--autumn-brown);
    border-bottom: 3px solid var(--harvest-orange);
}

/* Content headings */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4 {
    color: var(--burnt-sienna);
}

.mw-body h2 {
    border-bottom: 2px solid var(--harvest-orange);
}

/* Links */
.mw-body a:not(.new) {
    color: var(--maple-red);
}

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

.mw-body a:not(.new):visited {
    color: #9a3829;
}

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

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

#p-namespaces ul li.selected,
#p-views ul li.selected {
    background-color: white;
    border-bottom-color: white;
}

#p-namespaces a,
#p-views a {
    color: var(--burnt-sienna);
}

/* Buttons */
.mw-ui-button,
.oo-ui-buttonElement-button {
    background-color: var(--harvest-orange);
    color: white;
    border: 1px solid var(--burnt-sienna);
}

.mw-ui-button:hover,
.oo-ui-buttonElement-button:hover {
    background-color: var(--burnt-sienna);
}

/* Info boxes and notice templates */
.infobox {
    background-color: var(--autumn-cream);
    border: 1px solid var(--harvest-orange);
}

/* Table styling */
table.wikitable {
    background-color: white;
    border: 1px solid var(--tan);
}

table.wikitable th {
    background-color: var(--harvest-orange);
    color: white;
}

table.wikitable tr:hover {
    background-color: var(--autumn-cream);
}

/* Code blocks */
pre, code {
    background-color: var(--autumn-cream);
    border: 1px solid var(--tan);
}

/* Footer */
#footer {
    background-color: var(--autumn-cream);
    border-top: 3px solid var(--harvest-orange);
    color: var(--dark-brown);
}

#footer a {
    color: var(--burnt-sienna);
}

#footer a:hover {
    color: var(--maple-red);
}

/* Search box */
#searchInput {
    border: 1px solid var(--tan);
    background-color: white;
}

#searchInput:focus {
    border-color: var(--harvest-orange);
    box-shadow: 0 0 5px rgba(217, 119, 54, 0.3);
}

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

/* Wiki name/site title in top left - make it light on dark background */
#p-logo a,
#p-logo-text a,
.mw-wiki-title,
#sitelogo-text {
    color: var(--autumn-cream) !important;
}

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

/* Username in top right corner - make it light */
#user-tools .mw-ui-icon + span,
#user-tools #pt-userpage a,
#personal h2,
#personal .mw-portlet-heading {
    color: var(--autumn-cream) !important;
}

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

/* Dropdown menu from username - dark text on light background */
#personal .mw-portlet-body,
#personal ul,
#user-tools .dropdown,
#personal .vector-menu-content {
    background-color: white;
    border: 1px solid var(--tan);
    box-shadow: 0 2px 8px rgba(139, 69, 19, 0.2);
}

#personal .mw-portlet-body a,
#personal ul a,
#user-tools .dropdown a {
    color: var(--burnt-sienna) !important;
    background-color: white;
}

#personal .mw-portlet-body a:hover,
#personal ul a:hover,
#user-tools .dropdown a:hover {
    color: var(--maple-red) !important;
    background-color: var(--autumn-cream);
}