User:CenPop/CenPop.css

/** Stylesheet for the CenPop 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/CenPop.js for more information.

*

* @version 1.1

* @author Jacob Alperin-Sheriff, Joeytje50

*/

/* 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;

}

  1. resultWindow {

resize: vertical;

height: 275px;

min-height: 275px !important; /*important to prevent inline styles from resizing to smaller sizes*/

border: 1px solid #555;

padding: 3px;

overflow: auto;

}

  1. resultWindow * {resize: none;}
  2. inputsWindow {

height: 375px;

padding-bottom: 30px;

border-bottom: 1px solid #AAA;

}

  1. inputsBox {

height: 100%;

}

  1. tabs {

width: 360px;

height: 100%;

float: left;

padding-top: 5px;

position: relative;

}

  1. editBox {

height: 100%;

position: relative;

margin-left: 560px;

padding-top: 1px;

}

  1. articleTabs {

width: 200px;

height: 100%;

float: left;

margin-right: 5px;

position: relative;

z-index: 5;

}

  1. articleBox {

width: 100%;

height: 100%;

float: left;

margin-right: 5px;

position: relative;

z-index: 5;

}

  1. noWebsiteBox {

width: 100%;

height: 100%;

float: left;

margin-right: 5px;

position: relative;

z-index: 5;

}

  1. 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;

}

  1. save:after {

content: " '" attr(value) "'";

font-style: italic;

}

  1. status {

border: 1px solid #555;

background: white;

padding: 0 3px;

}

/* Interface */

  1. tabs .CenPoptabc {

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;

}

  1. tabs .CenPoptabc.active {

display: block;

}

  1. articleTabs .articleTabc {

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;

}

  1. articleTabs .articleTabc.activeArticle {

display: block;

}

.CenPoptabc .fullwidth {

width: 95%;

display: block;

}

.CenPoptabc input[type="text"], .CenPoppopup input[type="text"] {

border: 1px solid #BBB;

border-radius: 5px;

box-shadow: 1px 1px 3px;

padding: 2px;

margin-top: 2px;

margin-bottom: 8px;

}

  1. replacesButton {

float: right;

margin-top: -25px;

}

  1. refreshRETF {

cursor: pointer;

}

.tabholder {

position: relative;

}

.CenPoptab.log {

position: absolute;

right: 0;

font-weight: bold;

}

[dir="rtl"] .CenPoptab.log {

right:auto;

left:0;

}

.CenPoptabc.log {

padding-bottom: 1.5em;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}

.CenPoptab {

padding: 0 3px;

border: 1px solid #888;

border-radius: 3px 3px 0 0;

background: #FFF;

cursor: pointer;

line-height: 20px;

display: inline-block;

}

