MediaWiki:Timeless.css: Difference between revisions
OMNIVERSE
No edit summary |
No edit summary |
||
| (53 intermediate revisions by the same user not shown) | |||
| Line 224: | Line 224: | ||
font-family: 'Karla', sans-serif !important; | font-family: 'Karla', sans-serif !important; | ||
font-size: 24px !important; /* Adjust size if needed */ | font-size: 24px !important; /* Adjust size if needed */ | ||
} | |||
/* ==================== REMOVE BOX FROM LOGO CONTAINER ==================== */ | |||
#p-logo-text, | |||
div#p-logo-text, | |||
#p-logo-text.mw-portlet { | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
background: transparent !important; | |||
} | } | ||
/* ==================== HEADINGS ==================== */ | /* ==================== HEADINGS ==================== */ | ||
| Line 320: | Line 329: | ||
/* ==================== TABLES ==================== */ | /* ==================== TABLES ==================== */ | ||
table { | .mw-parser-output table { | ||
background-color: #2d3142 !important; | background-color: #2d3142 !important; | ||
color: #e5e7eb !important; | color: #e5e7eb !important; | ||
} | } | ||
table th { | .mw-parser-output table th { | ||
background-color: #3a3f51 !important; | background-color: #3a3f51 !important; | ||
color: #ffffff !important; | color: #ffffff !important; | ||
} | } | ||
table | .mw-parser-output table th { | ||
border: 1px solid #3a3f51 !important; | border: 1px solid #3a3f51 !important; | ||
} | } | ||
| Line 429: | Line 438: | ||
} | } | ||
/* ==================== REMOVE BORDERS FROM PARENT CONTAINERS ==================== */ | /* ==================== REMOVE BORDERS FROM PARENT CONTAINERS ==================== */ | ||
/* ==================== REMOVE BORDERS FROM NAMESPACE/VIEW TABS ==================== */ | |||
.mw-portlet.tools-inline, | |||
#p-namespaces, | |||
#p-views, | |||
div[id^="p-namespaces"], | |||
div[id^="p-views"] { | |||
border: none !important; | |||
outline: none !important; | |||
box-shadow: none !important; | |||
background: transparent !important; | |||
} | |||
/* Remove borders from the portlet body inside */ | |||
.mw-portlet.tools-inline .mw-portlet-body, | |||
#p-namespaces .mw-portlet-body, | |||
#p-views .mw-portlet-body { | |||
border: none !important; | |||
} | |||
/* Keep the tab items styled but remove container borders */ | |||
.mw-portlet.tools-inline ul, | |||
#p-namespaces ul, | |||
#p-views ul { | |||
border: none !important; | |||
background: transparent !important; | |||
} | |||
#mw-navigation, | #mw-navigation, | ||
#mw-site-navigation, | #mw-site-navigation, | ||
| Line 500: | Line 535: | ||
/* Keep table borders */ | /* Keep table borders */ | ||
table td, | table td, | ||
table th { | .mw-parser-output table th { | ||
border: 1px solid #3a3f51 !important; | border: 1px solid #3a3f51 !important; | ||
} | } | ||
| Line 564: | Line 599: | ||
border: 1px solid #2d3142 !important; | border: 1px solid #2d3142 !important; | ||
} | } | ||
/* ==================== REMOVE BORDERS FROM PAGE TOOLS SIDEBAR | /* ==================== REMOVE BORDERS FROM PAGE TOOLS SIDEBAR =================== */ | ||
#page-tools .mw-portlet { | #page-tools .mw-portlet { | ||
border: none !important; | border: none !important; | ||
} | } | ||
#page-tools h3 { | #page-tools h3 { | ||
border: none !important; | border: none !important; | ||
| Line 751: | Line 785: | ||
padding: 6px 10px !important; | padding: 6px 10px !important; | ||
font-weight: bold !important; | font-weight: bold !important; | ||
height: | height: 100% !important; | ||
min-height: 0 !important; | min-height: 0 !important; | ||
position: absolute !important; | position: absolute !important; | ||
right: | right: 0 !important; | ||
} | |||
.mw-ui-button, | |||
button, | |||
input[type="submit"] { | |||
border: none !important; | |||
} | } | ||
#searchButton:hover { | #searchButton:hover { | ||
background-color: #fcd34d !important; | background-color: #fcd34d !important; | ||
| Line 810: | Line 846: | ||
padding-top: 0em !important; | padding-top: 0em !important; | ||
} | } | ||
/* ==================== REDUCE TABLE CELL SPACING ==================== */ | |||
table { | /* Remove default file figure spacing */ | ||
figure.mw-halign-left, | |||
figure.mw-halign-right, | |||
figure[typeof~="mw:File"], | |||
figure[typeof~="mw:File/frameless"] { | |||
margin: 0 !important; | |||
} | |||
/* Optional but recommended: stop float-based layout weirdness in tables */ | |||
.mw-parser-output table figure.mw-halign-left, | |||
.mw-parser-output table figure.mw-halign-right { | |||
float: none !important; | |||
clear: none !important; | |||
} | |||
/* ==================== REDUCE TABLE CELL SPACING (RENDERED ONLY) ==================== */ | |||
.mw-parser-output table { | |||
border-spacing: 0 !important; | |||
border-collapse: collapse !important; | |||
margin: 0 !important; | |||
} | |||
.mw-parser-output table tr { | |||
line-height: 1 !important; | |||
margin: 0 !important; | |||
} | |||
.mw-parser-output table td, | |||
.mw-parser-output table th { | |||
padding: 2px 6px !important; | |||
line-height: 1.2 !important; | |||
text-align: left !important; | |||
vertical-align: middle !important; | |||
text-indent: 0 !important; | |||
margin: 0 !important; | |||
} | |||
.mw-parser-output table tr:not(:first-child) td:first-child { | |||
padding-top: 2px !important; | |||
} | |||
.mw-parser-output table td p { | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
.mw-parser-output table td br { | |||
line-height: 0.8 !important; | |||
} | |||
.mw-parser-output table td > *, | |||
.mw-parser-output table th > * { | |||
margin-left: 0 !important; | |||
padding-left: 0 !important; | |||
text-indent: 0 !important; | |||
margin-top: 0 !important; | |||
margin-bottom: 0 !important; | |||
} | |||
.mw-parser-output table td li a, | |||
.mw-parser-output table td ul a, | |||
.mw-parser-output table td ol a { | |||
display: inline !important; | |||
padding-left: 0 !important; | |||
margin-left: 0 !important; | |||
} | |||
.mw-parser-output table td ol li { | |||
list-style-type: decimal !important; | |||
} | |||
/* Image column rules (RENDERED ONLY, no :has) */ | |||
.mw-parser-output table td .mw-file-element { | |||
display: block !important; | |||
width: auto !important; | |||
height: auto !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
border: 0 !important; | |||
} | |||
/* Link wrapper around images in wikitext tables */ | |||
.mw-parser-output table td > a.image, | |||
.mw-parser-output table td a.mw-file-description { | |||
display: block !important; | |||
line-height: 0 !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
} | |||
/* Remove any br tags after images */ | |||
.mw-parser-output table td img + br, | |||
.mw-parser-output table td img ~ br { | |||
display: none !important; | |||
} | |||
/* Tighten left gutter for bullets inside table cells */ | |||
.mw-parser-output table td ul, | |||
.mw-parser-output table td ol { | |||
list-style-position: outside !important; | |||
padding-left: 0.9em !important; /* reduce this value to pull bullets left */ | |||
margin: 0 !important; | |||
} | |||
.mw-parser-output table td li { | |||
margin-left: 0 !important; | |||
padding-left: 0 !important; | |||
} | } | ||
table | .mw-parser-output table td ul li, | ||
.mw-parser-output table td ol li { | |||
margin: | display: list-item !important; | ||
list-style-type: disc !important; | |||
margin-left: 1em !important; | |||
} | } | ||
table td | .mw-parser-output table td ol li { | ||
list-style-type: decimal !important; | |||
} | } | ||
/* | |||
table | /* ==================== VISUALEDITOR: MATCH RENDERED TABLE/LIST LOOK ==================== */ | ||
body.ve-activated .ve-ce-surface table { | |||
border-spacing: 0 !important; | |||
border-collapse: collapse !important; | |||
} | } | ||
body.ve-activated .ve-ce-surface table td, | |||
table | body.ve-activated .ve-ce-surface table th { | ||
padding: 2px 8px !important; | |||
line-height: 1.2 !important; | |||
vertical-align: middle !important; | |||
} | } | ||
table td | /* Match your rendered “tight cell” behavior */ | ||
body.ve-activated .ve-ce-surface table td > *, | |||
body.ve-activated .ve-ce-surface table th > * { | |||
margin-left: 0 !important; | |||
padding-left: 0 !important; | |||
text-indent: 0 !important; | |||
} | } | ||
/* | /* Match your rendered list behavior inside table cells */ | ||
body.ve-activated .ve-ce-surface table td ul, | |||
table td | body.ve-activated .ve-ce-surface table td ol { | ||
table | list-style-position: inside !important; | ||
padding-left: 0 !important; | |||
margin: 0.5em 0 !important; | |||
} | } | ||
body.ve-activated .ve-ce-surface table td ul li { | |||
table td ul | list-style-type: disc !important; | ||
margin-left: 1em !important; | |||
} | } | ||
body.ve-activated .ve-ce-surface table td ol li { | |||
table td li | list-style-type: decimal !important; | ||
margin-left: 1em !important; | |||
} | } | ||
/* ==================== | /* ==================== SEARCH RESULTS PAGE FIX ==================== */ | ||
table | |||
/* Container for search form - make it relative for positioning */ | |||
.searchresults #mw-search-top-table, | |||
.mw-search-form-wrapper, | |||
.mw-search-form, | |||
form#search, | |||
.mw-body .mw-search-form-wrapper { | |||
background-color: transparent !important; | |||
border: none !important; | |||
position: relative !important; | |||
} | } | ||
/* | /* Fieldset should position items for button-inside-input layout */ | ||
table | .mw-search-form fieldset, | ||
#mw-search-top-table, | |||
form#search, | |||
.mw-search-form-wrapper > form { | |||
display: block !important; | display: block !important; | ||
position: relative !important; | |||
border: none !important; | |||
padding: 0 !important; | |||
margin: 0 !important; | |||
max-width: 600px !important; | |||
} | |||
/* Target ALL possible search input variations on results page */ | |||
.mw-search-form input[type="search"], | |||
.mw-search-form input#searchText, | |||
input#searchText, | |||
input[name="search"], | |||
.mw-searchInput, | |||
.searchresults input[type="search"], | |||
.searchresults input[type="text"], | |||
form#search input[type="search"], | |||
form#search input[type="text"], | |||
.oo-ui-inputWidget input, | |||
.mw-body input[type="search"] { | |||
background-color: #2d3142 !important; | |||
color: #ffffff !important; | |||
border: 2px solid transparent !important; | |||
border-radius: 8px !important; | |||
padding: 10px 50px 10px 16px !important; | |||
outline: none !important; | |||
height: 44px !important; | |||
line-height: normal !important; | |||
font-size: 16px !important; | |||
width: 100% !important; | width: 100% !important; | ||
height: | box-sizing: border-box !important; | ||
} | |||
/* Focus state for search inputs */ | |||
.mw-search-form input[type="search"]:focus, | |||
.mw-search-form input#searchText:focus, | |||
input#searchText:focus, | |||
input[name="search"]:focus, | |||
.searchresults input[type="search"]:focus, | |||
.searchresults input[type="text"]:focus, | |||
.oo-ui-inputWidget input:focus, | |||
.mw-body input[type="search"]:focus { | |||
border-color: #fbbf24 !important; | |||
outline: none !important; | |||
box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.1) !important; | |||
} | |||
/* Target ALL possible search button variations - POSITION INSIDE INPUT */ | |||
.mw-search-form button[type="submit"], | |||
.mw-search-form input[type="submit"], | |||
button#mw-searchButton, | |||
.searchresults button, | |||
.searchresults input[type="submit"], | |||
form#search button, | |||
form#search input[type="submit"], | |||
.oo-ui-buttonElement button, | |||
.mw-body button[type="submit"], | |||
button.oo-ui-buttonElement-button { | |||
background-color: #fbbf24 !important; | |||
color: #1a1e29 !important; | |||
border: none !important; | |||
border-radius: 6px !important; | |||
padding: 6px 12px !important; | |||
font-weight: bold !important; | |||
height: 36px !important; | |||
line-height: normal !important; | |||
font-size: 14px !important; | |||
cursor: pointer !important; | |||
position: absolute !important; | |||
right: 4px !important; | |||
top: 50% !important; | |||
transform: translateY(-50%) !important; | |||
margin: 0 !important; | margin: 0 !important; | ||
padding: | z-index: 10 !important; | ||
} | |||
/* Button hover states */ | |||
.mw-search-form button[type="submit"]:hover, | |||
.mw-search-form input[type="submit"]:hover, | |||
button#mw-searchButton:hover, | |||
.searchresults button:hover, | |||
form#search button:hover, | |||
.mw-body button[type="submit"]:hover { | |||
background-color: #fcd34d !important; | |||
} | |||
/* Fix OOUI widget styling */ | |||
.oo-ui-inputWidget, | |||
.oo-ui-textInputWidget { | |||
background-color: transparent !important; | |||
border: none !important; | |||
position: relative !important; | |||
} | |||
.oo-ui-buttonElement { | |||
background-color: transparent !important; | |||
border: none !important; | |||
} | |||
/* ==================== FIX SEARCH PROFILE TABS BACKGROUND ==================== */ | |||
.mw-search-profile-tabs { | |||
background-color: #2d3142 !important; | |||
border: none !important; | |||
border-top: none !important; | |||
border-bottom: none !important; | |||
} | |||
/* ==================== FIX SEARCH INPUT TEXT PADDING ==================== */ | |||
.mw-search-visualclear input[type="search"] { | |||
padding-left: 35px !important; | |||
} | |||
/* ==================== CLEAN UP SEARCH RESULTS DISPLAY ==================== */ | |||
/* Hide or minimize raw HTML/wikitext in search result snippets */ | |||
.searchresult { | |||
color: #9ca3af !important; | |||
line-height: 1.6 !important; | |||
font-size: 14px !important; | |||
} | |||
/* Try to hide inline style attributes that appear in results */ | |||
.searchresult span[style*="color"] { | |||
color: #9ca3af !important; | |||
background: none !important; | |||
} | |||
/* Hide the raw <span> tags and markup if they're visible */ | |||
.searchresult { | |||
white-space: normal !important; | |||
} | |||
/* Style the search result title links */ | |||
.mw-search-result-heading, | |||
.mw-search-result-heading a { | |||
color: #60a5fa !important; | |||
font-size: 18px !important; | |||
font-weight: 600 !important; | |||
text-decoration: none !important; | |||
} | |||
.mw-search-result-heading a:hover { | |||
color: #93c5fd !important; | |||
text-decoration: underline !important; | |||
} | |||
/* Style the search result metadata (size, date) */ | |||
.mw-search-result-data { | |||
color: #6b7280 !important; | |||
font-size: 12px !important; | |||
margin-top: 4px !important; | |||
} | |||
/* Add spacing between search results */ | |||
.mw-search-result, | |||
.mw-search-results li { | |||
margin-bottom: 24px !important; | |||
padding-bottom: 16px !important; | |||
border-bottom: 1px solid #3a3f51 !important; | |||
} | |||
.mw-search-results li:last-child { | |||
border-bottom: none !important; | |||
} | |||
/* Style the results count text */ | |||
.results-info, | |||
.mw-search-results-info, | |||
.mw-search-createlink { | |||
color: #9ca3af !important; | |||
margin-bottom: 16px !important; | |||
font-size: 14px !important; | |||
} | } | ||
/* | /* Clean up the snippet text appearance */ | ||
.searchresult span { | |||
background: none !important; | |||
} | } | ||
/* | /* Make search match highlights visible but not harsh */ | ||
.searchmatch { | |||
background-color: rgba(251, 191, 36, 0.2) !important; | |||
color: #fbbf24 !important; | |||
font-weight: 600 !important; | |||
padding: 1px 2px !important; | |||
} | } | ||
Latest revision as of 02:46, 2 February 2026
/* ==================== OMNIVERSE WIKI DARK THEME ==================== */
@import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;700&display=swap');
/* ==================== CHANGE ALL FONTS TO KARLA ==================== */
* {
font-family: 'Karla', sans-serif !important;
}
body,
html {
font-family: 'Karla', sans-serif !important;
}
/* ==================== BASE COLORS ==================== */
body {
background-color: #1a1e29 !important;
color: #e5e7eb !important;
}
/* ==================== MAIN CONTENT AREA ==================== */
#mw-content-container,
#mw-content-wrapper,
#mw-content,
.mw-body {
background-color: #1f2637 !important;
color: #e5e7eb !important;
}
.mw-parser-output {
color: #e5e7eb !important;
}
/* ==================== HEADER / TOP NAVIGATION ==================== */
#mw-header-container {
background-color: #2d3142 !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;
}
/* ==================== SEARCH BAR ==================== */
#searchInput {
background-color: #1a1e29 !important;
color: #ffffff !important;
border: 1px solid #4a5568 !important;
}
#searchInput:focus {
border-color: #60a5fa !important;
outline: none !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 ==================== */
#mw-site-navigation,
#mw-related-navigation {
background-color: #1a1e29 !important;
}
.mw-portlet {
background-color: #1a1e29 !important;
border: none !important;
margin-bottom: 1em !important;
}
.mw-portlet h3 {
background-color: #1a1e29 !important;
color: #ffb92a !important;
border: none !important;
padding: 8px 12px !important;
}
.mw-portlet .body,
.mw-portlet .mw-portlet-body {
background-color: #1a1e29 !important;
border: none !important;
}
.mw-portlet .body ul li {
padding: 6px 12px !important;
}
.mw-portlet .body ul li a {
color: #93c5fd !important;
}
.mw-portlet .body ul li a:hover {
color: #ffffff !important;
}
.mw-portlet .body ul li:hover {
background-color: #2d3142 !important;
}
/* ==================== PAGE TABS ==================== */
#p-namespaces ul li,
#p-views ul li {
background-color: #2d3142 !important;
}
#p-namespaces ul li a,
#p-views ul li a {
color: #93c5fd !important;
}
#p-namespaces ul li.selected,
#p-views ul li.selected {
background-color: #1f2637 !important;
border-bottom: 2px solid #ffb92a !important;
}
/* ==================== TABLE OF CONTENTS ==================== */
.toc {
background-color: #2E3548 !important;
border: 1px solid #3a3f51 !important;
padding: 12px !important;
}
.toc h2 {
color: #ffb92a !important;
background-color: transparent !important;
}
.toc a {
color: #60a5fa !important;
}
/* Style the "hide" button */
.toctogglelabel,
.toctogglespan,
.toc .toctogglelabel {
color: #60a5fa !important;
}
.toctogglelabel:hover {
color: #93c5fd !important;
}
/* Balance the left and right spacing */
.toc ul {
margin-left: 0 !important;
margin-right: 0 !important;
padding-left: 20px !important; /* Increase left padding */
padding-right: 20px !important; /* Add right padding to balance */
}
.toc .toctitle {
text-align: left !important;
padding-left: 20px !important; /* Match the list padding */
}
/* ==================== RIGHT SIDEBAR - PAGE TOOLS ==================== */
#page-tools {
background-color: #1a1e29 !important;
border: none !important;
}
#page-tools h3 {
color: #ffb92a !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: #60a5fa !important;
}
a:hover {
color: #93c5fd !important;
}
a.new {
color: #F54927 !important;
}
/* Allow wrapper color (e.g., <span style="color:...">[[Link]]</span>) to override link color */
span[style*="color"] > a,
span[style*="color"] > a:visited,
span[style*="color"] > a:hover {
color: inherit !important;
}
/* ==================== MAKE LOGO TEXT GOLD ==================== */
.mw-wiki-title,
#p-banner a,
a.mw-wiki-title {
color: #ffb92a !important;
font-family: 'Karla', sans-serif !important;
font-size: 24px !important; /* Adjust size if needed */
}
/* ==================== REMOVE BOX FROM LOGO CONTAINER ==================== */
#p-logo-text,
div#p-logo-text,
#p-logo-text.mw-portlet {
border: none !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* ==================== HEADINGS ==================== */
h1, h2, h3, h4, h5, h6 {
color: #ffffff !important;
border-bottom: 1px solid #3a3f51 !important;
}
/* ==================== MAKE ALL HEADERS GOLD ==================== */
h1, h2, h3, h4, h5, h6,
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3 {
color: #fbbf24 !important;
}
/* ==================== ADD GOLD UNDERLINES TO PAGE TITLE ==================== */
.mw-first-heading,
#firstHeading {
position: relative !important;
padding-bottom: 4px !important;
border-bottom: 1px solid #3a3f51 !important;
margin-bottom: 12px !important; /* Add this */
}
.mw-first-heading::after,
#firstHeading::after {
content: '' !important;
position: absolute !important;
bottom: -1px !important;
left: 0 !important;
width: 30px !important;
height: 3px !important;
background-color: #fbbf24 !important;
}
/* ==================== ADD GOLD UNDERLINES TO PAGE HEADINGS ==================== */
.mw-parser-output h1,
.mw-parser-output h2 {
position: relative !important;
padding-bottom: 2px !important;
border-bottom: 1px solid #3a3f51 !important;
margin-bottom: 0.2em !important; /* Add this to control space below */
}
.mw-parser-output h1::after,
.mw-parser-output h2::after {
content: '' !important;
position: absolute !important;
bottom: -1px !important;
left: 0 !important;
width: 30px !important;
height: 3px !important;
background-color: #fbbf24 !important;
}
/* Remove underlines from h3 and below */
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6 {
border-bottom: none !important;
padding-bottom: 0 !important;
}
/* ==================== REMOVE UNDERLINE FROM CONTENTS ==================== */
.toc h2::after,
#toc h2::after {
display: none !important;
}
/* ==================== BUTTONS ==================== */
.mw-ui-button,
button,
input[type="submit"] {
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"],
textarea {
background-color: #1a1e29 !important;
color: #ffffff !important;
border: 1px solid #4a5568 !important;
}
input[type="text"]:focus,
textarea:focus {
border-color: #60a5fa !important;
}
/* ==================== TABLES ==================== */
.mw-parser-output table {
background-color: #2d3142 !important;
color: #e5e7eb !important;
}
.mw-parser-output table th {
background-color: #3a3f51 !important;
color: #ffffff !important;
}
.mw-parser-output table th {
border: 1px solid #3a3f51 !important;
}
/* ==================== CODE BLOCKS ==================== */
code,
pre {
background-color: #1a1e29 !important;
border: 1px solid #3a3f51 !important;
color: #f3f4f6 !important;
}
/* ==================== FOOTER ==================== */
#footer {
background-color: #1a1e29 !important;
border-top: 2px solid #3a3f51 !important;
color: #9ca3af !important;
}
#footer a {
color: #60a5fa !important;
}
/* ==================== SCROLLBARS ==================== */
::-webkit-scrollbar {
background-color: #1a1e29;
}
::-webkit-scrollbar-thumb {
background-color: #4a5568;
}
/* ==================== NUCLEAR OPTION FOR SIDEBAR BOXES ==================== */
/* Force everything in the sidebar to be dark */
#mw-site-navigation *,
#mw-related-navigation * {
background-color: #1a1e29 !important;
}
/* But keep the header gold */
.mw-portlet h3,
.mw-portlet h3 * {
background-color: #1a1e29 !important;
color: #ffb92a !important;
}
/* Specifically target these IDs */
div#p-navigation,
div#p-tb,
#navigation,
#Wiki\.tools {
background-color: #1a1e29 !important;
}
/* Try targeting by class patterns */
[class*="portlet"],
[class*="portal"],
[id*="portlet"],
[id*="portal"] {
background-color: #1a1e29 !important;
}
/* ==================== REMOVE SIDEBAR BOX BORDERS & BACKGROUNDS ==================== */
/* The boxes have a border that creates the "frame" effect */
.mw-portlet {
border: none !important;
box-shadow: none !important;
outline: none !important;
}
/* Remove the border from the outer container */
#mw-site-navigation .mw-portlet,
#mw-related-navigation .mw-portlet {
border: 0 !important;
}
/* Target the specific border style Timeless uses */
.mw-portlet.emptyPortlet {
border: none !important;
}
/* If there's a wrapper div creating the border */
#mw-panel > .mw-portlet,
#mw-site-navigation > .mw-portlet,
#mw-related-navigation > .mw-portlet {
border: 0 !important;
outline: 0 !important;
}
/* Remove any box-shadow effects */
.mw-portlet,
.mw-portlet * {
box-shadow: none !important;
}
/* Timeless might use these classes for the box styling */
.mw-portlet.persistent,
.mw-portlet-persistent {
border: none !important;
}
/* ==================== REMOVE BORDERS FROM PARENT CONTAINERS ==================== */
/* ==================== REMOVE BORDERS FROM NAMESPACE/VIEW TABS ==================== */
.mw-portlet.tools-inline,
#p-namespaces,
#p-views,
div[id^="p-namespaces"],
div[id^="p-views"] {
border: none !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* Remove borders from the portlet body inside */
.mw-portlet.tools-inline .mw-portlet-body,
#p-namespaces .mw-portlet-body,
#p-views .mw-portlet-body {
border: none !important;
}
/* Keep the tab items styled but remove container borders */
.mw-portlet.tools-inline ul,
#p-namespaces ul,
#p-views ul {
border: none !important;
background: transparent !important;
}
#mw-navigation,
#mw-site-navigation,
#mw-related-navigation {
border: none !important;
}
#mw-navigation > *,
#mw-site-navigation > *,
#mw-related-navigation > * {
border: none !important;
}
/* Style the headers with a slightly different shade */
.mw-portlet h3 {
background-color: #2d3142 !important;
color: #ffb92a !important;
border: none !important;
border-bottom: 1px solid #3a3f51 !important;
padding: 10px 12px !important;
margin: 0 !important;
border-radius: 4px 4px 0 0 !important;
}
/* Keep the body dark but distinct */
.mw-portlet .body,
.mw-portlet .mw-portlet-body {
background-color: #1a1e29 !important;
border: none !important;
padding: 8px 0 !important;
}
/* Add some padding to the links */
.mw-portlet .body ul li {
padding: 6px 12px !important;
margin: 0 !important;
}
/* Hover effect */
.mw-portlet .body ul li:hover {
background-color: #252936 !important;
}
/* ==================== NUCLEAR OPTION FOR VERTICAL LINES ==================== */
/* Remove all vertical borders globally */
* {
border-left: none !important;
border-right: none !important;
}
/* But keep the horizontal ones we want */
.mw-portlet {
border: 1px solid #2d3142 !important;
}
.mw-portlet h3 {
border-bottom: 1px solid #3a3f51 !important;
}
h1, h2, h3, h4, h5, h6 {
border-bottom: 1px solid #3a3f51 !important;
border-left: none !important;
border-right: none !important;
}
#footer {
border-top: 2px solid #3a3f51 !important;
border-left: none !important;
border-right: none !important;
}
/* Keep table borders */
table td,
.mw-parser-output table th {
border: 1px solid #3a3f51 !important;
}
/* Restore the top colored lines */
#mw-header-container .color-left,
#mw-header-container .color-middle,
#mw-header-container .color-right {
border-bottom: 2px solid !important;
}
/* ==================== REMOVE ALL BACKGROUNDS FROM TAB AREAS ==================== */
/* Target every possible container */
#p-namespaces,
#p-namespaces *,
#p-views,
#p-views * {
background: transparent !important;
background-color: transparent !important;
}
/* Except the actual tab buttons themselves */
#p-namespaces ul li,
#p-views ul li {
background-color: #2d3142 !important;
}
#p-namespaces ul li.selected,
#p-views ul li.selected {
background-color: #1f2637 !important;
border-bottom: 2px solid #ffb92a !important;
}
/* ==================== FIX TAB SPACING ==================== */
#p-namespaces ul li,
#p-views ul li {
padding: 8px 16px !important; /* Adjust these values to make it tighter */
margin: 0 !important;
}
/* Make the box fit tighter to the text */
#p-namespaces ul li a,
#p-views ul li a {
padding: 0 !important;
}
/* ==================== TARGET THE WRAPPER DIVS ==================== */
div#p-namespaces,
div#p-views {
background: none !important;
}
/* Target by class if it exists */
.mw-portlet.emptyPortlet {
background: transparent !important;
}
/* ==================== REMOVE PAGE TOOLS OUTLINES ==================== */
#page-tools,
#page-tools * {
outline: none !important;
}
#page-tools .mw-portlet {
background-color: #1a1e29 !important;
border: 1px solid #2d3142 !important;
}
/* ==================== REMOVE BORDERS FROM PAGE TOOLS SIDEBAR =================== */
#page-tools .mw-portlet {
border: none !important;
}
#page-tools h3 {
border: none !important;
border-bottom: none !important;
}
/* Remove rounded corners too */
#page-tools .mw-portlet {
border-radius: 0 !important;
}
#page-tools h3 {
border-radius: 0 !important;
}
/* ==================== RESTORE HEADER UNDERLINES ==================== */
#page-tools h3 {
border: none !important;
border-bottom: 1px solid #3a3f51 !important;
border-radius: 0 !important;
padding-bottom: 8px !important;
}
/* Also restore them for left sidebar headers if needed */
.mw-portlet h3 {
border-bottom: 1px solid #3a3f51 !important;
}
/* ==================== INCREASE HEADER FONT SIZE ==================== */
.mw-portlet h3,
#page-tools h3 {
font-size: 16px !important;
font-weight: bold !important;
}
/* ==================== STYLED HEADER UNDERLINES ==================== */
/* For left sidebar headers (Navigation, Wiki tools) */
#mw-site-navigation .mw-portlet h3::after,
#mw-related-navigation .mw-portlet h3::after {
content: '' !important;
position: absolute !important;
bottom: 0 !important;
left: 12px !important;
width: 40px !important;
height: 2px !important;
background-color: #ffb92a !important;
}
#mw-site-navigation .mw-portlet h3,
#mw-related-navigation .mw-portlet h3 {
position: relative !important;
}
/* For right sidebar headers (Page tools, More) */
#page-tools h3::after {
content: '' !important;
position: absolute !important;
bottom: 0 !important;
left: 0 !important;
width: 40px !important;
height: 2px !important;
background-color: #ffb92a !important;
}
#page-tools h3 {
position: relative !important;
}
/* ==================== REMOVE OLD FULL-WIDTH UNDERLINES ==================== */
#mw-site-navigation .mw-portlet h3,
#mw-related-navigation .mw-portlet h3,
#page-tools h3 {
border-bottom: none !important;
}
/* ==================== UNIFY HEADER LINES WITH DARK HEADER ==================== */
/* Header background (authoritative) */
#mw-header-container,
#mw-header,
#mw-header-hack {
background-color: #1a1e29 !important;
}
/* Top segmented color bars */
#mw-header-hack .color-left,
#mw-header-hack .color-middle,
#mw-header-hack .color-right,
.color-bar {
background-color: #1a1e29 !important;
}
/* Any borders used as accent lines */
#mw-header-container,
#mw-header-hack {
border-top-color: #1a1e29 !important;
border-bottom-color: #1a1e29 !important;
}
/* ==================== REMOVE BOXES FROM LIST ITEMS ==================== */
.mw-list-item {
border: none !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
li.mw-list-item,
#p-namespaces .mw-list-item,
#p-views .mw-list-item {
border: none !important;
border-radius: 0 !important;
background: none !important;
}
/* ==================== REMOVE USER MENU BOX ==================== */
#user-tools,
#personal,
.user-links {
background-color: transparent !important;
border: none !important;
box-shadow: none !important;
}
/* ==================== REMOVE SIDEBAR INDENTATION ==================== */
.mw-portlet,
#p-navigation,
div[role="navigation"] {
padding-left: 0 !important;
margin-left: 0 !important;
}
.mw-portlet-body {
padding-left: 0 !important;
margin-left: 0 !important;
}
/* Target the ul and li elements */
.mw-portlet-body ul {
padding-left: 0 !important;
margin-left: 0 !important;
list-style-position: inside !important;
}
.mw-portlet-body ul li {
padding-left: 10px !important;
margin-left: 0 !important;
}
/* ==================== SEARCH BAR CONTAINER ==================== */
#p-search,
#simpleSearch,
.search-container,
#searchform {
background-color: #1a1e29 !important;
border: none !important;
position: relative !important;
display: block !important;
}
/* Remove blue background from search button wrapper */
#p-search .mw-searchButton,
#p-search form,
.search-wrapper {
background-color: transparent !important;
}
#searchInput {
background-color: #2d3142 !important;
color: #ffffff !important;
border: 2px solid transparent !important;
border-radius: 8px !important;
padding: 10px 50px 10px 16px !important; /* Extra padding on right for button */
outline: none !important;
width: 100% !important;
}
#searchInput:focus {
border-color: #fbbf24 !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.1) !important;
}
#searchButton,
.searchButton,
button[type="submit"] {
background-color: #fbbf24 !important;
color: #1a1e29 !important;
border: none !important;
border-radius: 6px !important;
padding: 6px 10px !important;
font-weight: bold !important;
height: 100% !important;
min-height: 0 !important;
position: absolute !important;
right: 0 !important;
}
.mw-ui-button,
button,
input[type="submit"] {
border: none !important;
}
#searchButton:hover {
background-color: #fcd34d !important;
}
/* ==================== USER MENU - Keep text gold ==================== */
#user-tools a,
#personal a {
color: #fbbf24 !important;
}
/* ==================== REDUCE HEADER SPACING ==================== */
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
margin-top: 0.5em !important;
margin-bottom: 0em !important;
padding-bottom: 0px !important;
}
/* Keep padding for h1 and h2 with gold underlines */
.mw-parser-output h1,
.mw-parser-output h2,
.mw-body h1,
.mw-body h2 {
padding-bottom: 2px !important;
margin-bottom: 0.3em !important; /* Add space below h1 and h2 */
}
/* Small spacing after all headers */
.mw-parser-output h2 + *,
.mw-parser-output h3 + *,
.mw-parser-output h4 + *,
.mw-parser-output h5 + *,
.mw-parser-output h6 + * {
margin-top: 0.2em !important; /* Small but visible gap */
padding-top: 0em !important;
}
/* Control paragraph spacing */
.mw-parser-output p,
.mw-body p {
margin-top: 0.2em !important; /* Small gap */
padding-top: 0em !important;
}
/* Remove default file figure spacing */
figure.mw-halign-left,
figure.mw-halign-right,
figure[typeof~="mw:File"],
figure[typeof~="mw:File/frameless"] {
margin: 0 !important;
}
/* Optional but recommended: stop float-based layout weirdness in tables */
.mw-parser-output table figure.mw-halign-left,
.mw-parser-output table figure.mw-halign-right {
float: none !important;
clear: none !important;
}
/* ==================== REDUCE TABLE CELL SPACING (RENDERED ONLY) ==================== */
.mw-parser-output table {
border-spacing: 0 !important;
border-collapse: collapse !important;
margin: 0 !important;
}
.mw-parser-output table tr {
line-height: 1 !important;
margin: 0 !important;
}
.mw-parser-output table td,
.mw-parser-output table th {
padding: 2px 6px !important;
line-height: 1.2 !important;
text-align: left !important;
vertical-align: middle !important;
text-indent: 0 !important;
margin: 0 !important;
}
.mw-parser-output table tr:not(:first-child) td:first-child {
padding-top: 2px !important;
}
.mw-parser-output table td p {
margin: 0 !important;
padding: 0 !important;
}
.mw-parser-output table td br {
line-height: 0.8 !important;
}
.mw-parser-output table td > *,
.mw-parser-output table th > * {
margin-left: 0 !important;
padding-left: 0 !important;
text-indent: 0 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.mw-parser-output table td li a,
.mw-parser-output table td ul a,
.mw-parser-output table td ol a {
display: inline !important;
padding-left: 0 !important;
margin-left: 0 !important;
}
.mw-parser-output table td ol li {
list-style-type: decimal !important;
}
/* Image column rules (RENDERED ONLY, no :has) */
.mw-parser-output table td .mw-file-element {
display: block !important;
width: auto !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
/* Link wrapper around images in wikitext tables */
.mw-parser-output table td > a.image,
.mw-parser-output table td a.mw-file-description {
display: block !important;
line-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
/* Remove any br tags after images */
.mw-parser-output table td img + br,
.mw-parser-output table td img ~ br {
display: none !important;
}
/* Tighten left gutter for bullets inside table cells */
.mw-parser-output table td ul,
.mw-parser-output table td ol {
list-style-position: outside !important;
padding-left: 0.9em !important; /* reduce this value to pull bullets left */
margin: 0 !important;
}
.mw-parser-output table td li {
margin-left: 0 !important;
padding-left: 0 !important;
}
.mw-parser-output table td ul li,
.mw-parser-output table td ol li {
display: list-item !important;
list-style-type: disc !important;
margin-left: 1em !important;
}
.mw-parser-output table td ol li {
list-style-type: decimal !important;
}
/* ==================== VISUALEDITOR: MATCH RENDERED TABLE/LIST LOOK ==================== */
body.ve-activated .ve-ce-surface table {
border-spacing: 0 !important;
border-collapse: collapse !important;
}
body.ve-activated .ve-ce-surface table td,
body.ve-activated .ve-ce-surface table th {
padding: 2px 8px !important;
line-height: 1.2 !important;
vertical-align: middle !important;
}
/* Match your rendered “tight cell” behavior */
body.ve-activated .ve-ce-surface table td > *,
body.ve-activated .ve-ce-surface table th > * {
margin-left: 0 !important;
padding-left: 0 !important;
text-indent: 0 !important;
}
/* Match your rendered list behavior inside table cells */
body.ve-activated .ve-ce-surface table td ul,
body.ve-activated .ve-ce-surface table td ol {
list-style-position: inside !important;
padding-left: 0 !important;
margin: 0.5em 0 !important;
}
body.ve-activated .ve-ce-surface table td ul li {
list-style-type: disc !important;
margin-left: 1em !important;
}
body.ve-activated .ve-ce-surface table td ol li {
list-style-type: decimal !important;
margin-left: 1em !important;
}
/* ==================== SEARCH RESULTS PAGE FIX ==================== */
/* Container for search form - make it relative for positioning */
.searchresults #mw-search-top-table,
.mw-search-form-wrapper,
.mw-search-form,
form#search,
.mw-body .mw-search-form-wrapper {
background-color: transparent !important;
border: none !important;
position: relative !important;
}
/* Fieldset should position items for button-inside-input layout */
.mw-search-form fieldset,
#mw-search-top-table,
form#search,
.mw-search-form-wrapper > form {
display: block !important;
position: relative !important;
border: none !important;
padding: 0 !important;
margin: 0 !important;
max-width: 600px !important;
}
/* Target ALL possible search input variations on results page */
.mw-search-form input[type="search"],
.mw-search-form input#searchText,
input#searchText,
input[name="search"],
.mw-searchInput,
.searchresults input[type="search"],
.searchresults input[type="text"],
form#search input[type="search"],
form#search input[type="text"],
.oo-ui-inputWidget input,
.mw-body input[type="search"] {
background-color: #2d3142 !important;
color: #ffffff !important;
border: 2px solid transparent !important;
border-radius: 8px !important;
padding: 10px 50px 10px 16px !important;
outline: none !important;
height: 44px !important;
line-height: normal !important;
font-size: 16px !important;
width: 100% !important;
box-sizing: border-box !important;
}
/* Focus state for search inputs */
.mw-search-form input[type="search"]:focus,
.mw-search-form input#searchText:focus,
input#searchText:focus,
input[name="search"]:focus,
.searchresults input[type="search"]:focus,
.searchresults input[type="text"]:focus,
.oo-ui-inputWidget input:focus,
.mw-body input[type="search"]:focus {
border-color: #fbbf24 !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.1) !important;
}
/* Target ALL possible search button variations - POSITION INSIDE INPUT */
.mw-search-form button[type="submit"],
.mw-search-form input[type="submit"],
button#mw-searchButton,
.searchresults button,
.searchresults input[type="submit"],
form#search button,
form#search input[type="submit"],
.oo-ui-buttonElement button,
.mw-body button[type="submit"],
button.oo-ui-buttonElement-button {
background-color: #fbbf24 !important;
color: #1a1e29 !important;
border: none !important;
border-radius: 6px !important;
padding: 6px 12px !important;
font-weight: bold !important;
height: 36px !important;
line-height: normal !important;
font-size: 14px !important;
cursor: pointer !important;
position: absolute !important;
right: 4px !important;
top: 50% !important;
transform: translateY(-50%) !important;
margin: 0 !important;
z-index: 10 !important;
}
/* Button hover states */
.mw-search-form button[type="submit"]:hover,
.mw-search-form input[type="submit"]:hover,
button#mw-searchButton:hover,
.searchresults button:hover,
form#search button:hover,
.mw-body button[type="submit"]:hover {
background-color: #fcd34d !important;
}
/* Fix OOUI widget styling */
.oo-ui-inputWidget,
.oo-ui-textInputWidget {
background-color: transparent !important;
border: none !important;
position: relative !important;
}
.oo-ui-buttonElement {
background-color: transparent !important;
border: none !important;
}
/* ==================== FIX SEARCH PROFILE TABS BACKGROUND ==================== */
.mw-search-profile-tabs {
background-color: #2d3142 !important;
border: none !important;
border-top: none !important;
border-bottom: none !important;
}
/* ==================== FIX SEARCH INPUT TEXT PADDING ==================== */
.mw-search-visualclear input[type="search"] {
padding-left: 35px !important;
}
/* ==================== CLEAN UP SEARCH RESULTS DISPLAY ==================== */
/* Hide or minimize raw HTML/wikitext in search result snippets */
.searchresult {
color: #9ca3af !important;
line-height: 1.6 !important;
font-size: 14px !important;
}
/* Try to hide inline style attributes that appear in results */
.searchresult span[style*="color"] {
color: #9ca3af !important;
background: none !important;
}
/* Hide the raw <span> tags and markup if they're visible */
.searchresult {
white-space: normal !important;
}
/* Style the search result title links */
.mw-search-result-heading,
.mw-search-result-heading a {
color: #60a5fa !important;
font-size: 18px !important;
font-weight: 600 !important;
text-decoration: none !important;
}
.mw-search-result-heading a:hover {
color: #93c5fd !important;
text-decoration: underline !important;
}
/* Style the search result metadata (size, date) */
.mw-search-result-data {
color: #6b7280 !important;
font-size: 12px !important;
margin-top: 4px !important;
}
/* Add spacing between search results */
.mw-search-result,
.mw-search-results li {
margin-bottom: 24px !important;
padding-bottom: 16px !important;
border-bottom: 1px solid #3a3f51 !important;
}
.mw-search-results li:last-child {
border-bottom: none !important;
}
/* Style the results count text */
.results-info,
.mw-search-results-info,
.mw-search-createlink {
color: #9ca3af !important;
margin-bottom: 16px !important;
font-size: 14px !important;
}
/* Clean up the snippet text appearance */
.searchresult span {
background: none !important;
}
/* Make search match highlights visible but not harsh */
.searchmatch {
background-color: rgba(251, 191, 36, 0.2) !important;
color: #fbbf24 !important;
font-weight: 600 !important;
padding: 1px 2px !important;
}
