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)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

/* 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;
}

body {
    background-color: #66023C !important;
    color: white !important; /* Text color for contrast */
}

#content {
    background-color: #66023C !important;
    color: white !important; /* Keep text visible */
}

/* ===== HEADER & TOP BAR ===== */
#mw-page-base,
#mw-head-base,
#mw-head,
#p-personal,
.vector-menu-tabs {
    background-color: #66023C !important;
}


/* ===== SIDEBAR ===== */
#mw-panel {
    background-color: #66023C !important;
}


/* ===== LINKS ===== */
a {
    color: #FFD700 !important; /* Gold for contrast */
}
a:visited {
    color: #FFB700 !important;
}

/* ===== FOOTER ===== */
#footer {
    background-color: #66023C !important;
    color: white !important;
}

/* Tab background for active and inactive states */
.vectorTabs li a,
.vectorTabs li a:visited {
    background-color: #66023C !important; /* Tyrian purple */
    color: #FFD700 !important; /* Gold text */
    border: none !important;
}

/* Hover state */
.vectorTabs li a:hover {
    background-color: #7A2B52 !important; /* Slightly lighter purple */
    color: #FFD700 !important; /* Keep gold text */
}

/* Active tab */
.vectorTabs li.selected a,
.vectorTabs li.selected a:visited {
    background-color: #4E012B !important; /* Darker purple for active */
    color: #FFD700 !important;
}


/* Match tabs and portlets to Tyrian Purple */
#p-personal,
.vectorTabs,
.vectorTabs li,
.vectorTabs li a,
.vectorTabs li a span,
div#mw-head,
#p-cactions,
#p-views,
#mw-panel {
    background-color: #66023C !important;
}

/* Make sure tab text stays readable */
.vectorTabs li a span {
    color: #FFD700 !important; /* gold text */
}

/* Remove tab gradient so solid purple shows */
.vectorTabs li a {
    background-image: none !important;
}

/* === Make all top tabs match Tyrian Purple (#66023C) === */

/* Bar + nav containers */
#mw-head,
#mw-head-base,
#left-navigation,
#right-navigation,
#p-namespaces,
#p-views,
#p-cactions,
#p-personal {
  background: #66023C !important;
}

/* Each tab li and link */
#p-namespaces .vectorTabs li,
#p-views .vectorTabs li,
#p-cactions .vectorTabs li,
#right-navigation .vectorTabs li {
  background: #66023C !important;
  border: 0 !important;
  box-shadow: none !important;
}

#p-namespaces .vectorTabs li a,
#p-views .vectorTabs li a,
#p-cactions .vectorTabs li a,
#right-navigation .vectorTabs li a {
  background: #66023C !important;
  background-image: none !important;   /* kill gradient */
  color: #FFD700 !important;           /* gold text */
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Active/selected tab */
#p-namespaces .vectorTabs li.selected a,
#p-views .vectorTabs li.selected a,
#p-cactions .vectorTabs li.selected a,
#right-navigation .vectorTabs li.selected a {
  background: #4E012B !important;      /* darker purple for active */
  color: #FFD700 !important;
  border: 0 !important;
}

/* Hover state */
#p-namespaces .vectorTabs li a:hover,
#p-views .vectorTabs li a:hover,
#p-cactions .vectorTabs li a:hover,
#right-navigation .vectorTabs li a:hover {
  background: #7A2B52 !important;      /* lighter purple on hover */
  color: #FFD700 !important;
  background-image: none !important;
}

/* Search box to blend in */
#simpleSearch,
#searchInput {
  background: #7A2B52 !important;
  border: 1px solid #4E012B !important;
  color: #fff !important;
}
#searchInput::placeholder { color: #f2d27a !important; }