MediaWiki:Vector.css

From Stardew Modding Wiki
Jump to navigation Jump to search

Note: After publishing, 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 / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will affect users of the Vector skin */

/* Body Styling */
body {
  background: #0A0523 url("https://stardewmodding.wiki.gg/images/7/7b/Stardew_Background.png") no-repeat fixed center center / cover;
}

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

.mw-body {
  border: 1px solid #A7D7F9;
  border-radius: 6px;
  margin-right: 15px;
  background-color: rgba(255,255,255,.8);
  min-height: 500px;
  margin-bottom: 60px;
}

.mw-footer {
  background: rgba(0,0,0,.8) none repeat scroll 0% 0%;
  width: 100%;
  padding: 0px !important;
  margin-top: 20px !important;
  bottom: 0px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: #C2C8CF;
}

.mw-footer a {
  color: #FFF;
}

.mw-footer ul {
  padding-left: 190px;
  padding-right: 15px;
}

.mw-footer ul li {
  color:#C2C8CF;
}

.catlinks {
	 border: 1px solid #84AEEC;
	 background-color: rgba(199,242,254,.53);
}

#toc, .toc {
  background-color: rgba(255,255,255,.58);
}

.mw-body h1, .mw-body h2 {
	 font-family: 'Open Sans', sans-serif;
}

div.thumbinner {
	border: 1px solid #8DCAF0;
	background-color: rgba(255,255,255,.58);
}

/* Social Media Links */
div.sociallinks {
	float: right;
	padding-top: 9px;
}

.sociallinks img {
	-webkit-filter: opacity(25%) brightness(0);  /* Chrome, Safari, Opera */
	filter: opacity(25%) brightness(0);
}

.sociallinks img:hover {
	-webkit-filter: opacity(100%) brightness(100%);  /* Chrome, Safari, Opera */
	filter: opacity(100%) brightness(100%);
}

body.page-Stardew_Valley_Wiki div.sociallinks {
	display:none;
}

/* Mediawiki page tabs */
.vector-menu-tabs,
.vector-menu-tabs a,
.vector-menu-tabs li,
.vector-menu-tabs .selected,
#mw-head .vector-menu-dropdown h3 {
  background: none;
}

.vector-menu-tabs li a {
  color: #B7D2FF;
}

.vector-menu-tabs .new a, 
.vector-menu-tabs .new a:visited,
.vector-menu-dropdown h3 {
  color: #99BFFF;
}

.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited {
  color: #C6DBFF;
}

.vector-menu-dropdown .vector-menu-content-list {
  background-color: rgba(30,17,102,.67);
}

.vector-menu-dropdown li a {
  color: #C6DBFF;
}

#p-personal a, #p-personal a.new, p-personal a:visited {
	color: #99BFFF;
}

#p-personal a.hover, p-personal a:focus {
	color: #C6DBFF;
	text-decoration:none;
}

/* Account Creation Page */
.mw-createacct-benefits-list {
	padding: 10px 10px 10px 60px;
	border-radius: 12px;
	background-color: rgba(255,255,255,.58);
	border: 1px solid #8DCAF0;
}

.mw-number-text.icon-edits, .mw-number-text.icon-pages, .mw-number-text.icon-contributors {
	filter: brightness(.7);
}

/* Preferences Pages*/

#preferences {
	background-color: rgba(209,248,255,.67);
}

#preftoc li.selected a {
	background: rgba(209,248,255,.67);
}

/* Non-TOC headers */

div.notochh1 {
	font-size: 188%; 
	border-bottom: 1px solid #AAA; 
	padding-bottom: .17em; 
	margin-bottom: .6em;
}

/* Graphical borders */
#menuborder {
	border: 9px solid transparent;
	padding: 12px;
	-webkit-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Safari 3.1-5 */
	-o-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Opera 11-12.1 */
	border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch;
	background-color: rgba(255,255,255,.58);
}

#p-logo {
  margin-top: -11em;
}

