Difference between revisions of "MediaWiki:Common.css"

Latest revision as of 13:57, 7 May 2019

/* CSS placed here will be applied to all skins */


/************************************************
************************************************
Hide the title and contents box on the front page
************************************************
*************************************************/

body.page-Main_Page h1.firstHeading { display:none; }
body.page-Main_Page #toc { display:none; }



th.rotate {
  /* Something you can count on */
  height: 140px;
  white-space: nowrap;
}

th.rotate > div {
  transform: 
    /* Magic Numbers */
    translate(25px, 51px)
    /* 45 is really 360 - 45 */
    rotate(315deg);
  width: 30px;
}
th.rotate > div > span {
  border-bottom: 1px solid #ccc;
  padding: 5px 10px;
}


/*************************
*************************
Class colors for span tags
*************************
**************************/

span.deathknight, span.deathknight a, span.deathknight a:visited { color:#c41f3b; }
span.druid      , span.druid       a, span.druid       a:visited { color:#ff7d0a; }
span.hunter     , span.hunter      a, span.hunter      a:visited { color:#abd473; }
span.mage       , span.mage        a, span.mage        a:visited { color:#69ccf0; }
span.monk       , span.monk        a, span.monk        a:visited { color:#00ff96; }
span.paladin    , span.paladin     a, span.paladin     a:visited { color:#f58cba; }
span.priest     , span.priest      a, span.priest      a:visited { color:#ffffff; }
span.rogue      , span.rogue       a, span.rogue       a:visited { color:#fff569; }
span.shaman     , span.shaman      a, span.shaman      a:visited { color:#0070de; }
span.warlock    , span.warlock     a, span.warlock     a:visited { color:#9482c9; }
span.warrior    , span.warrior     a, span.warrior     a:visited { color:#c79c6e; }

/* Factions */

span.alliance   , span.alliance    a, span.alliance    a:visited, span.alliance    a.external, span.alliance    a.external:visited { color:#6080ff; }
span.horde      , span.horde       a, span.horde       a:visited, span.horde       a.external, span.horde       a.external:visited { color:#c30000; }

/* Red warning text */
span.red      , span.red       a, span.red       a:visited { color:#ff0000; }


/************************************************************
************************************************************
table classes

se_table_l  = left aligned content
se_table_ls = left aligned content, row backgrounds alternate
se_table_c  = centered content
se_table_cs = centered content, row backgrounds alternate

table headers are always centered
************************************************************
*************************************************************/

/* common to the whole table (border & margin are for the table, not sub-elements) left aligned version*/
table.se_table_l, table.se_table_ls {
    margin-bottom: 2em;
    border:solid 1px #0070dd;
    border-radius: 4px;
    text-align:left;
    color:#dcdcdc;
}

/* common to the whole table (border & margin are for the table, not sub-elements) centered version*/
table.se_table_c, table.se_table_cs {
    margin-bottom: 2em;
    border:solid 1px #0070dd;
    text-align:center;
    color:#dcdcdc;
}

/* table header elements only */
table.se_table_l th, table.se_table_ls th, table.se_table_c th, table.se_table_cs th {

/*    background: url("http://firefall-wiki.com/images/firefall-wiki.com/3/34/Header_background.jpg") top left; */
    background-color:#002840;
    border:solid 1px #002840;
    border-radius: 4px;
/*    border:none; */
/*    border: 1px #4b3f1d solid; */
/*    border-radius: 4px; */

/*    background-color:#2f230e; */
/*    border:solid 1px #2f230e; */
    color:#dcdcdc ;
    text-align:center;
    font-weight:bold;
}

/* links within the table    DISABLED
table.se_table_l a:link, table.se_table_ls a:link, table.se_table_c a:link, table.se_table_cs a:link {
    color:#ff9e00;
}
*/

/* common to both headers and regular cells */
table.se_table_l th, table.se_table_l td, table.se_table_ls th, table.se_table_ls td, table.se_table_c th, table.se_table_c td, table.se_table_cs th, table.se_table_cs td {
    margin:1px;
    padding:0.2em;
    border-radius: 4px;
}

/* regular cells only */
table.se_table_l td, table.se_table_c td {
    background-color:#001e30;
    border:solid 1px #001e30;
}

/* alternating colors for the _s version of the class.  Does not play well with rowspan, so tables using that may need custom classes. */
table.se_table_ls tr:nth-child(even) td, table.se_table_cs tr:nth-child(even) td {
    background-color:#001e30;
    border:solid 1px #001e30;
}
table.se_table_ls tr:nth-child(odd) td, table.se_table_cs tr:nth-child(odd) td {
    background-color:#001420;
    border:solid 1px #001420;
}

/* unique cell type for dividing groups of table cells */
table.se_table_l td.ff_divider, table.se_table_ls td.ff_divider, table.se_table_c td.ff_divider, table.se_table_cs td.ff_divider  {
    background-color:#0070dd ;
    border:none;
    padding:0.0em;
    height:1px;
}




/*****************************************************************************************************************************************************************
*****************************************************************************************************************************************************************
Everything below here is a damn mess, because of how complicated the CSS for mediawiki's Vector skin is, and the complete lack of documentation on how to edit it.

While this seems to work, there may be problems in formatting that crop up in future.
*****************************************************************************************************************************************************************
*****************************************************************************************************************************************************************/

body{
	background-color:black;
	background-image:none;
	color:#dcdcdc;
}

body p, div#content{
	color:#dcdcdc;
}
h1, h2, h3, h4, h5, h6, div#mw-panel div.portal h3, 
#mw-panel.collapsible-nav .portal h3 a,
#mw-panel.collapsible-nav .portal.collapsed h3 a
{
color:#dcdcdc
}

div#content h1, div#content h2, div#content h3, div#content h4, div#content h5, div#content h6 {
    border-bottom: 1px solid #0070dd;
}


#mw-panel.collapsible-nav .portal h3 a,
#mw-panel.collapsible-nav .portal.collapsed h3 a{
	font-weight:bold;
}
a, .mw-body a.external, div#headertabs.jquery-large .ui-widget-content a {
color:#ff9e00;
}

a:visited, .mw-body a.external:visited, div#headertabs.jquery-large .ui-widget-content a:visited{
  color:#bf7700;
}

a:active, .mw-body a.external:active, #preftoc a:active,  .mw-search-formheader div.search-types ul li.current a, div#headertabs.jquery-large .ui-widget-content a:active{
  color:#ff9e00;
}

a.new, #p-personal a.new {
  color:#ff9e00;
}

div#mw-panel div.portal div.body ul li a, div#mw-panel div.portal div.body ul li a:visited  {
  color: #ff9e00;
}

div#mw-head{
	background-color:black;
}

#mw-head-base {
    background-image: none;
    border-bottom: 1px solid #000000;
}

#right-navigation, #p-personal {
        margin-right: 11em;
}

div#content{
	background-color:#001420;
	background-image:none;
	border:1px solid #0070dd;
        /* margin-top: -1px;*/
	margin-right: 11em;
}

div#footer{
	margin-left: 10em;
	margin-right: 11em;  
}


/*
.mw-body {
    margin-left: 10em;
    padding: 1em;
    border-width: 1px 0px 1px 1px;
    border-style: solid;
    border-color: #0070dd;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    margin-top: -1px;
    background-color: #001420;
}
*/

#mw-page-base{
	background-color:black;
  background-image:none;
}

