User:JPxG/JWB-dark.css

/** JWB STYLESHEET: SELENIZED BLACK * * Selenized Black, 2021 Jan Warchoł * https://github.com/jan-warchol/selenized/tree/master * MIT License * * JWB stylesheeting, 2023 JPxG * WTFPL IDGAF */

/** Stylesheet for the JWB script. * * This program is free software; you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation; either version 2 of the License, or * (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. * * You should have received a copy of the GNU General Public License along * with this program; if not, write to the Free Software Foundation, Inc., * 51 Franklin Street, Fifth Floor, aBoston, MA 02110-1301, USA. * http://www.gnu.org/copyleft/gpl.html * * See User:Joeytje50/JWB.js for more information. */

/* Apparently this is needed for the HTML5 tags in older browsers */ section, footer, aside, nav, main, article {display: block;}

/* Normalise body */ html, body { height: 100%; padding: 0; margin: 0; background: #181818; color:     #DEDEDE; } body:before, body:after { content: normal !important; }

/* Styling for the panels */

body { background: none !important; font: 16px "Times New Roman"; line-height: 20px; margin: 0 4px; }

a:link { color: #368AEB;} a:hover { color: #4F9CFE;} a:visited {color: #36619D; /* LCh 66% #368AEB (sel_b_blue) over #181818 */}

hr { margin: 0.15em 0; }

resize: vertical; height: 300px; min-height: 300px !important; /*important to prevent inline styles from resizing to smaller sizes*/ border: 1px solid #777777; padding: 3px; overflow: auto; } height: 360px; padding-bottom: 30px; border-bottom: 1px solid #777777; }
 * 1) resultWindow {
 * 1) resultWindow * {resize: none;}
 * 2) inputsWindow {

height: 100%; } width: 300px; height: 100%; float: left; padding-top: 5px; position: relative; } height: 100%; position: relative; margin-left: 510px; padding-top: 1px; } width: 200px; height: 100%; float: left; margin-right: 5px; position: relative; z-index: 25; }
 * 1) inputsBox {
 * 1) tabs {
 * 1) editBox {
 * 1) articleBox {

position: absolute; z-index: 30; top: 20px; right: 0; color: #DEDEDE; background-color: #252525; }
 * 1) editBoxArea {

textarea { width: 100%; min-width: 100% !important; /*important to prevent inline styles from resizing to smaller sizes*/ height: 100%; min-height: 100% !important; padding: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body.AutoWikiBrowser fieldset { padding: 0 5px 5px; line-height: inherit; border: 1px solid #777777; margin: 2px 0; } legend { padding: 0 5px; font-size: 100%; } button, .button { background: #3B3B3B; /* Old browsers */ background: -moz-linear-gradient(#181818, #252525, #3B3B3B); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #181818), color-stop(50%, #252525), color-stop(100%, #3B3B3B)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(#181818, #252525, #3B3B3B); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(#181818, #252525, #3B3B3B); /* Opera 11.10+ */ background: -ms-linear-gradient(#181818, #252525, #3B3B3B); /* IE10+ */ background: linear-gradient(#181818, #252525, #3B3B3B); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#181818', endColorstr='#3B3B3B',GradientType=0 ); /* IE6-9 */ border: 1px solid #777777; border-radius: 3px; padding: 0 6px; margin: 2px; cursor: default; color: #B9B9B9; font: 13px/20px arial; display: inline-block; } button:hover, .button:hover { background: #DBB32D; /* Old browsers */ background: -moz-linear-gradient(#DBB32D, #EFC541, #DBB32D); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #DBB32D), color-stop(50%, #EFC541), color-stop(100%, #DBB32D)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(#DBB32D, #EFC541, #DBB32D); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(#DBB32D, #EFC541, #DBB32D); /* Opera 11.10+ */ background: -ms-linear-gradient(#DBB32D, #EFC541, #DBB32D); /* IE10+ */ background: linear-gradient(#DBB32D, #EFC541, #DBB32D); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFC541', endColorstr='#DBB32D',GradientType=0 ); /* IE6-9 */ color: #181818; } button:active, .button:active { background: #EFC541; /* Old browsers */ background: -moz-linear-gradient(#EFC541, #DBB32D, #EFC541); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #EFC541), color-stop(50%, #DBB32D), color-stop(100%, #EFC541)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(#EFC541, #DBB32D, #EFC541); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(#EFC541, #DBB32D, #EFC541); /* Opera 11.10+ */ background: -ms-linear-gradient(#EFC541, #DBB32D, #EFC541); /* IE10+ */ background: linear-gradient(#EFC541, #DBB32D, #EFC541); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DBB32D', endColorstr='#EFC541',GradientType=0 ); /* IE6-9 */ color: #181818; } button[disabled], button[disabled]:hover, button[disabled]:active, .button.disabled, .button.disabled:hover, .button.disabled:active { background: #777777; color: #181818; border: 1px solid #B9B9B9; opacity: 0.6; } .button input[type="file"] { position: fixed; top: -1000px; }

content: " '" attr(value) "'"; font-style: italic; }
 * 1) save:after {

border: 1px solid #777777; background: white; padding: 0 3px; position: relative; z-index: 20; }
 * 1) status {

/* Interface */

display: none; height: 100%; border: 1px solid #252525; padding: 3px; margin-top: -1px; margin-bottom: -22px; overflow: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; color: #B9B9B9; } display: block; } .fullwidth { width: 95%; display: block; } .JWBtabc input[type="text"], .JWBtabc input[type="number"], .JWBpopup input[type="text"] { border: 1px solid #252525; border-radius: 5px; box-shadow: 1px 1px 3px; padding: 2px; margin-bottom: 4px; background: #3B3B3B; color: #DEDEDE; } float: right; margin-top: -25px; } cursor: pointer; } margin-left: 2em; margin-top: 0; visibility: hidden; /* JS overrides this when RETF is enabled */ }
 * 1) tabs .JWBtabc {
 * 1) tabs .JWBtabc.active {
 * 1) replacesButton {
 * 1) refreshRETF {
 * 1) skipRETF {

.tabholder { position: relative; } .JWBtab.log { position: absolute; right: 0; font-weight: bold; } [dir="rtl"] .JWBtab.log { right:auto; left:0; } .JWBtabc.log { padding-bottom: 1.5em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.JWBtab { padding: 0 3px; border: 1px solid #252525; border-radius: 3px 3px 0 0; background: #181818; cursor: pointer; line-height: 20px; display: inline-block; } .JWBtab:hover {background: #EFC541;} .JWBtab:active {background: #252525;} .JWBtab.active { background: #3B3B3B; border-bottom: 1px solid #3B3B3B; }

.minorEdit { position: absolute; right: 8px; z-index: 5; } .editSummary { position: relative; display: inline-block; width: 266px; /* 260px of #summary, plus 1px border each side, plus 2px padding each side */ } display: inline-block; width: 260px; } .viaJWB #summary { width: 170px; padding-right: 92px; } .viaJWB:after { content: " (via JWB)"; font-size: 12px; position: absolute; right: 0; bottom: 5px; background: #B9B9B9; color: #3B3B3B; border-radius: 0 5px 5px 0; padding-left: 3px; width: 85px; }
 * 1) summary {

.editbutton { padding: 10px; margin: 2px; font-size: 115%; height: auto; }

.divisor { margin-left: 5px; padding-left: 5px; border-left: 1px solid #B9B9B9; }

display: block; position: relative; clear: right; } .timelimit-label::after { content: "ms"; position: absolute; bottom: 0; right: 10px; font-style: italic; } width: 100px; margin-right: 5px; float: right; text-align: right; box-sizing: border-box; } padding-right: 25px; }
 * 1) limits label {
 * 1) limits input {
 * 1) timelimit {

border-collapse: collapse; margin-bottom: 25px; } border: 1px #3B3B3B solid; } width: 85%; }
 * 1) actionlog {
 * 1) actionlog tr {
 * 1) actionlog td:last-child {

/* Layout */

padding-top: 3px; }
 * 1) stats {

.regexFlags, width: 30px; } .replaceText, .replaceWith { width: 200px; margin-right: 5px; float: right; } width: 80%; width: calc(100% - 100px); } border-bottom: 2px dashed #252525; margin-bottom: 5px; } .replaces > label, .replaces > .regexswitch { clear: both; }
 * 1) containFlags {
 * 1) replacesPopup .replaceText, #replacesPopup .replaceWith {
 * 1) replacesPopup .replaces {

display:block; }
 * 1) pagelistPopup fieldset > label {

.listSMW { display: none; } .hasSMW .listSMW { display: block; } height: 3em; padding: 2px; resize: vertical; }
 * 1) smwquery {

width:150px; }
 * 1) watchPage {

b { font-size: 85%; font-weight: bold; } .regexswitch { font-style:italic; } .re101 { font-size: 70%; vertical-align: super; text-decoration: none; border-bottom: 1px dotted #DEDEDE; cursor: help; }

float: right; } margin: 2px; }
 * 1) startstop {
 * 1) startstop button {

color: #FF5E56; border: 1px #FF5E56; } color: #181818; background-color: #ED4A46; opacity: 100%; } color: #83C746; border: 1px #83C746; } color: #181818; background-color: #83C746; opacity: 100%; border: 1px #70B433; }
 * 1) submitButton {font-weight:bold;color:#70B433;}
 * 2) skipButton, #skipPage {color: #ED4A46;}
 * 3) previewButton {color:#3FC5B7;}
 * 4) diffButton {color:#E67F43;}
 * 5) stopbutton {
 * 1) stopbutton[disabled] { /* Perversely, this is the state it's in when it HAS been stopped, i.e. the script is stopped. */
 * 1) startbutton {
 * 1) startbutton[disabled] { /* Perversely, this is the state it's in when it HAS been started, i.e. the script is active. */
 * 1) deletePage {color: #FF5E56;}
 * 2) movePage {color: #70B433;}
 * 3) protectPage {color: #3FC5B7;}

white-space: pre; background-color: #252525; color: #DEDEDE; } background-color: #777777; color: #181818; }
 * 1) articleList {
 * 1) articleList[disabled]:first-line {

tr[data-line]:not(.lineheader) {cursor: pointer;}


 * 1) pagelistButton {font-weight: bold;}

margin-left: 3px; } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAMElEQVQY02NgQAX/GYgE5ClkRBNgxKWQkPH/WQgoZmRgYGBgIsaBLDjcw4DP4VgBAMy1CQeFLw4MAAAAAElFTkSuQmCC"); } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAIAQMAAAARA0f2AAAABlBMVEX///8AAABVwtN+AAAAAXRSTlMAQObYZgAAAB9JREFUeF4FwLERADAEAMAfXTKDRmFQFUcYPknRPNYBP0QFRpaso0EAAAAASUVORK5CYII="); } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKAQMAAABcy+b9AAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAAB1JREFUeF5j4GCAotcNDB0NDPsaGOaAGQ0NDP8bAFrICG2BvdHlAAAAAElFTkSuQmCC"); } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHAQMAAAD+nMWQAAAABlBMVEUAAAAAAAClZ7nPAAAAAXRSTlMAQObYZgAAABVJREFUeF5jOMbwjqGGwQKI3zEcAwAgNgSZRG9YDAAAAABJRU5ErkJggg=="); } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKAQMAAABcy+b9AAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAAB1JREFUeF5j4GBgkGFgsGMAMV43MHTAUEMDw/8GAEkxB20iTmm8AAAAAElFTkSuQmCC"); } content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAJAQMAAAA1nf9tAAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAABpJREFUeF5jkGFYxHCQ4SEDA0M7QzODK4MFACYrA+hkjEi+AAAAAElFTkSuQmCC"); }
 * 1) downloads {display: none;}
 * 2) settings [id]:after {
 * 1) saveAs:after {
 * 1) saveToWiki:after {
 * 1) download:after {
 * 1) deleteSetup:after {
 * 1) importLabel:after {
 * 1) updateSetups:after {

/* Popup window */

z-index: 40; cursor: pointer; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: black; opacity: 0.3; }
 * 1) overlay {

.JWBpopup { position: fixed; z-index: 50; top: 15%; left: 25%; width: 50%; height: 70%; border: 2px solid black; padding: 5px; overflow: auto; background: #252525; }

position: relative; padding-right: 175px; /*same as #ns-filter width*/ } fieldset[disabled] > :not(legend) { opacity: 0.7; } select option[value=""] { font-style: italic; } position: absolute; right: 0; top: 0; bottom: 0; width: 175px; text-align: center; background: #252525; color: #DEDEDE; } height: 100%; background: #252525; color: #DEDEDE; } /* Added by JPxG, 2023-11-15 */
 * 1) pagelistPopup form {
 * 1) ns-filter {
 * 1) ns-filter select {

}
 * 1) namespacelist {

select#editProt, select#moveProt, select#uploadProt, select#loadSettings, select#watchPage, footer#status { background-color: #252525; color: #B9B9B9; border: 1px #3B3B3B; }

select#editProt { background-color: #252525; }

input[type=radio], input[type=checkbox] { filter: invert(1); /* Stupid hack. */ }

input[type=radio]:checked, input[type=checkbox]:checked { background-color: #70B433; accent-color: #5A7F1D; /* This... INVERTS to #A580E2, which is Selenized Black b_violet. */ } /* Format diffs -- this might be different for different skins, or naur... */

.diff-context { border-color: #3B3B3B; background-color: #252525; color: #B9B9B9; }

.diff-addedline { border-color: #368AEB; background-color: #3B3B3B; color: #DEDEDE; }

.diff-addedline .diffchange { background-color: #324D79; /* 50% LCh blend of #368AEB (Selenized Black b_blue) with #181818 */ /* 50% LAB blend is #324D79, RGB is #275181 */ }

.diff-deletedline { border-color: #DBB32D; background-color: #3B3B3B; color: #DEDEDE; }

.diff-deletedline .diffchange { background-color: #736028; /* 50% Lch blend of #DBB32D (Selenized Black b_yellow) with #181818 */ /* 50% LAB blend is #736028, RGB is #796522 */ }