Last active
April 30, 2022 15:20
-
-
Save naclsn/ab022b6d63d9ebb1deecf2c63c6197e1 to your computer and use it in GitHub Desktop.
Quick and dirty custom CSS / user style for Wikipedia's "Vector" skin (tested on en.wikipedia.org and fr.wikipedia.org).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.mw-page-container { | |
background-color: #1e1e1e; | |
border-left: 1px solid #111; | |
border-right: 1px solid #111; | |
} | |
#mw-panel { | |
border-right: 1px solid #333; | |
} | |
#mw-page-base { | |
background: #151515; | |
} | |
.mw-body { | |
border-color: #54595d; | |
border-top: 1px solid #333; | |
color: #d4d4d4; | |
background-color: #1e1e1e; | |
} | |
.mw-footer li { | |
color: #93999f; | |
} | |
.mwe-popups { | |
background-color: #1e1e1e !important; | |
border-radius: 0px; | |
} | |
.mwe-popups .mwe-popups-container, .mwe-popups .mwe-popups-extract { | |
background-color: #252526 !important; | |
color: #d4d4d4; | |
} | |
.mwe-popups .mwe-popups-extract[dir='ltr']:after, .mwe-popups .mwe-popups-extract[dir='rtl']:after { | |
left: 0; | |
background-image: unset; | |
} | |
.mwe-popups .mwe-popups-settings-icon:hover { | |
background-color: #333; | |
} | |
.mwe-popups .mwe-popups-settings-icon:active { | |
background-color: #1e1e1e; | |
} | |
.rt-tooltip, .rt-tooltipTail::after, .rt-tooltipTail:after { | |
background-color: #252526; | |
border-color: #333; | |
color: #d4d4d4; | |
} | |
.rt-tooltipTail { | |
background: linear-gradient(to top right,#333 50%,rgba(0,0,0,0) 50%) !important; | |
} | |
.mw-sidebar, .sidebar, .toc, .toccolours, .sidebar-toc, .thumb, .thumbinner, .mp-bordered, table.fmbox, .bandeau-container, .catlinks { | |
background: #252526 !important; | |
border: 1px solid #333 !important; | |
} | |
.sidebar-toc:after { | |
background: revert; | |
} | |
.mw-prefs-buttons { | |
background-color: #1e1e1e !important; | |
border-color: #333 !important; | |
} | |
.mw-ui-button.mw-ui-quiet, .mw-ui-button.mw-ui-quiet.mw-ui-progressive, .mw-ui-button.mw-ui-quiet.mw-ui-destructive { | |
color: #54595d; | |
} | |
.mw-mmv-image img.gif, .mw-mmv-image img.png, .mw-mmv-image img.svg, .mw-mmv-image img.tiff, .mw-mmv-image img.tif { /* @thx https://www.magicpattern.design/tools/css-backgrounds */ | |
background-color: #888; | |
background-image: repeating-linear-gradient(45deg, #777 25%, transparent 25%, transparent 75%, #777 75%, #777), repeating-linear-gradient(45deg, #777 25%, #888 25%, #888 75%, #777 75%, #777); | |
background-position: 0 0, 10px 10px; | |
background-size: 20px 20px; | |
} | |
.mw-mmv-post-image, .mw-message-box { | |
background-color: #333; | |
border-color: #54595d; | |
color: #ccc; | |
} | |
.mw-mmv-image-metadata { | |
background-color: #1e1e1e | |
} | |
.oo-ui-panelLayout-framed { | |
border-color: #333 !important; | |
} | |
.oo-ui-tabSelectWidget-framed { | |
background-color: #2d2d2d; | |
} | |
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { | |
background-color: #54595d; | |
} | |
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label { | |
border-bottom-color: #54595d; | |
} | |
.oo-ui-tabOptionWidget > .oo-ui-labelElement-label { | |
color: #888; | |
} | |
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle, .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle, .oo-ui-menuSelectWidget { | |
background-color: #54595d; | |
color: #000; | |
} | |
.thumbimage { | |
background-color: #888; | |
border: 1px solid #888; | |
} | |
.infobox, .infobox_v2, .wikitable, .metadata, .sistersitebox, .autres-projets { | |
background-color: #252526 !important; | |
border: 1px solid #333 !important; | |
color: #93999f; | |
} | |
.infobox-header, .wikitable > tr > th, .wikitable > * > tr > th { | |
background-color: #37373d !important; | |
} | |
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td { | |
border: 1px solid #54595d; | |
} | |
body { | |
color: #d4d4d4; | |
background-color: #151515; | |
} | |
a, .sidebar-toc .sidebar-toc-list-item a { | |
color: #36c; | |
} | |
a:visited, .sidebar-toc .sidebar-toc-list-item a { | |
color: #2a4b8d; | |
} | |
h1, h2 { | |
border-bottom: 1px solid #2d2d2d; | |
} | |
h1, h2, h3, h4, h5, h6 { | |
color: #fff; | |
} | |
hr { | |
border-bottom: 1px solid #333; | |
} | |
.lang-list-border { | |
background-color: #93999f; | |
} | |
.lang-list-container { | |
background-color: #333; | |
} | |
.lang-list-button, .lang-list-active .lang-list-button, .lang-list-button:hover { | |
outline: #151515; | |
background-color: #ccc; | |
} | |
.lang-list-content, .bookshelf .text { | |
background-color: #333; | |
} | |
.uls-menu { | |
border-color: #333 !important; | |
} | |
.uls-menu div { | |
background-color: #252526 !important; | |
border-color: #333 !important; | |
border-radius: unset !important; | |
} | |
.uls-menu input { | |
background-color: #252526; | |
color: #d4d4d4; | |
} | |
.uls-language-block > ul > li:hover { | |
background-color: #1e1e1e !important; | |
} | |
.bookshelf { | |
border-top: 1px solid #3c3c3c; | |
} | |
.other-project-link:hover { | |
background-color: #37373d; | |
} | |
.app-badges .footer-sidebar-content { | |
background-color: #1e1e1e; | |
} | |
.cbnnr-main { | |
background-color: #333; | |
} | |
.cbnnr-message { | |
color: #93999f; | |
} | |
.vector-menu-tabs li { | |
background: #2d2d2d; | |
} | |
.vector-menu-tabs .selected { | |
background-color: #333; | |
} | |
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3 { | |
background-image: linear-gradient(to bottom,#333 0,#1e1e1e 100%); | |
} | |
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited { | |
color: #93999f; | |
} | |
.vector-menu-portal h3 { | |
color: #93999f !important; | |
background-image: linear-gradient(to right,#252526 0,#858585 33%,#858585 66%,#252526 100%); | |
} | |
#vector-sticky-header { | |
background-color: #252526; | |
border-color: #333; | |
} | |
#searchInput, .wvui-typeahead-search, .wvui-input__input, .wvui-button--framed { | |
background-color: #3c3c3c !important; | |
border: 1px solid #333 !important; | |
color: #c4c4c4 !important; | |
} | |
.wvui-typeahead-search__suggestions, .suggestions-dropdown { | |
background-color: #252526; | |
border: 1px solid #333; | |
} | |
.wvui-typeahead-search__suggestions__footer, .suggestion-link { | |
border: 1px solid #333; | |
color: #ccc; | |
} | |
.wvui-typeahead-suggestion__title, .suggestion-title, .suggestion-link.active .suggestion-title { | |
color: #ccc; | |
} | |
.wvui-typeahead-suggestion__description, .suggestion-description { | |
color: #93999f !important; | |
} | |
.wvui-typeahead-suggestion--active, .wvui-typeahead-search__suggestions__footer--active, .suggestion-link.active { | |
background-color: #094771; | |
color: #fff; | |
} | |
.vector-user-links .vector-user-menu-more .vector-menu-content-list li a { | |
color: #93999f | |
} | |
.navbox { | |
background-color: #3c3c3c !important; | |
border-color: #54595d !important; | |
} | |
.navbox-even { | |
background-color: #333 !important; | |
} | |
.navbox-title { | |
background-color: #2a2a51 !important; | |
} | |
.navbox-group { | |
background-color: #353564 !important; | |
} | |
.navbox-list, .navbox-group { | |
border-color: #3c3c3c !important; | |
} | |
img.mwe-math-fallback-image-inline { | |
filter: invert(.84); | |
} | |
pre, code, .mw-code { | |
background-color: #272822; color: #f8f8f2; | |
border: 1px solid #37373d; | |
} | |
/* Monokai (@thx https://help.fandom.com/wiki/Extension:SyntaxHighlight/Styling) */ | |
.mw-highlight .hll { background-color: #49483e } | |
.mw-highlight { background: #272822; color: #f8f8f2 } | |
.mw-highlight .c { color: #75715e } | |
.mw-highlight .err { color: #960050; background-color: #1e0010 } | |
.mw-highlight .k { color: #66d9ef } | |
.mw-highlight .l { color: #ae81ff } | |
.mw-highlight .n { color: #f8f8f2 } | |
.mw-highlight .o { color: #f92672 } | |
.mw-highlight .p { color: #f8f8f2 } | |
.mw-highlight .ch { color: #75715e } | |
.mw-highlight .cm { color: #75715e } | |
.mw-highlight .cp { color: #75715e } | |
.mw-highlight .cpf { color: #75715e } | |
.mw-highlight .c1 { color: #75715e } | |
.mw-highlight .cs { color: #75715e } | |
.mw-highlight .gd { color: #f92672 } | |
.mw-highlight .ge { font-style: italic } | |
.mw-highlight .gi { color: #a6e22e } | |
.mw-highlight .gs { font-weight: bold } | |
.mw-highlight .gu { color: #75715e } | |
.mw-highlight .kc { color: #66d9ef } | |
.mw-highlight .kd { color: #66d9ef } | |
.mw-highlight .kn { color: #f92672 } | |
.mw-highlight .kp { color: #66d9ef } | |
.mw-highlight .kr { color: #66d9ef } | |
.mw-highlight .kt { color: #66d9ef } | |
.mw-highlight .ld { color: #e6db74 } | |
.mw-highlight .m { color: #ae81ff } | |
.mw-highlight .s { color: #e6db74 } | |
.mw-highlight .na { color: #a6e22e } | |
.mw-highlight .nb { color: #f8f8f2 } | |
.mw-highlight .nc { color: #a6e22e } | |
.mw-highlight .no { color: #66d9ef } | |
.mw-highlight .nd { color: #a6e22e } | |
.mw-highlight .ni { color: #f8f8f2 } | |
.mw-highlight .ne { color: #a6e22e } | |
.mw-highlight .nf { color: #a6e22e } | |
.mw-highlight .nl { color: #f8f8f2 } | |
.mw-highlight .nn { color: #f8f8f2 } | |
.mw-highlight .nx { color: #a6e22e } | |
.mw-highlight .py { color: #f8f8f2 } | |
.mw-highlight .nt { color: #f92672 } | |
.mw-highlight .nv { color: #f8f8f2 } | |
.mw-highlight .ow { color: #f92672 } | |
.mw-highlight .w { color: #f8f8f2 } | |
.mw-highlight .mb { color: #ae81ff } | |
.mw-highlight .mf { color: #ae81ff } | |
.mw-highlight .mh { color: #ae81ff } | |
.mw-highlight .mi { color: #ae81ff } | |
.mw-highlight .mo { color: #ae81ff } | |
.mw-highlight .sa { color: #e6db74 } | |
.mw-highlight .sb { color: #e6db74 } | |
.mw-highlight .sc { color: #e6db74 } | |
.mw-highlight .dl { color: #e6db74 } | |
.mw-highlight .sd { color: #e6db74 } | |
.mw-highlight .s2 { color: #e6db74 } | |
.mw-highlight .se { color: #ae81ff } | |
.mw-highlight .sh { color: #e6db74 } | |
.mw-highlight .si { color: #e6db74 } | |
.mw-highlight .sx { color: #e6db74 } | |
.mw-highlight .sr { color: #e6db74 } | |
.mw-highlight .s1 { color: #e6db74 } | |
.mw-highlight .ss { color: #e6db74 } | |
.mw-highlight .bp { color: #f8f8f2 } | |
.mw-highlight .fm { color: #a6e22e } | |
.mw-highlight .vc { color: #f8f8f2 } | |
.mw-highlight .vg { color: #f8f8f2 } | |
.mw-highlight .vi { color: #f8f8f2 } | |
.mw-highlight .vm { color: #f8f8f2 } | |
.mw-highlight .il { color: #ae81ff } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment