AWB.css

/** Stylesheet for the AWB 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/AWB.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: white;
}
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;
}

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

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

#editBoxArea {
	position: absolute;
	z-index: 10;
	top: 20px;
	right: 0;
}

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

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

#status {
	border: 1px solid #555;
	background: white;
	padding: 0 3px;
}

/* Interface */

#tabs .AWBtabc {
	display: none;
	height: 100%;
	border: 1px solid #888;
	padding: 3px;
	margin-top: -1px;
	margin-bottom: -22px;
	overflow: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#tabs .AWBtabc.active {
	display: block;
}
.AWBtabc .fullwidth {
	width: 95%;
	display: block;
}
.AWBtabc input[type="text"], .AWBpopup input[type="text"] {
	border: 1px solid #BBB;
	border-radius: 5px;
	box-shadow: 1px 1px 3px;
	padding: 2px;
	margin-bottom: 4px;
}
#replacesButton {
	float: right;
	margin-top: -25px;
}

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

.AWBtab {
	padding: 0 3px;
	border: 1px solid #888;
	border-radius: 3px 3px 0 0;
	background: #FFF;
	cursor: pointer;
	line-height: 20px;
	display: inline-block;
}
.AWBtab:hover {background: #DDD;}
.AWBtab:active {background: #BBB;}
.AWBtab.active {
	background: #BBE;
	border-bottom: 1px solid #BBE;
}

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

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

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

/* Layout */

#stats {
	padding-top: 3px;
}

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

#pagelistPopup fieldset > label {
	display:block;
}

#watchPage {
	width:150px;
}

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 #000;
	cursor: help;
}

#startstop {
	float: right;
}
#startstop button {
	margin: 2px;
}

#submitButton {font-weight:bold;color:#262;}
#skipButton, #skipPage {color: #A33;}
#previewButton {color:#33F;}
#diffButton {color:#B62;}
#stopbutton {color: #F00;}
#startbutton {color: #080;}
#deletePage {color: #F00;}
#movePage {color: #262;}
#protectPage {color: #00F;}

#articleList {white-space: nowrap;}
#articleList[disabled]:first-line {
	background-color: #77F;
	color: #000;
}

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

#pagelistButton {font-weight: bold;}

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

/* Popup window */

#overlay {
	z-index: 30;
	cursor: pointer;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0.3;
}

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

#pagelistPopup form {
	position: relative;
	padding-right: 175px; /*same as #ns-filter width*/
}
fieldset[disabled] {
	opacity: 0.7;
}
#ns-filter {
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 175px;
	text-align: center;
}
#ns-filter select {
	height: 100%;
}