.CenPoptab:hover {background: #DDD;}

.CenPoptab:active {background: #BBB;}

.CenPoptab.active {

background: #BBE;

border-bottom: 1px solid #BBE;

}

.articleTab {

padding: 0 3px;

border: 1px solid #888;

border-radius: 3px 3px 0 0;

background: #FFF;

cursor: pointer;

line-height: 20px;

display: inline-block;

}

.articleTab:hover {background: #DDD;}

.articleTab:activeArticle {background: #BBB;}

.articleTab.activeArticle {

background: #BBE;

border-bottom: 1px solid #BBE;

}

.viaCenPop {

position:relative;

}

.editbutton .otherbutton {

padding: 10px;

margin: 2px;

font-size: 115%;

height: auto;

}

  1. stateAdding {

margin-right: 10px;

}

.divisor {

margin-left: 5px;

padding-left: 5px;

border-left: 1px solid #AAA;

}

  1. actionlog {

border-collapse: collapse;

margin-bottom: 25px;

}

  1. actionlog tr {

border: 1px #AAA solid;

}

  1. actionlog td:last-child {

width: 85%;

}

/* Layout */

  1. stats {

padding-top: 3px;

}

.regexFlags,

  1. containFlags {

width: 30px;

}

.replaces {

margin-top: 15px;

}

.beginYearText, .estRefText, .estYearText, .footnoteText, .replaceText, .replaceWith, #summary {

width: 190px;

margin-right: 5px;

float: right;

}

  1. replacesPopup .replaceText, #replacesPopup .replaceWith {

width: 80%;

width: calc(100% - 100px);

}

  1. replacesPopup .replaces {

border-bottom: 2px dashed #BBB;

margin-bottom: 5px;

}

.replaces > label, .replaces > .regexswitch, .cens {

clear: both;

}

  1. histPopDiv, .myHeader {

display: block;

padding-top: 5px;

padding-bottom: 15px;

font-size: 200%;

text-align: center;

}

  1. pagelistPopup fieldset > label {

display:block;

}

  1. 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;

}

  1. startstop {

float: right;

margin-top: 10px;

margin-bottom: 10px;

}

  1. startstop button {

margin: 2px;

}

  1. submitButton {font-weight:bold;color:#262;}
  2. skipButton, #skipPage {color: #A33;}
  3. previewButton {color:#33F;}
  4. diffButton {color:#B62;}
  5. stopbutton {color: #F00;}
  6. startbutton {color: #080;}
  7. deletePage {color: #F00;}
  8. movePage {color: #262;}
  9. protectPage {color: #00F;}
  1. articleList {white-space: pre-line;}
  2. articleList[disabled]:first-line {

background-color: #77F;

color: #000;

}

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

  1. pagelistButton {font-weight: bold;}
  1. downloads {display: none;}
  2. settings [id]:after {

margin-left: 3px;

}

  1. saveAs:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAMElEQVQY02NgQAX/GYgE5ClkRBNgxKWQkPH/WQgoZmRgYGBgIsaBLDjcw4DP4VgBAMy1CQeFLw4MAAAAAElFTkSuQmCC");

}

  1. saveToWiki:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAIAQMAAAARA0f2AAAABlBMVEX///8AAABVwtN+AAAAAXRSTlMAQObYZgAAAB9JREFUeF4FwLERADAEAMAfXTKDRmFQFUcYPknRPNYBP0QFRpaso0EAAAAASUVORK5CYII=");

}

  1. download:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKAQMAAABcy+b9AAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAAB1JREFUeF5j4GCAotcNDB0NDPsaGOaAGQ0NDP8bAFrICG2BvdHlAAAAAElFTkSuQmCC");

}

  1. deleteSetup:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHAQMAAAD+nMWQAAAABlBMVEUAAAAAAAClZ7nPAAAAAXRSTlMAQObYZgAAABVJREFUeF5jOMbwjqGGwQKI3zEcAwAgNgSZRG9YDAAAAABJRU5ErkJggg==");

}

  1. importLabel:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKAQMAAABcy+b9AAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAAB1JREFUeF5j4GBgkGFgsGMAMV43MHTAUEMDw/8GAEkxB20iTmm8AAAAAElFTkSuQmCC");

}

  1. updateSetups:after {

content: url("data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAJAQMAAAA1nf9tAAAABlBMVEVwAAAAAACuRbQOAAAAAXRSTlMAQObYZgAAABpJREFUeF5jkGFYxHCQ4SEDA0M7QzODK4MFACYrA+hkjEi+AAAAAElFTkSuQmCC");

}

/* Popup window */

  1. overlay {

z-index: 30;

cursor: pointer;

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 100%;

background: black;

opacity: 0.3;

}

.CenPoppopup {

position: fixed;

z-index: 50;

top: 15%;

left: 25%;

width: 50%;

height: 70%;

border: 2px solid black;

padding: 5px;

overflow: auto;

background: #EEE;

}

  1. pagelistPopup form {

position: relative;

padding-right: 175px; /*same as #ns-filter width*/

}

fieldset[disabled] {

opacity: 0.7;

}

  1. ns-filter {

position: absolute;

right: 0;

top: 0;

bottom: 0;

width: 175px;

text-align: center;

}

  1. ns-filter select {

height: 100%;

}

.loadFileText:focus {

width: 180px;

}

.to_add_div {

display: inline-block;

margin-left: 10px;

margin-right: 5px;

margin-top: 1px;

}

  1. select_div {

display: inline-block;

margin-top: 5px;

}

.to_add_span {

display: block;

width: 100%;

margin-bottom: 3px;

}

  1. county_fips {

width: 40px;

}

  1. min_fips {

width: 50px;

}

/* A div with checkboxes */

.check_div {

display: inline-block;

margin-top: 5px;

margin-bottom: 5px;

}

.my_radio {

margin: 5px;

}

.radio_label {

padding: 5px;

}

  1. load_from_div, #est_or_census_div {

margin: 5px;

}

  1. load_label,.load_label {

font-weight: bold;

}

  1. file_load {

margin-top: 5px;

}

  1. load_details {

height: 70px;

margin: 0px;

}

  1. button_div {

margin-top: 10px;

}