.toc, #toc, .catlinks, #catlinks, li.gallerybox div.thumb, div.thumbinner, table.diff, .mw-search-formheader, fieldset#mw-searchoptions {
	background-color:#000000;
	color:#0070dd;
	border: 1px solid #0070dd !important;
}

#toc h2, .toc h2{
	color:#0070dd;
}

#toc a, .toc a{
	color: #ff9e00;
}

body #mw-panel.collapsible-nav .portal.expanded  h5 a, 
body #mw-panel.collapsible-nav .portal.collapsed h5 a{
	color:#FCAE00;
	font-weight:bold;
}

#mw-panel.collapsible-nav .portal h5 a{
	color:#0070dd;	
}

div#footer ul li{
	color:#CEDBDC;
}

div.vectorTabs li.selected{
	background-image:none;
	background-color:black;

}

div.vectorTabs li.selected a, div.vectorTabs li a,
div.vectorTabs li.selected a:visited
{
	color:#CEDBDC;
}

body #mw-panel.collapsible-nav .portal{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAAABCAYAAAAM7kY4AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QsOFTUQUBBQOgAAAFJJREFUKM+lj1EKwCAMQ5903v8mXtAM9qMwxWrBQklpmpAmABUS8AC5of1mr/OBswlX3I3eyxD5oXsYdyWgNpy7Au+Gj9ys+L5TwFsHvQI+Q44PqzY+r30sz1UAAAAASUVORK5CYII=);	
}



/***** borders either side of tabs *****/

div.vectorTabs, div.vectorTabs span, div.vectorTabs ul, #preftoc li, #preftoc, div.vectorMenu h5 a, div.vectorMenu h3 a {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAuCAYAAADp73NqAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NjA2RTFDMTc4MjI1MTFFNEIxQUREQkQ4RDQ0M0MxOTgiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NjA2RTFDMTY4MjI1MTFFNEIxQUREQkQ4RDQ0M0MxOTgiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkNERkE3QjEwODIwNjExRTQ4NTZDRTk0MzU5REQ5NzBGIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkNERkE3QjExODIwNjExRTQ4NTZDRTk0MzU5REQ5NzBGIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+lsvqsQAAADtJREFUeNpi+P//PwMDQ8FdFiYgxYZKsIMIDlSCE05w4SI44AawYiFwSrDg4qKx0AhmVBYawQRmAQQYAHMWBaCvQ+2KAAAAAElFTkSuQmCC);
}




