Skip to content

Instantly share code, notes, and snippets.

@Eklei
Last active January 25, 2023 23:52
Show Gist options
  • Save Eklei/5fa02e0e2ec942baaad23292cb55e8f3 to your computer and use it in GitHub Desktop.
Save Eklei/5fa02e0e2ec942baaad23292cb55e8f3 to your computer and use it in GitHub Desktop.
Deuglifies the new Wikipedia theme by fixing the colors (which are mostly blinding white by default)
/* ==UserStyle==
@name Wikipedia - The Goggles Do Nothing
@version 2023.01.25
@description Deuglifies the new Wikipedia theme by fixing the colors (which are mostly blinding white by default)
@namespace https://github.com/Eklei
@author Eklei
==/UserStyle== */
@-moz-document domain("wikipedia.org") {
:root {
--cont-pad-x: 2.0em;
--cont-pad-y: 0.5em;
--cont-neg-x: calc(0px - var(--cont-pad-x));
--cont-neg-y: calc(0px - var(--cont-pad-y));
--font-color: #111; /*default #202122*/
--bgcolor-infobox: #F8F9FA;
--bgcolor-light: #FBFBFB;
--bgcolor-dark: #F0F0F0;
--shadow-color: #00000011;
--shadow-top: 0 0 55px 55px var(--shadow-color);
--shadow-fore: 0 0 33px var(--shadow-color);
}
@media screen {
.mw-page-container {
background: transparent !important;
}
body,
.mw-content-container {
background: var(--bgcolor-light) !important;
color: var(--font-color) !important;
}
.vector-menu-dropdown > .vector-menu-content,
.vector-main-menu, .vector-toc {
background: var(--bgcolor-infobox) !important;
box-shadow: var(--shadow-fore) !important;
}
.vector-search-box-input {
background: #FFF !important;
}
#mw-panel-toc {
contain: none !important;
} /*why...? this nonsense property set to 'paint' broke drop shadows for no reason*/
.vector-toc {
margin-left: -1px;
} /*fix new inaccuracy introduced on Jan-24 that's invisible when everything is white*/
}
@media screen and (min-width: 1000px) {
html body {
background: var(--bgcolor-dark) !important;
}
html body::before {
content: ''; display: block; position: absolute; z-index: -1;
top: 0px; left: 0; right: 0; height: 0;
box-shadow: var(--shadow-top) !important;
}
html .mw-content-container {
position: relative !important;
}
html .mw-content-container::after {
content: ''; position: absolute; z-index: -1;
top: var(--cont-neg-y); right: var(--cont-neg-x); bottom: 0; left: var(--cont-neg-x);
background: var(--bgcolor-light); box-shadow: var(--shadow-fore);
} /*add shadow-casting padding without changing the position or size of the container*/
html .vector-toc-pinned #vector-toc-pinned-container {
margin-top: 1.5em !important;
padding-top: 1.5em !important;
}
html .vector-toc-pinned #vector-toc-pinned-container .vector-toc::after {
background: linear-gradient(transparent,var(--bgcolor-infobox)) !important;
background-repeat: no-repeat !important;
background-position: -17px !important;
}
}
}
@ggppjj
Copy link

ggppjj commented Jan 25, 2023

See fork here for easy Stylus install. Gists apparently don't have pull requests, but you can just make a new revision I guess.

https://gist.github.com/ggppjj/18fb137d8f16b4cacfa4250b6882d5dd

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment