MediaWiki:Timeless.css: Difference between revisions
OMNIVERSE
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* ==================== | /* ==================== OMNIVERSE WIKI DARK THEME ==================== */ | ||
/* Complete custom theme to match omni-verse.us website */ | |||
/* ==================== BASE COLORS ==================== */ | |||
body { | body { | ||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
| Line 5: | Line 8: | ||
} | } | ||
#mw-content-container { | /* ==================== MAIN CONTENT AREA ==================== */ | ||
background-color: # | #mw-content-container, | ||
#mw-content-wrapper, | |||
#mw-content, | |||
.mw-body { | |||
background-color: #2c3142 !important; | |||
color: #e5e7eb !important; | |||
} | } | ||
.mw- | .mw-parser-output { | ||
color: #e5e7eb !important; | color: #e5e7eb !important; | ||
} | } | ||
/* ==================== HEADER / TOP | /* ==================== HEADER / TOP NAVIGATION ==================== */ | ||
#mw-header-container { | #mw-header-container { | ||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
border-bottom: | border-bottom: none !important; | ||
} | } | ||
#mw-header-container .color-left { | #mw-header-container .color-left { | ||
border-bottom | border-bottom: 2px solid #f59e0b !important; | ||
} | } | ||
#mw-header-container .color-middle { | #mw-header-container .color-middle { | ||
border-bottom | border-bottom: 2px solid #3b82f6 !important; | ||
} | } | ||
#mw-header-container .color-right { | #mw-header-container .color-right { | ||
border-bottom | border-bottom: 2px solid #10b981 !important; | ||
} | } | ||
#mw-header { | |||
# | |||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
} | } | ||
. | /* Site title/logo */ | ||
#p-logo a, | |||
.mw-wiki-title { | |||
color: #ffffff !important; | color: #ffffff !important; | ||
} | } | ||
| Line 109: | Line 53: | ||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
color: #ffffff !important; | color: #ffffff !important; | ||
border: 1px solid # | border: 1px solid #4a5568 !important; | ||
} | } | ||
| Line 118: | Line 62: | ||
.search-form { | .search-form { | ||
background-color: | background-color: transparent !important; | ||
} | } | ||
#searchButton { | |||
background-color: #3b82f6 !important; | background-color: #3b82f6 !important; | ||
color: #ffffff !important; | color: #ffffff !important; | ||
} | } | ||
/* ==================== USER MENU ==================== */ | |||
#personal, | |||
#user-tools { | |||
/* ==================== | |||
# | |||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
} | } | ||
# | #personal ul li a, | ||
#user-tools a { | |||
color: #e5e7eb !important; | color: #e5e7eb !important; | ||
} | } | ||
# | /* ==================== LEFT SIDEBAR - COMPLETE RESET ==================== */ | ||
background-color: # | #mw-site-navigation, | ||
#mw-related-navigation, | |||
#mw-navigation, | |||
#mw-panel { | |||
background-color: #1a1d29 !important; | |||
} | } | ||
/* Remove ALL borders from portlets */ | |||
background-color: # | .mw-portlet { | ||
background-color: #1a1d29 !important; | |||
border: 0 !important; | |||
box-shadow: none !important; | |||
outline: 0 !important; | |||
margin-bottom: 1em !important; | |||
} | } | ||
/* | /* Portlet headers (Navigation, Wiki tools, etc) */ | ||
.mw-portlet h3, | |||
.mw-portlet-heading { | |||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
color: #fbbf24 !important; | color: #fbbf24 !important; | ||
border: 0 !important; | |||
padding: 8px 12px !important; | |||
margin: 0 !important; | |||
font-weight: bold !important; | |||
} | } | ||
/* Portlet body containers */ | |||
color: # | .mw-portlet .body, | ||
.mw-portlet .mw-portlet-body, | |||
.mw-portlet-body { | |||
background-color: #1a1d29 !important; | |||
border: 0 !important; | |||
padding: 0 !important; | |||
} | } | ||
/* Sidebar links */ | |||
color: | .mw-portlet .body ul, | ||
.mw-portlet-body ul { | |||
background-color: transparent !important; | |||
margin: 0 !important; | |||
list-style: none !important; | |||
} | } | ||
.mw-portlet .body ul li, | |||
.mw-portlet-body ul li { | |||
background-color: | background-color: transparent !important; | ||
padding: 6px 12px !important; | |||
border: 0 !important; | |||
} | } | ||
.mw-portlet .body ul li a, | |||
color: # | .mw-portlet-body ul li a { | ||
color: #93c5fd !important; | |||
text-decoration: none !important; | |||
} | } | ||
.mw-portlet .body ul li a:hover, | |||
.mw-portlet-body ul li a:hover { | |||
color: #ffffff !important; | color: #ffffff !important; | ||
} | } | ||
.mw-portlet .body ul li:hover, | |||
.mw-portlet-body ul li:hover { | |||
background-color: #2d3142 !important; | |||
} | } | ||
/* ==================== | /* ==================== PAGE TABS (Main Page, Discussion, Edit, etc) ==================== */ | ||
#p-namespaces ul, | |||
#p-views ul { | |||
background-color: | background-color: transparent !important; | ||
} | } | ||
#p-namespaces ul li, | |||
#p-views ul li { | |||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
border | border: 0 !important; | ||
margin-right: 2px !important; | |||
} | } | ||
#p-namespaces ul li a, | |||
#p-views ul li a { | |||
color: #93c5fd !important; | |||
padding: 8px 16px !important; | |||
} | } | ||
#p-namespaces ul li.selected, | |||
#p-views ul li.selected { | |||
background-color: #2c3142 !important; | |||
border-bottom: 2px solid #fbbf24 !important; | |||
# | |||
# | |||
. | |||
background-color: # | |||
border: | |||
} | } | ||
# | #p-namespaces ul li:hover, | ||
background-color: # | #p-views ul li:hover { | ||
background-color: #3a3f51 !important; | |||
} | } | ||
/* ==================== TABLE OF CONTENTS ==================== */ | |||
/* ==================== | |||
.toc { | .toc { | ||
background-color: #2d3447 !important; | background-color: #2d3447 !important; | ||
border: | border: 0 !important; | ||
padding: 12px !important; | |||
} | } | ||
.toc h2, | |||
.toc .toctitle h2 { | .toc .toctitle h2 { | ||
color: #fbbf24 !important; | |||
background-color: transparent !important; | background-color: transparent !important; | ||
border: 0 !important; | |||
margin: 0 0 8px 0 !important; | |||
} | } | ||
.toc ul { | .toc ul { | ||
background-color: transparent !important; | background-color: transparent !important; | ||
margin: 0 !important; | |||
} | } | ||
| Line 276: | Line 207: | ||
} | } | ||
.toc a { | |||
. | |||
color: #60a5fa !important; | color: #60a5fa !important; | ||
} | } | ||
/* ==================== | /* ==================== RIGHT SIDEBAR - PAGE TOOLS ==================== */ | ||
#page-tools { | #page-tools { | ||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
border: | border: 0 !important; | ||
} | } | ||
#page-tools | #page-tools .mw-portlet { | ||
border: 0 !important; | |||
border | |||
} | } | ||
#page-tools | #page-tools h3 { | ||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
color: #fbbf24 !important; | |||
border: 0 !important; | |||
} | } | ||
#page-tools .mw-portlet-body { | |||
.mw-portlet | |||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
} | } | ||
#page-tools .body li a { | |||
. | color: #93c5fd !important; | ||
} | } | ||
#page-tools .body li a:hover { | |||
color: #ffffff !important; | |||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
} | } | ||
/* ==================== | /* ==================== LINKS ==================== */ | ||
a { | |||
color: #60a5fa !important; | |||
} | } | ||
a:visited { | |||
color: #a78bfa !important; | |||
} | } | ||
a:hover { | |||
color: #93c5fd !important; | |||
text-decoration: underline !important; | |||
} | } | ||
a.new { | |||
color: #f87171 !important; | |||
} | } | ||
.mw-editsection, | |||
.mw-editsection a { | |||
color: #60a5fa !important; | |||
} | } | ||
/* ==================== HEADINGS ==================== */ | |||
h1, h2, h3, h4, h5, h6 { | |||
color: #ffffff !important; | |||
/* ==================== | border-bottom: 1px solid #3a3f51 !important; | ||
border: | |||
} | } | ||
.mw-body h1.firstHeading { | |||
.mw- | color: #ffffff !important; | ||
border-bottom: 2px solid #3a3f51 !important; | |||
margin-bottom: 1em !important; | |||
} | } | ||
/* | /* ==================== BUTTONS ==================== */ | ||
.mw- | .mw-ui-button, | ||
. | button, | ||
background-color: # | input[type="submit"], | ||
border: | .oo-ui-buttonElement-button { | ||
background-color: #3b82f6 !important; | |||
color: #ffffff !important; | |||
border: 1px solid #2563eb !important; | |||
} | } | ||
.mw-ui-button:hover, | |||
button:hover, | |||
background-color: # | input[type="submit"]:hover { | ||
background-color: #2563eb !important; | |||
} | } | ||
/* ==================== FORMS & INPUTS ==================== */ | |||
input[type="text"], | |||
input[type="password"], | |||
input[type="email"], | |||
textarea, | |||
select { | |||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
color: #ffffff !important; | |||
border: 1px solid #4a5568 !important; | |||
} | } | ||
input[type="text"]:focus, | |||
textarea:focus, | |||
select:focus { | |||
border-color: #60a5fa !important; | |||
outline: none !important; | |||
} | } | ||
/* | /* ==================== TABLES ==================== */ | ||
table { | |||
background-color: #2d3142 !important; | |||
background-color: # | color: #e5e7eb !important; | ||
border-collapse: collapse !important; | |||
} | } | ||
table th { | |||
background-color: #3a3f51 !important; | |||
background-color: | color: #ffffff !important; | ||
padding: 8px !important; | |||
border: 1px solid #4a5568 !important; | |||
} | } | ||
table td { | |||
padding: 8px !important; | |||
border: 1px solid #3a3f51 !important; | |||
} | } | ||
table tr:hover { | |||
color: # | background-color: #353847 !important; | ||
} | } | ||
.mw- | /* ==================== CODE BLOCKS ==================== */ | ||
color: # | code, | ||
pre, | |||
.mw-code { | |||
background-color: #1a1d29 !important; | |||
border: 1px solid #3a3f51 !important; | |||
color: #f3f4f6 !important; | |||
padding: 2px 6px !important; | |||
} | } | ||
pre { | |||
padding: 12px !important; | |||
} | } | ||
. | /* ==================== WARNING/INFO BOXES ==================== */ | ||
. | .mw-warning, | ||
color: # | .mw-message-box, | ||
.warningbox, | |||
.errorbox { | |||
background-color: #2d3142 !important; | |||
border: 1px solid #f59e0b !important; | |||
color: #e5e7eb !important; | |||
padding: 12px !important; | |||
} | } | ||
/* ==================== | /* ==================== FOOTER ==================== */ | ||
#footer { | |||
# | |||
background-color: #1a1d29 !important; | background-color: #1a1d29 !important; | ||
border-top: 2px solid #3a3f51 !important; | |||
color: #9ca3af !important; | |||
padding: 20px !important; | |||
} | } | ||
#footer a { | |||
color: #60a5fa !important; | |||
} | } | ||
#footer ul li { | |||
color: #9ca3af !important; | |||
} | } | ||
/* ==================== | /* ==================== DROPDOWN MENUS ==================== */ | ||
. | .dropdown, | ||
color: # | .dropdown .body { | ||
background-color: #2d3142 !important; | |||
border: 1px solid #3a3f51 !important; | |||
} | } | ||
.dropdown a { | |||
. | color: #e5e7eb !important; | ||
} | } | ||
. | .dropdown a:hover { | ||
background-color: # | background-color: #3a3f51 !important; | ||
} | } | ||
/* ==================== | /* ==================== SCROLLBARS ==================== */ | ||
# | * { | ||
scrollbar-color: #4a5568 #1a1d29; | |||
scrollbar-width: thin; | |||
} | } | ||
::-webkit-scrollbar { | |||
width: 12px; | |||
background-color: #1a1d29; | |||
} | } | ||
::-webkit-scrollbar-thumb { | |||
# | background-color: #4a5568; | ||
border: | border-radius: 6px; | ||
} | } | ||
::-webkit-scrollbar-thumb:hover { | |||
background-color: #5a6578; | |||
} | } | ||
/* | /* ==================== MISC ELEMENTS ==================== */ | ||
hr { | |||
border-color: #3a3f51 !important; | |||
border- | |||
} | } | ||
.mw-collapsible-toggle { | |||
color: #60a5fa !important; | |||
.mw- | |||
} | } | ||
/* | /* Diff pages */ | ||
.diff-addedline { | |||
background-color: #1e3a1e !important; | |||
} | } | ||
.diff-deletedline { | |||
. | background-color: #3a1e1e !important; | ||
} | } | ||
/* | /* Categories */ | ||
#catlinks { | |||
border: | background-color: #2d3142 !important; | ||
border: 1px solid #3a3f51 !important; | |||
} | } | ||
/* ==================== | /* ==================== FORCE OVERRIDE ANY REMAINING ISSUES ==================== */ | ||
div, span, section, article, aside { | |||
border-color: transparent !important; | |||
border | |||
} | } | ||
/* Keep only intentional borders */ | |||
border: | h1, h2, h3, h4, h5, h6 { | ||
border-bottom: 1px solid #3a3f51 !important; | |||
} | } | ||
#mw-header-container .color-left, | #mw-header-container .color-left, | ||
#mw-header-container .color-middle, | #mw-header-container .color-middle, | ||
#mw-header-container .color-right { | #mw-header-container .color-right { | ||
border-bottom: 2px solid !important; | border-bottom: 2px solid !important; | ||
} | } | ||
Revision as of 03:18, 19 January 2026
/* ==================== OMNIVERSE WIKI DARK THEME ==================== */
/* Complete custom theme to match omni-verse.us website */
/* ==================== BASE COLORS ==================== */
body {
background-color: #1a1d29 !important;
color: #e5e7eb !important;
}
/* ==================== MAIN CONTENT AREA ==================== */
#mw-content-container,
#mw-content-wrapper,
#mw-content,
.mw-body {
background-color: #2c3142 !important;
color: #e5e7eb !important;
}
.mw-parser-output {
color: #e5e7eb !important;
}
/* ==================== HEADER / TOP NAVIGATION ==================== */
#mw-header-container {
background-color: #2d3142 !important;
border-bottom: none !important;
}
#mw-header-container .color-left {
border-bottom: 2px solid #f59e0b !important;
}
#mw-header-container .color-middle {
border-bottom: 2px solid #3b82f6 !important;
}
#mw-header-container .color-right {
border-bottom: 2px solid #10b981 !important;
}
#mw-header {
background-color: #2d3142 !important;
}
/* Site title/logo */
#p-logo a,
.mw-wiki-title {
color: #ffffff !important;
}
/* ==================== SEARCH BAR ==================== */
#searchInput {
background-color: #1a1d29 !important;
color: #ffffff !important;
border: 1px solid #4a5568 !important;
}
#searchInput:focus {
border-color: #60a5fa !important;
outline: none !important;
}
.search-form {
background-color: transparent !important;
}
#searchButton {
background-color: #3b82f6 !important;
color: #ffffff !important;
}
/* ==================== USER MENU ==================== */
#personal,
#user-tools {
background-color: #2d3142 !important;
}
#personal ul li a,
#user-tools a {
color: #e5e7eb !important;
}
/* ==================== LEFT SIDEBAR - COMPLETE RESET ==================== */
#mw-site-navigation,
#mw-related-navigation,
#mw-navigation,
#mw-panel {
background-color: #1a1d29 !important;
}
/* Remove ALL borders from portlets */
.mw-portlet {
background-color: #1a1d29 !important;
border: 0 !important;
box-shadow: none !important;
outline: 0 !important;
margin-bottom: 1em !important;
}
/* Portlet headers (Navigation, Wiki tools, etc) */
.mw-portlet h3,
.mw-portlet-heading {
background-color: #1a1d29 !important;
color: #fbbf24 !important;
border: 0 !important;
padding: 8px 12px !important;
margin: 0 !important;
font-weight: bold !important;
}
/* Portlet body containers */
.mw-portlet .body,
.mw-portlet .mw-portlet-body,
.mw-portlet-body {
background-color: #1a1d29 !important;
border: 0 !important;
padding: 0 !important;
}
/* Sidebar links */
.mw-portlet .body ul,
.mw-portlet-body ul {
background-color: transparent !important;
margin: 0 !important;
list-style: none !important;
}
.mw-portlet .body ul li,
.mw-portlet-body ul li {
background-color: transparent !important;
padding: 6px 12px !important;
border: 0 !important;
}
.mw-portlet .body ul li a,
.mw-portlet-body ul li a {
color: #93c5fd !important;
text-decoration: none !important;
}
.mw-portlet .body ul li a:hover,
.mw-portlet-body ul li a:hover {
color: #ffffff !important;
}
.mw-portlet .body ul li:hover,
.mw-portlet-body ul li:hover {
background-color: #2d3142 !important;
}
/* ==================== PAGE TABS (Main Page, Discussion, Edit, etc) ==================== */
#p-namespaces ul,
#p-views ul {
background-color: transparent !important;
}
#p-namespaces ul li,
#p-views ul li {
background-color: #2d3142 !important;
border: 0 !important;
margin-right: 2px !important;
}
#p-namespaces ul li a,
#p-views ul li a {
color: #93c5fd !important;
padding: 8px 16px !important;
}
#p-namespaces ul li.selected,
#p-views ul li.selected {
background-color: #2c3142 !important;
border-bottom: 2px solid #fbbf24 !important;
}
#p-namespaces ul li:hover,
#p-views ul li:hover {
background-color: #3a3f51 !important;
}
/* ==================== TABLE OF CONTENTS ==================== */
.toc {
background-color: #2d3447 !important;
border: 0 !important;
padding: 12px !important;
}
.toc h2,
.toc .toctitle h2 {
color: #fbbf24 !important;
background-color: transparent !important;
border: 0 !important;
margin: 0 0 8px 0 !important;
}
.toc ul {
background-color: transparent !important;
margin: 0 !important;
}
.tocnumber {
color: #9ca3af !important;
}
.toctext {
color: #60a5fa !important;
}
.toc a {
color: #60a5fa !important;
}
/* ==================== RIGHT SIDEBAR - PAGE TOOLS ==================== */
#page-tools {
background-color: #1a1d29 !important;
border: 0 !important;
}
#page-tools .mw-portlet {
border: 0 !important;
}
#page-tools h3 {
background-color: #1a1d29 !important;
color: #fbbf24 !important;
border: 0 !important;
}
#page-tools .mw-portlet-body {
background-color: #1a1d29 !important;
}
#page-tools .body li a {
color: #93c5fd !important;
}
#page-tools .body li a:hover {
color: #ffffff !important;
background-color: #2d3142 !important;
}
/* ==================== LINKS ==================== */
a {
color: #60a5fa !important;
}
a:visited {
color: #a78bfa !important;
}
a:hover {
color: #93c5fd !important;
text-decoration: underline !important;
}
a.new {
color: #f87171 !important;
}
.mw-editsection,
.mw-editsection a {
color: #60a5fa !important;
}
/* ==================== HEADINGS ==================== */
h1, h2, h3, h4, h5, h6 {
color: #ffffff !important;
border-bottom: 1px solid #3a3f51 !important;
}
.mw-body h1.firstHeading {
color: #ffffff !important;
border-bottom: 2px solid #3a3f51 !important;
margin-bottom: 1em !important;
}
/* ==================== BUTTONS ==================== */
.mw-ui-button,
button,
input[type="submit"],
.oo-ui-buttonElement-button {
background-color: #3b82f6 !important;
color: #ffffff !important;
border: 1px solid #2563eb !important;
}
.mw-ui-button:hover,
button:hover,
input[type="submit"]:hover {
background-color: #2563eb !important;
}
/* ==================== FORMS & INPUTS ==================== */
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
background-color: #1a1d29 !important;
color: #ffffff !important;
border: 1px solid #4a5568 !important;
}
input[type="text"]:focus,
textarea:focus,
select:focus {
border-color: #60a5fa !important;
outline: none !important;
}
/* ==================== TABLES ==================== */
table {
background-color: #2d3142 !important;
color: #e5e7eb !important;
border-collapse: collapse !important;
}
table th {
background-color: #3a3f51 !important;
color: #ffffff !important;
padding: 8px !important;
border: 1px solid #4a5568 !important;
}
table td {
padding: 8px !important;
border: 1px solid #3a3f51 !important;
}
table tr:hover {
background-color: #353847 !important;
}
/* ==================== CODE BLOCKS ==================== */
code,
pre,
.mw-code {
background-color: #1a1d29 !important;
border: 1px solid #3a3f51 !important;
color: #f3f4f6 !important;
padding: 2px 6px !important;
}
pre {
padding: 12px !important;
}
/* ==================== WARNING/INFO BOXES ==================== */
.mw-warning,
.mw-message-box,
.warningbox,
.errorbox {
background-color: #2d3142 !important;
border: 1px solid #f59e0b !important;
color: #e5e7eb !important;
padding: 12px !important;
}
/* ==================== FOOTER ==================== */
#footer {
background-color: #1a1d29 !important;
border-top: 2px solid #3a3f51 !important;
color: #9ca3af !important;
padding: 20px !important;
}
#footer a {
color: #60a5fa !important;
}
#footer ul li {
color: #9ca3af !important;
}
/* ==================== DROPDOWN MENUS ==================== */
.dropdown,
.dropdown .body {
background-color: #2d3142 !important;
border: 1px solid #3a3f51 !important;
}
.dropdown a {
color: #e5e7eb !important;
}
.dropdown a:hover {
background-color: #3a3f51 !important;
}
/* ==================== SCROLLBARS ==================== */
* {
scrollbar-color: #4a5568 #1a1d29;
scrollbar-width: thin;
}
::-webkit-scrollbar {
width: 12px;
background-color: #1a1d29;
}
::-webkit-scrollbar-thumb {
background-color: #4a5568;
border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
background-color: #5a6578;
}
/* ==================== MISC ELEMENTS ==================== */
hr {
border-color: #3a3f51 !important;
}
.mw-collapsible-toggle {
color: #60a5fa !important;
}
/* Diff pages */
.diff-addedline {
background-color: #1e3a1e !important;
}
.diff-deletedline {
background-color: #3a1e1e !important;
}
/* Categories */
#catlinks {
background-color: #2d3142 !important;
border: 1px solid #3a3f51 !important;
}
/* ==================== FORCE OVERRIDE ANY REMAINING ISSUES ==================== */
div, span, section, article, aside {
border-color: transparent !important;
}
/* Keep only intentional borders */
h1, h2, h3, h4, h5, h6 {
border-bottom: 1px solid #3a3f51 !important;
}
#mw-header-container .color-left,
#mw-header-container .color-middle,
#mw-header-container .color-right {
border-bottom: 2px solid !important;
}
