MediaWiki:Common.css: Difference between revisions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* ===== | /* ===== 1. Base page background ===== */ | ||
:root, | |||
html, | html, | ||
body, | body, | ||
body.skin-minerva, | body.skin-minerva, | ||
.skin-minerva { | .skin-minerva { | ||
background-color: #1a1a1a !important; | background: #1a1a1a !important; | ||
color: #e0e0e0 !important; | |||
} | |||
/* ===== 2. Minerva outer wrappers (these cause white bars) ===== */ | |||
#mw-mf-viewport, | |||
#mw-wrapper, | |||
#mw-content, | |||
#mw-page-base, | |||
#mw-head-base, | |||
#mw-mf-page-center, | |||
.mw-body { | |||
background: #1a1a1a !important; | |||
color: #e0e0e0 !important; | |||
margin: 0 !important; | |||
border: 0 !important; | |||
} | |||
/* Sometimes Minerva adds extra containers on desktop width */ | |||
.minerva-background, | |||
.minerva-surface, | |||
.minerva-drawer, | |||
.minerva-post-content, | |||
.minerva-pre-content, | |||
.overlay, | |||
.panel, | |||
.drawer { | |||
background: #1a1a1a !important; | |||
color: #e0e0e0 !important; | color: #e0e0e0 !important; | ||
} | } | ||
/* ===== Header, user menu | /* ===== 3. Header, nav, search, user menu ===== */ | ||
.minerva-header, | .minerva-header, | ||
.navigation-drawer, | .navigation-drawer, | ||
#mw-mf-page-left, | #mw-mf-page-left, | ||
. | .minerva-user-navigation, | ||
.minerva-user-menu, | .minerva-user-menu, | ||
.minerva-user-menu .toggle-list__list { | .minerva-user-menu .toggle-list__list, | ||
background | .branding-box a { | ||
background: #141414 !important; | |||
color: #e0e0e0 !important; | color: #e0e0e0 !important; | ||
border-color: #222 !important; | border-color: #222 !important; | ||
} | } | ||
/* ===== Menu items ===== */ | /* ===== 4. Menu items ===== */ | ||
.toggle-list__list, | |||
.toggle-list-item__anchor { | .toggle-list-item__anchor { | ||
background: transparent !important; | |||
color: #e0e0e0 !important; | color: #e0e0e0 !important; | ||
} | } | ||
.toggle-list-item__anchor:hover { | .toggle-list-item__anchor:hover { | ||
| Line 31: | Line 59: | ||
} | } | ||
/* ===== Buttons and toggles ===== */ | /* ===== 5. Buttons and toggles ===== */ | ||
.cdx-button, | .cdx-button, | ||
.cdx-button--fake-button, | .cdx-button--fake-button, | ||
| Line 43: | Line 71: | ||
} | } | ||
/* ===== Search | /* ===== 6. Search box ===== */ | ||
.minerva-search-form .search-box { | .minerva-search-form .search-box { | ||
background: #222 !important; | background: #222 !important; | ||
| Line 56: | Line 84: | ||
} | } | ||
/* ===== | /* ===== 7. Content blocks ===== */ | ||
#content, | #content, | ||
#mw-content-text, | #mw-content-text, | ||
.skin-minerva .content, | .skin-minerva .content, | ||
.skin-minerva .pre-content, | .skin-minerva .pre-content, | ||
| Line 78: | Line 94: | ||
} | } | ||
/* ===== Tables and code ===== */ | /* ===== 8. Tables and code ===== */ | ||
.mw-parser-output table { | .mw-parser-output table { | ||
background | background: #222 !important; | ||
border-color: #333 !important; | border-color: #333 !important; | ||
color: #e0e0e0 !important; | color: #e0e0e0 !important; | ||
| Line 86: | Line 102: | ||
.mw-parser-output pre, | .mw-parser-output pre, | ||
.mw-parser-output code { | .mw-parser-output code { | ||
background | background: #2b2b2b !important; | ||
color: #d0d0d0 !important; | color: #d0d0d0 !important; | ||
border-radius: 3px; | border-radius: 3px; | ||
} | } | ||
/* ===== Footer and | /* ===== 9. Footer and bottom bar ===== */ | ||
.minerva-footer, | .minerva-footer, | ||
.footer, | .footer, | ||
#footer, | #footer, | ||
#footer-info { | #footer-info, | ||
#mw-mf-page-center + div, | |||
body > footer { | |||
background: #1a1a1a !important; | background: #1a1a1a !important; | ||
color: #ccc !important; | color: #ccc !important; | ||
| Line 101: | Line 119: | ||
} | } | ||
/* ===== | /* ===== 10. Mask behind open mobile menu ===== */ | ||
. | .main-menu-mask { | ||
background: rgba(0,0,0,0.6) !important; | |||
} | } | ||
. | /* ===== 11. Icons (turn light) ===== */ | ||
. | .minerva-icon { | ||
filter: invert(1) brightness(1.3); | |||
} | } | ||
/* ===== Links ===== */ | /* ===== 12. Links ===== */ | ||
a, | a, | ||
.mw-body a { | .mw-body a { | ||
color: #6ab0ff !important; | color: #6ab0ff !important; | ||
} | } | ||
a:visited { | a:visited { color: #9bb8ff !important; } | ||
a:hover { color: #9bc6ff !important; } | |||
} | |||
a:hover { | |||
} | |||
/* ===== Forms ===== */ | /* ===== 13. Forms ===== */ | ||
input, | input, | ||
textarea, | textarea, | ||
| Line 134: | Line 146: | ||
} | } | ||
/* ===== | /* ===== 14. Last resort for stubborn strips ===== */ | ||
: | html body > div:not([style]), | ||
html body > header:not([style]), | |||
html body > footer:not([style]) { | |||
background: #1a1a1a !important; | |||
: | |||
background: #1a1a1a; | |||
} | } | ||
/* ===== 15. Scrollbars (desktop) ===== */ | |||
::-webkit-scrollbar { width: 10px; } | |||
::-webkit-scrollbar-thumb { background: #444; } | |||
::-webkit-scrollbar-thumb:hover { background: #666; } | |||
::-webkit-scrollbar-track { background: #1a1a1a; } | |||
Revision as of 02:06, 2 November 2025
/* ===== 1. Base page background ===== */
:root,
html,
body,
body.skin-minerva,
.skin-minerva {
background: #1a1a1a !important;
color: #e0e0e0 !important;
}
/* ===== 2. Minerva outer wrappers (these cause white bars) ===== */
#mw-mf-viewport,
#mw-wrapper,
#mw-content,
#mw-page-base,
#mw-head-base,
#mw-mf-page-center,
.mw-body {
background: #1a1a1a !important;
color: #e0e0e0 !important;
margin: 0 !important;
border: 0 !important;
}
/* Sometimes Minerva adds extra containers on desktop width */
.minerva-background,
.minerva-surface,
.minerva-drawer,
.minerva-post-content,
.minerva-pre-content,
.overlay,
.panel,
.drawer {
background: #1a1a1a !important;
color: #e0e0e0 !important;
}
/* ===== 3. Header, nav, search, user menu ===== */
.minerva-header,
.navigation-drawer,
#mw-mf-page-left,
.minerva-user-navigation,
.minerva-user-menu,
.minerva-user-menu .toggle-list__list,
.branding-box a {
background: #141414 !important;
color: #e0e0e0 !important;
border-color: #222 !important;
}
/* ===== 4. Menu items ===== */
.toggle-list__list,
.toggle-list-item__anchor {
background: transparent !important;
color: #e0e0e0 !important;
}
.toggle-list-item__anchor:hover {
background: #222 !important;
}
/* ===== 5. Buttons and toggles ===== */
.cdx-button,
.cdx-button--fake-button,
.toggle-list__toggle {
background: #222 !important;
color: #e0e0e0 !important;
border: 1px solid #333 !important;
}
.cdx-button:hover {
background: #2a2a2a !important;
}
/* ===== 6. Search box ===== */
.minerva-search-form .search-box {
background: #222 !important;
border: 1px solid #333 !important;
}
.minerva-search-form input.search {
background: transparent !important;
color: #e0e0e0 !important;
}
.search-box-icon-overlay {
filter: invert(1);
}
/* ===== 7. Content blocks ===== */
#content,
#mw-content-text,
.skin-minerva .content,
.skin-minerva .pre-content,
.skin-minerva .post-content {
background: #1a1a1a !important;
color: #e0e0e0 !important;
}
/* ===== 8. Tables and code ===== */
.mw-parser-output table {
background: #222 !important;
border-color: #333 !important;
color: #e0e0e0 !important;
}
.mw-parser-output pre,
.mw-parser-output code {
background: #2b2b2b !important;
color: #d0d0d0 !important;
border-radius: 3px;
}
/* ===== 9. Footer and bottom bar ===== */
.minerva-footer,
.footer,
#footer,
#footer-info,
#mw-mf-page-center + div,
body > footer {
background: #1a1a1a !important;
color: #ccc !important;
border-top: 1px solid #333 !important;
}
/* ===== 10. Mask behind open mobile menu ===== */
.main-menu-mask {
background: rgba(0,0,0,0.6) !important;
}
/* ===== 11. Icons (turn light) ===== */
.minerva-icon {
filter: invert(1) brightness(1.3);
}
/* ===== 12. Links ===== */
a,
.mw-body a {
color: #6ab0ff !important;
}
a:visited { color: #9bb8ff !important; }
a:hover { color: #9bc6ff !important; }
/* ===== 13. Forms ===== */
input,
textarea,
select {
background: #222 !important;
color: #eee !important;
border: 1px solid #333 !important;
}
/* ===== 14. Last resort for stubborn strips ===== */
html body > div:not([style]),
html body > header:not([style]),
html body > footer:not([style]) {
background: #1a1a1a !important;
}
/* ===== 15. Scrollbars (desktop) ===== */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-thumb { background: #444; }
::-webkit-scrollbar-thumb:hover { background: #666; }
::-webkit-scrollbar-track { background: #1a1a1a; }