/***** unselected tabs *****/

div.vectorTabs ul li {
	background-color:#000000;
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCNkMzM0JBRTgyMUIxMUU0QUFBRkM2NDM4OUIwRTdERCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCNkMzM0JBRjgyMUIxMUU0QUFBRkM2NDM4OUIwRTdERCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkI2QzMzQkFDODIxQjExRTRBQUFGQzY0Mzg5QjBFN0REIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkI2QzMzQkFEODIxQjExRTRBQUFGQzY0Mzg5QjBFN0REIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ZlkJegAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
}

/*selected tab*/
div.vectorTabs li.selected {
        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAYAAABHLFpgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCRUZGMDY3NTgyMUMxMUU0OTFGMjg5OTcyN0NCOTY2OCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCRUZGMDY3NjgyMUMxMUU0OTFGMjg5OTcyN0NCOTY2OCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkJFRkYwNjczODIxQzExRTQ5MUYyODk5NzI3Q0I5NjY4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkJFRkYwNjc0ODIxQzExRTQ5MUYyODk5NzI3Q0I5NjY4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+LUyFSQAAAE1JREFUeNpi+P//PwMDg4gCE4hgAZIMTCCCGZWFjWDBxcJPsOLismLhokmwwl2FzZEkSRDBxSmGX4JMgpFILhEsRmxioPj9CyL+AQQYAH8vB4U8iEJSAAAAAElFTkSuQmCC);
        padding-bottom: 1px;
}



table.wikitable, th, table.wikitable > * > tr > th {
	background-color:#232828;
	color:#dcdcdc;
}

#preftoc li.selected a {
	background-image:none;
	color:#dcdcdc;
}

table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
 	border: 1px solid #333;
}

#pagehistory li{
  border: none;
}

#pagehistory li.selected{
background-color: #0F2A3F;
}


/**JQUI*/
#headertabs.ui-widget-content {
 background-color:#232828;
 background-image:none;
}

#headertabs .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
	background-color:transparent;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAYAAABHLFpgAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QsOFiYpbLwn+QAAADxJREFUGNNjYBgFpAGd1Fx2JgYGBnYmBgYGDiYGBgY2OIsdC4GQQFOHppcIU9iwGIrTNgTBysTAwMCAIABGBgJKNsFKuQAAAABJRU5ErkJggg==);
}

#headertabs .ui-widget-header{
        background-image:none;
        background-color: #393F3F;
}


#headertabs .ui-tabs-nav li{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAYAAABHLFpgAAAABmJLR…YGBgY2OIsdC4GQQFOHppcIU9iwGIrTNgTBysTAwMCAIABGBgJKNsFKuQAAAABJRU5ErkJggg==);
}

#headertabs .ui-tabs-nav li.ui-state-hover, 
#headertabs .ui-tabs-nav li.ui-state-active{
  border-color:  #0070dd;
}

#headertabs .ui-tabs-nav li, #preftoc li{
  border-color:  #CEDBDC;        
}

#headertabs .ui-tabs-nav li a,  #preftoc li a, #preferences legend, .htmlform-tip{
color:#0070dd;
}

.highlight-cell, td.diff-otitle, td.diff-ntitle{
  background-color:#393f3f;
}

td.diff-context, pre, textarea, #preferences fieldset, #preferences{
   background-color:#002945;
   color:#CEDBDC;                                    
}

#preferences{
background-image:none;
border-color: #002945;
}

pre{
  border-color: #0070dd;
}

fieldset{
  border-color: #002945;
}


.inner-panel, fieldset{
	background-color:#232828;
}

td.diff-addedline .diffchange {
background: #00536D;
}


.mw-plusminus-neg {
  color: #FA5C5C;
}

.mw-plusminus-pos {
color: #5FFF5F;
}

div.ui-widget-content{
color:#CEDBDC;
}



.skin-vector .mw-notification {
    background-color: #002945;
}

.editOptions {
    background-color: #393f3f;
}

div.vectorTabs li.new a, div.vectorTabs li.new a:visited, a.new, #p-personal a.new, a.new:visited, #p-personal a.new:visited {
    color: #9e00ff;
}

code {
    background-color: #002945;
}

ul#filetoc {
    background-color: #393f3f;
}

table.mw_metadata td, table.mw_metadata th {
    background-color: #393f3f;
}

.mw-datatable tr:hover td {
    background-color: #002945;
}
.mw-datatable td {
    background-color: #393f3f;
}

.mw-datatable th {
    background-color: #002945;
}



/***************
***************/
#content .icontinyl {
    padding-right: 0px;
}