#p-navigation {
  margin-top: 1.5em;
}
div#mw-panel {
	margin-top: 11em;
	border: 6px solid transparent;
	left: -12px;
	-webkit-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Safari 3.1-5 */
	-o-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Opera 11-12.1 */
	border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch;
	background-color: rgba(236, 216, 202, 0.8);
	padding-bottom: 15px;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}

#infoboxborder {
	border: 12px solid transparent;
	-webkit-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Safari 3.1-5 */
	-o-border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch; /* Opera 11-12.1 */
	border-image: url("https://stardewmodding.wiki.gg/images/d/d7/Menu_border.png") 15 stretch;
	background-color: rgba(255,255,255,.58);
	float:right;
	border-radius: 12px;
	margin-left: 15px;
	margin-bottom:15px;
	min-width: 300px;
}

/* Main Page Content */
body.page-Stardew_Valley_Wiki h1.firstHeading, body.page-Stardew_Valley_Wiki #contentSub, body.page-Stardew_Valley_Wiki #contentSub2 {
	display: none;
}

body.page-Stardew_Valley_Wiki div#bodyContent.mw-body-content {
	padding-top: 25px;
}


/* Navboxstyling */
#navbox {
	margin:auto;
	width:80%;
	border: 1px solid rgb(132,174,236);
	padding: 5px; 
	border-radius:11px;
	clear: both;
	margin-top: 15px;
}

/* Table Styling */
table {
	display: table;
	white-space: initial;
}
table.wikitable {
  background-color: transparent;
  border-collapse: separate;
  border: none;
}
table.wikitable > tr > th, table.wikitable > tr > td, table.wikitable > * > tr > th, table.wikitable > * > tr > td {
	border: 1px solid #8DCAF0;
	padding: 0.2em;
	background-color: rgba(255,255,255,.58);
}

table.wikitable > tr > th, table.wikitable > * > tr > th {
	background-color: #03A007;
	text-align: center;
	border-color: #007448;
	box-shadow: 0px 1px rgba(0,0,0,.3);
	color: white;
	text-shadow: 0 2px #00321f;
}

table.wikitable > tr > th a, table.wikitable > * > tr > th a {
	color:white;
}

#roundedborder {
	border:1px solid rgb(132,174,236);
	padding:5px;
	border-radius:11px;
	margin-top:15px;
}


/* Infobox Styling */

#infoboxtable {
	max-width:350px;
	width:100%;
}

#infoboxheader {
	text-align:center;
	font-size:24px;
	padding-top:5px;
	padding-bottom:5px;
	text-shadow: 0 1.5px 0 rgba(0,0,0,.2);
}

#infoboxsection {
	background-color:#03A007;
	vertical-align:top;
	padding-left:15px;
	padding-right:5px;
	width:105px;
	border-color:#007448;
	box-shadow: 0 1px rgba(0,0,0,.3);
	color: white;
	text-shadow: 0 2px #00321f;
}

#infoboxdetail {
	vertical-align:top;
	padding-left:3px;
	padding-right:12px;
}

#infoboxdetail p {
	margin: 0;
}

#infoboxfooter {
	width: 100%;
	padding-top: 5px;
}

#infoboxdetail ul {
	margin: 0 0 0 .9em;
}

#infoboxsep {
	text-align:center;
	background-color:#03A007;
	vertical-align:top;
	border-color:#007448;
	box-shadow: 0 1px rgba(0,0,0,.3);
	color: #FFF;
	text-shadow: 0 2px #00321F;
}

.pixelperfect, #pixelperfect {
	image-rendering: -moz-crisp-edges;
	image-rendering: -o-crisp-edges;
	image-rendering: -webkit-optimize-contrast;
	-ms-interpolation-mode: nearest-neighbor;
	image-rendering: crisp-edges;
	image-rendering: pixelated;
}

/* Location Infobox */
.location {
	max-width: 400px;
}
#locationimg img {
	max-width: 90%;
	height: auto;
}

