MediaWiki:Vector.css

From Canopus
Revision as of 19:21, 4 August 2019 by Benjamin Ingram (talk | contribs) (Created page with "CSS placed here will affect users of the Vector skin: GENERAL / GLOBAL: body { background-image: url("http://canopus.myrpg.space/wiki/images/e/e9/Canopus_Over_Car...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* CSS placed here will affect users of the Vector skin */

/* GENERAL / GLOBAL */

body 
{
background-image: url("http://canopus.myrpg.space/wiki/images/e/e9/Canopus_Over_Carpathia.jpg");
background-color: #050c10;
margin-left: 20px;
margin-right: 20px;
font-family: "Liberation Sans", Arial, Helvetica, sans-serif; 
height: 100%;
background-position: left top;
background-repeat: no-repeat;
background-attachment: fixed;
}

h1, h2, h3, h4, h5, h6 
{
font-family: sans-serif !important;
color: #f8f8f8;
font-variant: small-caps;
}

#mw-page-base 
{
background: transparent;
}

div#content 
{
background-color: #050c10;
opacity: 0.9;
filter: alpha(opacity=90); /* For IE8 and earlier */
border: 1px solid #587995;
color: #f8f8f8;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
}

a
{
color: #FFE16D;
}

a:visited 
{
color: #e5ca60;
}

div#content a.external   
{
color: #ffc66d;
}

div#content a.external:visited
{
color: #f0ba66;
}
 
a.new:visited, a.new 
{ 
color: #bc1919;
}

/* MAIN PAGE */

/* Hides the page title on the main page */
body.page-Main_Page h1.firstHeading 
{ 
display: none; 
}


#welcomeBox
{
width: 75%;
border: 2px solid #78a9c6; 
margin-left: auto;
margin-right: auto; 
margin-bottom: 10px;
padding: 6px; 
background: #143849;
height: auto;
text-align: center;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 5px;
line-height: 1em;
}


#welcomeHeader
{
font-family: sans-serif;
color: #f8f8f8;
font-size: 400%;  
-webkit-text-shadow:0 0 20px turquoise;
-moz-text-shadow: 0 0 20px turquoise; 
text-shadow:0 0 20px turquoise;
margin-left: 5px; 
margin-right: 5px;
font-variant: small-caps;
}


.aboutBox
{ 
margin: 10px; 
padding: 6px; 
background: #102530;
color: #f8f8f8;
height: auto;
background-image: url('/w/images/f/f4/About_Box.png');
background-size: auto 100%;
background-position: left center; 
background-repeat: no-repeat;
border: 1px solid #78a9c6;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f; 
border-radius: 5px;
}

#aboutText
{
padding-left: 290px;
}


.mainPageBox
{
background: #102530;
border: 1px solid #78a9c6; 
margin: 10px; 
padding: 6px; 
height: auto;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 5px;
}


.boxHeader
{
border-bottom: 1px solid #E8FCFF;
padding: 0px 3px 3px 3px;
text-align: center;
color: #E8FCFF;
font-weight: bold;
font-size: 115%;
font-variant: small-caps;
-webkit-text-shadow:0 0 20px turquoise;
-moz-text-shadow: 0 0 20px turquoise; 
text-shadow:0 0 20px turquoise;
}


.boxFooter
{
border: 0; 
width: 100%; 
margin-bottom: 3px;
margin-top: 10px; 
text-align:center;
font-weight: bold;
}



/* TABS */

.vectorTabs 
{
margin-left: 20px;
}

div.vectorMenu h5 
{
border-bottom: 1px solid #78a9c6;
}

div.vectorTabs li a 
{ 
color: #f8f8f8;
}



/* The drop down tabs */
#ca-delete, #ca-move, #ca-watch, #ca-unprotect, #ca-protect, #ca-purge, .menu
{
background-color: #11374f;
border: 1px solid #78a9c6;
}

div.vectorMenu h5 
{
border-bottom: 1px solid #78a9c6;
}

div.vectorMenu li a
{
color: #FFE16D;
}


/* Inactive tabs */
div.vectorMenu, div.vectorTabs ul li
{
background-color: transparent;
color: #f8f8f8;
background-image: url('/w/images/7/78/UnselectedTab.PNG');
background-position: bottom center;
background-repeat: repeat-x;
   
}

/* Active tabs */
div.vectorMenu:hover, div.vectorMenu.va-hover-active, div.vectorTabs ul li:hover, div.vectorTabs ul li.selected, div.vectorTabs ul li.selected:hover
{
background-color: transparent;
background-image: url('/w/images/8/82/SelectedTab.PNG');
color: #f8f8f8;
}

/* Tab border */
div.vectorTabs li a 
{
background-image: url('/w/images/7/7b/TabDiv.png');
background-position: bottom right;
background-repeat: no-repeat;
background-color: transparent;
color: #f8f8f8;
}

div.vectorTabs, div.vectorMenu h5 a, div.vectorTabs ul, mw-head div.vectorMenu h5 
{
background-image: url('/w/images/7/7b/TabDiv.png');
background-color: transparent;

}

div.vectorTabs span 
{
background-image: none;
}

.vectorTabs 
{
margin-left: 20px;
}

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


#ca-watch 
{
background: none;
background-color: none;
border: none;
}

#ca-unwatch 
{
background: none;
background-color: none;
border: none;
}

div.vectorMenu h3 a 
{
background-image: none;
}


/* LEFT NAV */

#mw-panel.collapsible-nav .portal 
{
background-image: url('/w/images/8/87/NavDivider.png');
margin: 8px;
}


 
div#mw-panel div.portal div.body ul li a 
{
color: #587995;
}
 
div#mw-panel div.portal div.body ul li a:visited 
{
color: #587995;
}
 
#mw-panel.collapsible-nav .portal h3 a 
{
color: #C1E8FF;
font-weight: bold; 
}

#mw-panel.collapsible-nav .portal.collapsed h3 a 
{
color: #C1E8FF;
font-weight: bold; 
}

div#mw-panel 
{
padding-left: 35px;
}

/* MISC */

#p-personal 
{
color: #f8f8f;
}

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

.editOptions 
{
background-color: #2B4F65;
}

div#simpleSearch 
{
margin-right: 4px;
}

.infobox 
{
margin: 10px; 
background-color: #102530;
border-collapse: collapse;
border: 1px solid #78a9c6;
-webkit-box-shadow: 0 0 20px #2f607f;
-moz-box-shadow: 0 0 20px #2f607f;
box-shadow: 0 0 20px #2f607f;
float: right;
clear: right;
width: 400px;
}

.infobox th
{
font-size: 1.7em;
text-align: center;
background-color: #78a9c6;
padding: 6px;
color: #102530;
}

.infobox tr 
{
border: 1px solid #78a9c6;
}
 
.infobox td 
{
padding: 4px;
}


input[type="submit"]
{
padding: 3px 5px 3px 5px;
background: #ffe16d;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
-o-border-radius: 6px 6px 6px 6px;
font-weight: bold;
padding: 5px;
border: none;
}
 
input:hover[type="submit"], input:focus[type="submit"]
{
padding: 3px 5px 3px 5px;
background: #ffeeb6;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
-o-border-radius: 6px 6px 6px 6px;
font-weight: bold;
padding: 5px;
border: none;
}
 
input:active[type="submit"]
{
padding: 3px 5px 3px 5px;
background: #ffeeb6;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
-o-border-radius: 6px 6px 6px 6px;
font-weight: bold;
padding: 5px;
border: none;
}

div.thumbinner
{
border: none;
background: #102530;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
}

.thumbcaption
{
text-align: center !important;
}


/* POLL */
 
.ajaxpoll 
{ 
width: 80%;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
margin-bottom: 5px;
background: #11374f !important;
}
 
.ajaxpoll-id-info 
{
visibility: hidden;
}


.ajaxpoll .ajaxpoll-answer-vote div
{
background-color: #3AB7FF !important;
}

.ajaxpoll .ajaxpoll-ajax
{
background-color: #3AB7FF !important;
}

.catlinks 
{
background-color: #11374f;
border: 1px solid #587995;
}
 
code 
{ 
background-color: black;
color: #f8f8f8;
}


#preferences 
{
color: black;
}

ul#filetoc
{
background-color: #2B4F65;
}


#toc, .toc
{
background: #102530;
border: 1px solid #78a9c6; 
margin: 7px; 
padding: 6px; 
height: auto;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
border-radius: 5px;
margin-top: 17px;
}

.skin-vector .mw-notification 
{
background: rgb(10, 10, 10);
background: rgba(10, 10, 10, 0.90);
}

.mw-ui-button.mw-ui-primary 
{
background-color: #ffe16d;
background-image: none;
text-shadow: none;
border: 1px solid #ebcc54;
color: black;
}

.mw-ui-button.mw-ui-primary:hover 
{
background-color: #ffeeb6;
background-image: none;
text-shadow: none;
border: 1px solid #f2d462;
color: black;
}

#mw-createaccount-join 
{
box-shadow: none;
}

.mw-ui-button.mw-ui-constructive 
{
background-color: #ffe16d;
background-image: none;
text-shadow: none;
border: 1px solid #ebcc54;
color: black;
}

.mw-ui-button.mw-ui-constructive:hover, .mw-ui-button.mw-ui-constructive.mw-ui-hover 
{
background-color: #ffeeb6;
background-image: none;
text-shadow: none;
border: 1px solid #f2d462;
color: black;
}

#bodyContent div.mw-number-text h3
{
color: #eaeaea;
}


div.mw-number-text
{
color: #eaeaea;
}

.mw-ui-vform label
{
color: #eaeaea;
}


table.wikitable
{
color: #eaeaea;
background: #102530;
border: 1px solid #78a9c6;
-webkit-box-shadow:0 0 20px #2f607f;
-moz-box-shadow: 0 0 20px #2f607f;
box-shadow: 0 0 20px #2f607f;
}

table.mw_metadata td 
{
color: #eaeaea;
background: rgb(10, 10, 10);
}

table.wikitable > * > tr > th 
{
text-align: center;
background-color: #78a9c6;
color: #102530;
}


table.mw_metadata th 
{
color: #eaeaea;
background: rgb(10, 10, 10);
}

.postedit
{
background-color: #2B4F65;
border: 1px solid #587995;
color: #f8f8f8;
box-shadow: none !important; 
}

table.diff
{
    background: #102530;
    border: 1px solid #78a9c6;
}


td.diff-deletedline .diffchange, td.diff-addedline .diffchange
{
    background: #1C4154;
}

td.diff-context
{
    background: #235168;
}

table.diff td div
{
   color: #f8f8f8;
}

div#mw-head div.vectorMenu h3
{
  background-image: url('/w/images/7/7b/TabDiv.png');
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: transparent;
  color: #f8f8f8;
}


div.vectorMenu h3 span {
color: #f8f8f8;
}

div#mw-panel div.portal
{
    background-image: url('/w/images/8/87/NavDivider.png');
    background-size:100px 1px;
}

div#mw-panel div.portal h3
{
color: #f8f8f8;
}


.mw-ui-input
{
border: 1px solid #78a9c6;
background-color: #143849;
color: #f8f8f8;
}

.mw-search-formheader
{
border: 1px solid #78a9c6;
background-color: #143849;
}

.mw-search-formheader div.search-types ul li.current a
{
color: #FFE16D;
}

.mw-search-formheader div.search-types ul li a
{
color: #e5ca60;
}

li.gallerybox div.thumb
{
border: none;
background: #102530;
-webkit-box-shadow:0 0 20px #2f607f; 
-moz-box-shadow: 0 0 20px #2f607f; 
box-shadow:0 0 20px #2f607f;
}


/* Nav Box */
 
.navbox 
{ 
    background-color: #143849;
    border-collapse: collapse;
    border: 1px solid #276E8E;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    text-align: center;  
    width: 80%;
    -webkit-box-shadow: 0 0 20px #2f607f;
    -moz-box-shadow: 0 0 20px #2f607f;
    box-shadow: 0 0 20px #2f607f;
}
 
.navbox td {
    padding: 4px;
    border: 1px solid #276E8E;
    text-align: center;
}
 
.navbox th {
    background-color: #78a9c6;
    color: #143849 !important;
    font-weight: bold; font-size: 115%;
    font-variant:small-caps;
    border: 1px solid #276E8E;
}
 
.navbox th a:visited {
    color: #143849!important;
}
 
.navbox th a {
    color: #143849 !important;
}

div#simpleSearch #searchButton, div#simpleSearch #mw-searchButton
{
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

.TablePager {
    background-color: #143849;
    border-collapse: collapse;
    border: 1px solid #78a9c6;
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
    text-align: center;  
    -webkit-box-shadow: 0 0 20px #2f607f;
    -moz-box-shadow: 0 0 20px #2f607f;
    box-shadow: 0 0 20px #2f607f;
}

.TablePager th {
    background-color: #78a9c6;
    color: #143849 !important;
    font-weight: bold; font-size: 115%;
    font-variant:small-caps;
    border: 1px solid #78a9c6;
}

.TablePager td {
    padding: 4px;
    border: 1px solid #78a9c6;
    text-align: center;
   background-color: #143849;
}

.TablePager tr:hover td {
background-color: #205872;
}


#contentSub, #contentSub2
{
color: #f8f8f8;
}

pre, .mw-code
{
background: #102530;
color: #f8f8f8;
}


.mw-search-profile-tabs
{
background-color: #102530;
}

.mw-search-profile-tabs div.search-types ul li.current a
{
color: #f8f8f8;
}

#pagehistory li.selected 
{
    background: #143849;
}

/* ADDED CSS */

/* For Advancement Table */
.ItemRight {
    border-right-style: hidden !important;
    padding-left: 3px !important;
    padding-right: 0px !important;
    text-align: right;
}

/* For Stars Tooltip Test */
.stars {
	position: relative;
	display: inline-block;
	color: #D4AF37;
	border-bottom: 1px dotted white;
}

.stars .tooltip {
	visibility: hidden;
	width: 100px;
	background-color: rgba(43, 79, 101, 0.70);
	color: #f8f8f8;
	text-align: center;
	padding: 3px;
	border-radius: 3px;
	position: absolute;
	z-index: 1;
	bottom: 100%;
	left: 50%; 
	margin-left: -50px;
}

.stars:hover .tooltip {
	visibility: visible;
}

/* For Skill Points Tooltip */
.sp {
	color: #FFFFFF;
	display: inline-block;
	position: relative;
}

.sp .tooltip {
	background: #333;
	background: rgba(0,0,0,.8);
	border-radius: 5px;
	border-width: 2px;
	border-style: solid;
	border-color: white white white white ;
	bottom: 100%;
	color: #fff;
	content: attr(title);
	left: 50%; 
	margin-left: -35px;
	padding: 5px 5px;
	position: absolute;
	text-align: center;
	visibility: hidden;
	width: 70px;
	z-index: 1;
}

.sp:hover .tooltip {
	visibility: visible;
}

/* For Mobile Browser Div Clear Both */
@media screen and (max-width: 1275px) {
	.mobileclear:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
}

/* START For Away Team Skills Table */
.ATSLeft {
	border-left:2px solid gold !important;
}

/* For Mission Page Reward Table */
.MROuter {
  display:table;
  text-aligh:center;
  margin:auto;
  background-color:#102530;
 }

.MRTitle {
  font-weight:bold;
  background-color:#78a9c6;
  text-align:center;
  display:block;
  padding:3px;
  color:black;
 }

@media screen and (max-width: 1100px) {
.MROuter {
 width:400px;
 }
.MRIList {
 width:400px;
 }
}

.MRIList {
  display:inline-block;
  border:solid 1px grey;
  background-color:transparent;
  padding-right:5px;
  text-align:initial;
 }

.MRDif {
  text-align:center;
  background-color:transparent;
  margin-right:-5px;
 }

.ATSOuter {
	display: table;
	background-color: #102530;
	text-align: center;
	border: 1px solid lightgrey;
}
.ATSData {
	border-top-style: solid;
	border-right-style: solid;
	border-color: lightgrey;
	border-top-width: 1px;
	border-right-width: 1px;
	height: 3.2em;
	padding: 5px;
	min-width: 2.2em;
	display: block;
}
.ATSTitle {
	background: rgb(120, 169, 198);
	color: black;
	font-weight: bold;
	display: table-caption;
}
.ATSLevel {
	display: table-cell;
	vertical-align: bottom;
}
.ATSSkill {
	display: table-cell;
	padding-top: 2px;
	border-top: 1px solid lightgrey;
}
.ATSSRarity {
	display: table-cell;
	border-style: solid;
	border-color: gold;
	border-width: 0px 0px 0px 2px;
}
.ATSLevelH {
	display: none;
	vertical-align: bottom;
}
.ATSNarrow {
	display: table-cell;
}
@media screen and (max-width: 1600px) {
	.ATSLevelH {
		display: table-cell;
		border-top: 1px solid lightgrey;
		padding-bottom: 2px;
	}
	.ATSNarrow {
		display: table-row;
	}
	.ATSSRarity {
		border-width: 0px 2px 2px 2px;
	}
	.ATSLevel {
		padding-bottom:2px;
	}
	.ATSData {
		width:5.1em;
	}
}
/* END For Away Team Skills Table */

#footer-icons {
    display: none;
}


/* Start of Ambox */
.ambox {
    background-color: #282828;
    border-bottom-color: #383838;
    border-right-color: #383838;
    border-top-color: #383838;
    border-collapse: collapse;
    font-size: 95%;
    margin: 0 auto 2px auto;
    width: 80%;
}

.ambox-gray {
    border-left-color: #383838;
}

.ambox.ambox-tiny {
    font-size: 90%;
    margin: 2px 0;
    width: auto;
}

.ambox + .ambox {
     margin-top: -2px;
}

.ambox-text {
     padding: 0.25em 0.5em;
}

.ambox-image {
     padding: 2px 0px 2px 0.5em;
     text-align: center;
     width: 60px;
}

.ambox-tiny .ambox-image {
     padding: 2px 0.5em;
     text-align: left;
     width: auto;
}

/* Ambox colors */
.ambox-blue {
     border-left: 10px solid #1e90ff;
}

.ambox-red {
     border-left: 10px solid #b22222;
}

.ambox-orange {
     border-left: 10px solid #f28500;
}

.ambox-yellow {
     border-left: 10px solid #f4c430;
}

.ambox-purple {
     border-left: 10px solid #9932cc;
}

.ambox-gray {
     border-left: 10px solid #bba;
}

.ambox-green {
     border-left: 10px solid #228b22;
}

/* Ambox small text */
.amsmalltext {
     font-size: smaller;
     margin-left: 0.8em;
     margin-top: 0.5em;
}
/* End of Ambox */


/* Start of Ombox */
table.ombox {
    margin: 4px 10%;
    border-collapse: collapse;
    border: 1px solid #78a9c6;       /* Default "notice" gray */
    background: #102530;
}

table.ombox-notice {
    border: 1px solid #a2a9b1;       /* Gray */
}
table.ombox-speedy {
    border: 2px solid #b32424;    /* Red */
    background: #fee7e6;             /* Pink */
}
table.ombox-delete {
    border: 2px solid #b32424;    /* Red */
}
table.ombox-content {
    border: 1px solid #f28500;    /* Orange */
}
table.ombox-style {
    border: 1px solid #fc3;    /* Yellow */
}
table.ombox-move {
    border: 1px solid #9932cc;    /* Purple */
}
table.ombox-protection {
    border: 2px solid #a2a9b1;       /* Gray-gold */
}
/* End of Ombox */

/* Tags Table */
table.mw-datatable
{
color: #eaeaea;
background: #102530;
border: 1px solid #78a9c6;
-webkit-box-shadow:0 0 20px #2f607f;
-moz-box-shadow: 0 0 20px #2f607f;
box-shadow: 0 0 20px #2f607f;
}