// ==UserScript==
// @name Warzone.com Wiki Dark Theme
// @namespace Violentmonkey Scripts
// @match https://www.warzone.com/wiki/*
// @version 1.1
// @author https://gf.qytechs.cn/en/users/85040-dan-wl-danwl
// @description Inverts light theme to make a dark theme and uses tints/shades when colors have intentional meaning
// @grant none
// @license MIT
// ==/UserScript==
(function() {
// TODO plain inversion is too bright in some cases
// so invert then apply [tint (if dark) or shade (if light)] 2 from https://www.color-hex.com/color/<hex code>
const style = document.createElement('style');
const style2 = document.createElement('style');
style.innerHTML = `/* load.php 410 rules */
.mw-message-box {
/* shade 6 of https://www.color-hex.com/color/eaecf0 */
background-color: #757678;
color: #fff;
/* tint 6 of https://www.color-hex.com/color/54595d */
border-color: #a9acae;
}
.mw-message-box-error {
/* shade 6 of https://www.color-hex.com/color/fee7e6 */
background-color: #7f7373;
/* tint 6 of https://www.color-hex.com/color/b32424 */
border-color: #591212;
}
.mw-message-box-warning {
/* shade 6 of https://www.color-hex.com/color/fef6e7 */
background-color: #7f7b73;
/* tint 6 of https://www.color-hex.com/color/a66200 */
border-color: #533100;
}
.mw-message-box-success {
/* shade 6 of https://www.color-hex.com/color/d5fdf4 */
background-color: #6a7e7a;
/* tint 6 of https://www.color-hex.com/color/096450 */
border-color: #84b1a7;
}
figure[typeof~='mw:File/Thumb'], figure[typeof~='mw:File/Frame'] {
border-color: #37332e;
background-color: #070605;
}
figure[typeof~='mw:File/Thumb'] > :not(figcaption) .mw-file-element, figure[typeof~='mw:File/Frame'] > :not(figcaption) .mw-file-element {
border-color: #37332e;
background-color: #070605;
}
figure[typeof~='mw:File/Thumb'] > figcaption, figure[typeof~='mw:File/Frame'] > figcaption {
border-color: #37332e;
background-color: #070605;
}
.mw-image-border .mw-file-element {
border-color: #15130f;
}
.wikitable {
background-color: #070605;
color: #dfdedd;
border-color: #5d564e;
}
.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td {
border-color: #5d564e;
}
.wikitable > tr > th, .wikitable > * > tr > th {
background-color: #15130f;
color: #dfdedd;
}
.catlinks {
background-color: #070605;
border-color: #5d564e;
}
.catlinks li {
border-color: #5d564e;
}
#mw-content-subtitle, #contentSub2 {
color: #aba6a2;
}
.usermessage {
background-color: #010918;
}
a {
/* tint 6 of https://www.color-hex.com/color/0645ad */
color: #82a2d6;
}
a:visited {
/* tint 6 of https://www.color-hex.com/color/0b0080 */
color: #857fbf;
}
a:active {
/* tint 6 of https://www.color-hex.com/color/faa700 */
color: #fcd37f;
}
hr {
background-color: #5d564e;
}
h1, h2, h3, h4, h5, h6 {
color: #fff;
}
.mw-heading1, h1, .mw-heading2, h2 {
border-bottom-color: #5d564e;
}
pre, code, wm-code {
background-color: #070605;
color: #fff;
border-color: #15130f;
}
fieldset {
border-color: #d5b472;
}
textarea {
border-color: #5d564e;
}
.toc, .toccolours {
background-color: #070605;
border-color: #5d564e;
}
.tocnumber {
color: #dfdedd;
}
.toctogglelabel {
/* same as a using #0645ad */
color: #82a2d6;
}
.vector-body blockquote {
border-left-color: #15130f;
}
body {
background-color: #090909;
}
.mw-body, .parsoid-body {
background-color: #000;
color: #dfdedd;
}
.mw-body {
border-color: #582806;
}
#mw-page-base {
background-color: #040404;
background-image: linear-gradient(to bottom,#000 50%,#090909 100%);
}
.mw-footer li {
color: #dfdedd;
}
.vector-menu-dropdown .vector-menu-heading {
color: #aba6a2;
}
.vector-menu-dropdown .vector-menu-content {
background-color: #000;
border-color: #5d564e;
box-shadow:0 1px 1px 0 rgba(255,255,255,0.1);
}
.vector-menu-dropdown .mw-list-item a {
/* same as a using #0645ad */
color: #82a2d6;
}
.vector-menu-dropdown .mw-list-item.selected a, .vector-menu-dropdown .mw-list-item.selected a:visited {
/* tint 6 of https://www.color-hex.com/color/202122 */
color: #8f9090;
}
.vector-menu-tabs-legacy li {
background-image:linear-gradient(to top,#883e09 0,#170d07 1px,#000 100%);
}
.vector-menu-tabs-legacy li a {
/* same as a using #0645ad */
color: #82a2d6;
}
.vector-menu-tabs-legacy .new a, .vector-menu-tabs-legacy .new a:visited {
/* tint 6 of https://www.color-hex.com/color/ba0000 */
color: #5d0000;
}
.vector-menu-tabs-legacy .selected {
background-color: #000
}
.vector-menu-tabs-legacy .selected a, .vector-menu-tabs-legacy .selected a:visited {
/* tint 6 of https://www.color-hex.com/color/202122 */
color: #8f9090;
}
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading {
background-image: linear-gradient(to bottom,rgba(88,40,1,0) 0,#582806 100%);
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
color: #aba6a2;
background-image: linear-gradient(to right,rgba(55,51,46,0) 0,#37332e 33%,#37332e 66%,rgba(55,51,46,0) 100%);
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a {
/* same as a using #0645ad */
color: #82a2d6;
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
/* same as a using #0b0080 */
color: #857fbf;
}
.vector-search-box-input {
background-color: rgba(0,0,0,0.5);
color: #fff;
border-color: #5d564e;
}
.vector-search-box-inner:hover .vector-search-box-input {
border-color: #8d8882;
}
.vector-search-box-input::-webkit-input-placeholder {
color: #8d8882;
}
.vector-search-box-input:-ms-input-placeholder {
color: #8d8882;
}
.vector-search-box-input::-moz-placeholder {
color: #8d8882;
}
.vector-search-box-input::placeholder {
color: #8d8882;
}
.vector-user-menu-legacy #pt-anonuserpage {
color: #aba6a2;
}
.mw-body a:not(.image) {
/* tint 6 of https://www.color-hex.com/color/aaaaaa */
border-bottom-color: #555555;
}
.firstHeading, .mw-heading2, h2 {
border-bottom-color: #fff;
}
blockquote {
border-left-color: #fff;
}
.printfooter {
border-top-color: #fff;
}
.mw-footer {
border-top-color: #111;
}
#footer-info li {
color: #666;
}
#footer-info li a {
color: #666 !important;
}
#footer-info-lastmod {
color: #fff;
}
#footer {
background-color: #000;
color: #fff;
border-top-color: #555;
}
/* load.php 11 rules */
div.ambox {
/* orange is FFA500 */
/* tint 6 of https://www.color-hex.com/color/ffa500 */
border-color: #ffd27f;
background-color: #040404;
}
div.infobox {
border-color: #fff;
background-color: #202020;
}
div.infobox div.plainlinks a, div.infobox div.plainlinks a:hover {
color: #fff;
}
div.infobox hr {
color: #fff;
background-color: #fff;
}
div.navbox {
background-color: #0e0e0e;
border-color: #fff;
}
div.navbox div.navbox-header {
background-color: #212121;
border-color: #fff;
}
/* inline stylesheet 1 10 rules */
.suggestions-special {
background-color: #000;
border-color: #5d564e;
}
.suggestions-results {
background-color: #000;
border-color: #5d564e;
}
.suggestions-result {
color: #fff;
}
.suggestions-result-current {
background-color: #d5b472;
color: #000;
}
.suggestions-special .special-label {
color: #8d8882;
}
.suggestions-special .special-query {
color: #fff;
}
.suggestions-special .special-hover {
background-color: #37332e;
}
.suggestions-result-current .special-label, .suggestions-result-current .special-query {
color: #000;
}
/* inline stylesheet 3 3 rules */
.suggestions a.mw-searchSuggest-link, .suggestions a.mw-searchSuggest-link:hover, .suggestions a.mw-searchSuggest-link:active, .suggestions a.mw-searchSuggest-link:focus {
color: #fff;
}
.suggestions-result-current a.mw-searchSuggest-link, .suggestions-result-current a.mw-searchSuggest-link:hover, .suggestions-result-current a.mw-searchSuggest-link:active, .suggestions-result-current a.mw-searchSuggest-link:focus {
color: #000;
}`;
style2.innerHTML = `/* load.php 1033 rules https://www.warzone.com/wiki/Special:Categories */
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {
color: #070605;
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
color: #15130f;
}
.mw-htmlform-invalid-input td.mw-input input {
/* tint 6 of https://www.color-hex.com/color/d73333 */
border-color: #eb9999;
}
.mw-datatable {
border-color: #5d564e;
}
.mw-datatable td, mw-datatable th {
border-color: #5d564e;
}
.mw-datatable th {
background-color: #151100;
}
.mw-datatable td {
background-color: #000;
}
.mw-datatable tr:hover td {
background-color: #150c00;
}
.oo-ui-pendingElement-pending {
background-color: #15130f;
background-image: linear-gradient(135deg,#000 25%,transparent 25%,transparent 50%,#000 50%,#000 75%,transparent 75%,transparent);
}
.oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
color: #8d8882;
}
.oo-ui-panelLayout-framed {
border-color: #5d564e;
}
.oo-ui-optionWidget.oo-ui-widget-disabled {
color: #8d8882;
}
.oo-ui-radioSelectWidget:focus [type='radio']:checked + span::before {
border-color: #000;
}
.oo-ui-labelWidget.oo-ui-inline-help {
color: #aba6a2;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-error {
/* shade 6 of https://www.color-hex.com/color/fee7e6 */
background-color: #7f7373;
/* tint 6 of https://www.color-hex.com/color/b32424 */
border-color: #d99191;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-warning {
/* shade 6 of https://www.color-hex.com/color/fef6e7 */
background-color: #7f7b73;
/* tint 6 of https://www.color-hex.com/color/a66200 */
border-color: #d2b07f;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-success {
/* shade 6 of https://www.color-hex.com/color/d5fdf4 */
background-color: #6a7e7a;
/* tint 6 of https://www.color-hex.com/color/096450 */
border-color: #84b1a7;
}
.oo-ui-messageWidget.oo-ui-messageWidget-block.oo-ui-flaggedElement-notice {
/* shade 6 of https://www.color-hex.com/color/eaecf0 */
background-color: #757678;
/* tint 6 of https://www.color-hex.com/color/54595d */
border-color: #a9acae;
}
.oo-ui-messageWidget.oo-ui-flaggedElement-error:not(.oo-ui-messageWidget-block) {
/* can be left as #d73333 */
}
.oo-ui-messageWidget.oo-ui-flaggedElement-success:not(.oo-ui-messageWidget-block) {
/* can be left as #14866d */
}
.oo-ui-popupWidget-popup {
background-color: #000;
border-color: #5d564e;
box-shadow: 0 2px 2px 0 rgba(255,255,255,0.2);
}
@supports (filter:drop-shadow(0 0 0)) {
.oo-ui-popupWidget {
filter: drop-shadow(0 2px 1px rgba(255,255,255,0.3));
}
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
border-bottom-color: #847a6f;
}
.oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::after {
border-bottom-color: #000;
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::before {
border-top-color: #5d564e;
}
.oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::after {
border-top-color: #000;
}
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::before {
border-right-color: #5d564e;
}
.oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::after {
border-right-color: #000;
}
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::before {
border-left-color: #5d564e;
}
.oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::after {
border-left-color: #000;
}
.oo-ui-checkboxInputWidget [type='checkbox'] + span {
background-color: #000;
border-color: #8d8882;
}
.oo-ui-checkboxInputWidget [type='checkbox']:indeterminate + span::before {
background-color: #000;
}
.oo-ui-checkboxInputWidget [type='checkbox']:disabled + span {
background-color: #37332e;
border-color: #37332e;
}
.oo-ui-dropdownInputWidget select {
border-color: #5d564e;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled {
background-color: #070605;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover {
background-color: #000;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
color: #dfdedd;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {
color: #bfbdbb;
border-color: #5d564e;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:active {
color: #fff;
border-color: #8d8882;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-disabled {
background-color: #15130f;
}
.oo-ui-dropdownInputWidget.oo-ui-widget-disabled select {
color: #8d8882;
border-color: #37332e;
}
.oo-ui-radioInputWidget [type='radio'] + span {
background-color: #000;
border-color: #8d8882;
}
.oo-ui-radioInputWidget [type='radio']:disabled + span {
background-color: #37332e;
border-color: #37332e;
}
.oo-ui-radioInputWidget [type='radio']:disabled:checked + span {
background-color: #000;
}
.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:focus + span::before {
border-color: #000;
}
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: #000;
color: #fff;
border-color: #5d564e;
}
.oo-ui-textInputWidget .oo-ui-pendingElement-pending {
background-color: #15130f;
}
.oo-ui-textInputWidget > .oo-ui-labelElement-label {
color: #8d8882;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::-webkit-input-placeholder {
color: #8d8882;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:-ms-input-placeholder {
color: #8d8882;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::-moz-placeholder {
color: #8d8882;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::placeholder {
color: #8d8882;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) {
background-color: #070605;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input {
color: #8d8882;
}
@media screen and (min-width:0) {
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea.oo-ui-inputWidget-input:focus {
/* tint 6 of https://www.color-hex.com/color/b32424 */
outline-color: #d99191;
}
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
/* tint 6 of https://www.color-hex.com/color/b32424 */
border-color: #d99191;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:hover {
/* tint 6 of https://www.color-hex.com/color/b32424 */
border-color: #d99191;
}
.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:focus {
/* tint 6 of https://www.color-hex.com/color/b32424 */
border-color: #d99191;
/* tint 6 of https://www.color-hex.com/color/d73333 */
box-shadow: inset 0 0 0 1px #eb9999;
}
.oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input {
background-color: #15130f;
-webkit-text-fill-color: #8d8882;
color: #8d8882;
text-shadow: 0 1px 1px #000;
border-color: #37332e;
}
.oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-labelElement-label {
color: #8d8882;
text-shadow: 0 1px 1px #000;
}
.oo-ui-menuSelectWidget {
background-color: #000;
border-color: #5d564e;
box-shadow: 0 2px 2px 0 rgba(255,255,255,0.2);
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
background-color: #15130f;
color: #fff;
}
.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected, .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted, .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
background-color: #150c00;
}
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
color: #dfdedd;
}
.oo-ui-menuSectionOptionWidget {
color: #8d8882;
}
.oo-ui-dropdownWidget-handle {
border-color: #5d564e;
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
background-color: #070605;
color: #dfdedd;
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
background-color: #000;
color: #bfbdbb;
border-color: #5d564e;
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active {
color: #fff;
border-color: #8d8882;
}
.oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
background-color: #000;
}
.oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {
color: #8d8882;
text-shadow:0 1px 1px #000;
border-color: #37332e;
backgrond-color: #15130f;
}
.oo-ui-comboBoxInputWidget-open .oo-ui-comboBoxInputWidget-dropdownButton > .oo-ui-buttonElement-button {
background-color: #000;
}
.oo-ui-multioptionWidget.oo-ui-widget-disabled {
color: #8d8882;
}
.oo-ui-progressBarWidget {
border-color: #5d564e;
box-shadow:0 2px 2px 0 rgba(255,255,255,0.2);
}
.oo-ui-progressBarWidget:not(.oo-ui-pendingElement-pending) {
backgrond-color: #000;
}
.oo-ui-progressBarWidget.oo-ui-widget-disabled .oo-ui-progressBarWidget-bar {
background-color: #37332e;
}
.oo-ui-selectFileInputWidget-dropTarget {
background-color: #000;
border-color: #5d564e;
}
.oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-dropTarget {
background-color: #000;
}
.oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-dropTarget:hover {
border-color: #8d8882;
}
.oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-canDrop.oo-ui-selectFileInputWidget-dropTarget, .oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-canDrop .oo-ui-selectFileInputWidget-info > .oo-ui-inputWidget-input {
background-color: #150c00;
color: #d5b472;
}
.oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-cantDrop.oo-ui-selectFileInputWidget-dropTarget, .oo-ui-selectFileInputWidget.oo-ui-widget-enabled.oo-ui-selectFileInputWidget-cantDrop .oo-ui-selectFileInputWidget-info > .oo-ui-inputWidget-input {
/* shade 6 of https://www.color-hex.com/color/fee7e6 */
background-color: #7f7373;
/* tint 6 of https://www.color-hex.com/color/b32424 */
color: #d99191;
}
.oo-ui-selectFileInputWidget.oo-ui-widget-disabled.oo-ui-selectFileInputWidget-dropTarget, .oo-ui-selectFileInputWidget.oo-ui-selectFileInputWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileInputWidget-dropTarget {
background-color: #15130f;
border-color: #37332e;
}
.oo-ui-toggleSwitchWidget {
background-color: #070605;
border-color: #8d8882
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
background-color: #070605;
border-color: #8d8882;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
background-color: #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
background-color: #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip, .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip {
background-color: #000;
border-color: #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
background-color: #000;
border-color: #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus::before {
border-color: #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
background-color: #37332e;
border-color: #37332e;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
border-color: #000;
box-shadow: inset 0 0 0 1px #000;
}
.oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
background-color: #000;
}
/* 2941 onwards should be fine to ignore because its rules included in first style */
/* inline stylesheet 3 13 rules */
.mw-widget-titleWidget-menu .mw-widget-titleOptionWidget-description {
color: #8d8882;
}
.mw-widget-titleWidget-menu-withImages .mw-widget-titleOptionWidget.oo-ui-iconElement > .oo-ui-iconElement-icon:not(.mw-widget-titleOptionWidget-hasImage) {
background-color: #37332e;
}`;
document.head.appendChild(style);
document.head.appendChild(style2);
})();