/* Gallery Styling */
.villagergallery a {
	font-size:120%;
}
.villagergallery img {
	width:128px;
	height:128px;
}
.portraitgallery {
	text-align:left !important;
}
.portraitgallery img {
	width:128px;
	height:128px;
}

/* Template Styling */
/* Object Quality Stars */
#qualitycontainer {
	position:relative;
	height:48px;
	width:48px;
	text-align:left;
}
#qualitycontainermed {
	position:relative;
	height:32px;
	width:32px;
	text-align:left;
}
#qualitycontainersm {
	position:relative;
	height:24px;
	width:24px;
	text-align:left;
}
#qualitycontainer div.qualityindicator {
	text-align:left;
}
#qualitycontainermed div.qualityindicator {
	text-align:left;
}
#qualitycontainersm div.qualityindicator {
	text-align:left;
}

#qualityimage img {
	position: absolute;
}
#qualityimage p {
	margin: 0;
}

#recipeimage p {
	margin: 0;
}
#recipeimage img {
	position: absolute;
	opacity: .6;
	max-height: 48px;
	width: auto;
}

/* Quality Pricing */
div.qualitycontainerprice {
	margin-top: -7px;
	padding-right: 12px;
}

div.qualitycontainerprice span {
	padding-left: 20px;
}

div.qualitycontainerprice img {
	position: absolute;
	margin-top:2px;
}

#qualityprice {
	margin-top: -11px;
}

.no-wrap {
	white-space: nowrap;
}

/* Talk Page Headers */
#talkheadertitle {
	background-color: #03A007;
	text-align: center;
	color: #FFF;
	text-shadow: 0 2px #00321F;
	font-size: 120%;
}

#talkheaderbody {
	width: 80%;
	margin: 0 auto 1em;
	border: 1px solid rgb(170,170,170);
	background-color: rgba(255,255,255,.58);
	color: rgb(0,0,0);
}


/* Skill page tables */
.skillsubheader {
	text-align: center;
	font-size: 12px;
	background-color: rgba(255,255,255,.79);
}


/* Copyright Templates */
#c-fairuse {
	padding:10px;
	max-width:700px;
	margin: 0 auto;
	border: 1px solid #8DCAF0;
	background-color: rgba(255,255,255,.58);
}

#c-fairuse td {
	vertical-align: middle;
}

/* Alert Templates */
.alert {
	border: 3px solid rgb(68,74,73);
	border-radius: .5em;
	margin-left: auto;
	margin-right: auto;
	font-size: 14px;
	padding: 5px;
	margin-bottom: 15px;
	height: 80px;
	width: 50%;
	max-width: 700px;
}

.alert span.header {
	font-size: 22px;
}

.alert th {
	width: 100px;
}

.alert th img {
	text-align: center;
}

#stub {
	border-color:green;
	background-color: rgba(0,128,0,.05);
}

#construction {
	border-color:#97A50C;
	background-color: rgba(151,165,12,.05);
}

/* Responsive styling */
@media screen and (max-width: 1600px) {
	#mainbannerleft {
		display: none;
	}
	#mainbannermiddle {
		width: 60%;
	}
}

@media screen and (max-width: 1400px) {
	#menucontent {
		font-size: 12px;
	}
}

@media screen and (max-width: 1150px) {
	th#sidebar, td#sidebar, td#mainbannerright {
		display: none;
	}
}

@media screen and (max-width:700px) {
	.mw-body, #left-navigation {
		margin-left: 8px;
		margin-right: 8px;
	}
	div#mw-panel {
		display: none;
	}
	.mw-footer ul {
		padding-left: 15px;
	}
}

.noautonum .tocnumber {
	display: none;
}

/* Class for pixel art, to retain pixelated appearance when zoomed */
.pixels {
	 -ms-interpolation-mode: nearest-neighbor;	/* IE */
	 image-rendering: -webkit-optimize-contrast; /* UC Browser */
	 image-rendering: -webkit-crisp-edges;		 /* old Safari */
	 image-rendering: -moz-crisp-edges;			 /* Firefox */
	 image-rendering: pixelated;
}