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.
/* ==========================================================
THE VAULT @ THE E.E.R.I.E. FILES — MediaWiki:Cosmos.css
Cosmos skin overrides
Purpose:
- Header
- Sidebar
- Search
- Footer
- Skin navigation
Main article styling lives in Common.css
========================================================== */
/* ==========================================================
VAULT COLOUR SYSTEM
========================================================== */
:root {
--void:#f5f1e8;
--panel:#ffffff;
--panel-edge:#d8d0c0;
--acid:#7ab800;
--violet:#7a32b8;
--cream:#222222;
--amber:#b87800;
--muted:#6b6458;
}
/* ==========================================================
COSMOS SIDE RAIL
========================================================== */
#cosmos-rail .rail-module,
.rail-module {
background-color:var(--panel) !important;
border:1px solid var(--panel-edge) !important;
color:var(--cream) !important;
box-shadow:none !important;
}
.rail-module .rail-module-header,
.rail-module h3 {
font-family:'JetBrains Mono', monospace !important;
color:var(--violet) !important;
letter-spacing:.08em;
text-transform:uppercase;
font-size:.75rem !important;
border-bottom:1px solid var(--panel-edge) !important;
}
.rail-module a {
color:#276b9c !important;
}
.rail-module a:hover {
color:var(--acid) !important;
}
/* ==========================================================
SEARCH
========================================================== */
.cosmos-searchInput input,
#simpleSearch,
.oo-ui-textInputWidget input {
background-color:#ffffff !important;
color:var(--cream) !important;
border:1px solid var(--panel-edge) !important;
}
.cosmos-searchInput input::placeholder {
color:var(--muted);
}
/* ==========================================================
HEADER / NAVIGATION
========================================================== */
.cosmos-community-header,
.wiki-nav,
#p-logo a {
border-color:var(--panel-edge) !important;
}
.wiki-nav a,
.cosmos-header-menu a {
color:var(--muted) !important;
}
.wiki-nav a:hover,
.cosmos-header-menu a:hover {
color:var(--violet) !important;
}
/* ==========================================================
PERSONAL TOOLBAR
========================================================== */
.personal-more-container,
#p-personal {
color:var(--muted) !important;
}
#p-personal a {
color:var(--muted) !important;
}
#p-personal a:hover {
color:var(--violet) !important;
}
/* ==========================================================
FOOTER
========================================================== */
#footer,
.mw-footer {
background-color:#ede7da !important;
border-top:1px solid var(--panel-edge) !important;
color:var(--muted) !important;
}
#footer a,
.mw-footer a {
color:var(--violet) !important;
}
/* ==========================================================
COSMOS BACKGROUND FIXES
Prevents Cosmos forcing dark containers
========================================================== */
.cosmos-body,
.cosmos-main-content,
.cosmos-content {
background-color:var(--void) !important;
color:var(--cream) !important;
}
/* ==========================================================
BUTTONS / CONTROLS
========================================================== */
button,
input[type="submit"] {
font-family:'JetBrains Mono', monospace;
}
button:hover,
input[type="submit"]:hover {
border-color:var(--acid) !important;
}
/* ==========================================================
RESPONSIVE
========================================================== */
@media screen and (max-width:700px) {
.rail-module {
border-radius:6px;
}
}
