MediaWiki:Common.css: Difference between revisions

Revision as of 17:44, 12 August 2025

/* CSS placed here will be applied to all skins */

/* Resize the site logo */
.mw-wiki-logo {
    background-size: contain !important;
    width: 160px !important; /* adjust width */
    height: 160px !important; /* adjust height */
}

/* Center it nicely */
.mw-wiki-logo {
    background-position: center !important;
    background-repeat: no-repeat !important;
}


/* === Sandy Ivory + Jewel Tones === */

/* Page background */
body {
  background-color: #f6f1e1 !important; /* sandy ivory */
  color: #2b2b2b;
}

/* Content area */
#content, .mw-body {
  background-color: #fff8f0 !important; /* lighter ivory for readability */
  color: #2b2b2b;
  border: 1px solid #e2d6c5;
}

/* Sidebar */
#mw-panel {
  background-color: #f6f1e1 !important;
}
#mw-panel .portal h3 {
  color: #8b0000 !important; /* ruby heading */
}
#mw-panel .vector-menu-content-list li a {
  color: #006b6b !important; /* emerald links */
}
#mw-panel .vector-menu-content-list li a:hover {
  color: #004f4f !important;
}

/* Top bar */
#mw-head, #mw-head-base, #left-navigation, #right-navigation {
  background-color: #f6f1e1 !important;
  border-bottom: 2px solid #c49b6e;
}

/* Tabs */
.vectorTabs li a {
  background-color: transparent !important;
  color: #005f73 !important; /* sapphire */
  border: none !important;
}
.vectorTabs li.selected a {
  color: #9c2c2c !important; /* ruby red for active tab */
  font-weight: bold;
}
.vectorTabs li a:hover {
  color: #00796b !important; /* emerald hover */
}

/* Headings */
h1, h2, h3, h4 {
  color: #9c2c2c; /* jewel ruby */
}

/* Links */
a {
  color: #005f73; /* sapphire */
}
a:visited {
  color: #7b3f00; /* bronze tone */
}
a:hover {
  color: #00796b; /* emerald */
}

/* Footer */
#footer {
  background-color: #f6f1e1 !important;
  border-top: 2px solid #c49b6e;
}


/* Top banner placement */
#mw-head {
    background: url("https://sephardicdiaspora.wiki/images/b/b4/Sephardic_wiki_banner.png") no-repeat center top;
    background-color: #F5F0E0;     /* Sandy ivory background for blend */
    background-size: contain;
    height: 100px;                 /* Adjust this to match your banner's height */
}

/* Push content down so it doesn’t overlap with banner */
#content {
    margin-top: 100px;             /* Same value as banner height */
}