MediaWiki:Mbhh.css: Difference between revisions

From Beyond These Stars Official Wiki
Added some color styling and some border images, page background.
added resource infobox styling
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* All CSS here will be loaded for users of the MBHH skin */
/* All CSS here will be loaded for users of the MBHH skin */
body {
body {
background-image: url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-right.png?9ba42),
background-image: url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-right.png?9ba42),
url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-left.png?30070),
url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-left.png?30070),
url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-bottom.png?ff4a7),
url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-bottom.png?ff4a7),
url(/Beyond_These_Stars/skins/MBHH/resources/images/game_bgs/BeyondTheseStars_bg.jpg?b363);
url(/Beyond_These_Stars/skins/MBHH/resources/images/game_bgs/BeyondTheseStars_bg.jpg?b363);
}
}


Line 14: Line 14:


div#mw-content {
div#mw-content {
  background-color: #090C0C;
background-color: #090C0C;
  background-image: url('/images/mbhh_bts/3/33/Player_Guide_BG_Recolored.png');
background-image: url('/images/mbhh_bts/3/33/Player_Guide_BG_Recolored.png');
  background-size: 100% auto;
background-size: 100% auto;
  background-repeat: no-repeat;
background-repeat: no-repeat;
}
}


Line 23: Line 23:


a, a:visited {
a, a:visited {
  color: #0EB4C3;
color: #0EB4C3;
}
}
a:hover, a:visited:hover {
a:hover, a:visited:hover {
  color: #7EDFF0;
color: #7EDFF0;
}
}
a.new {
a.new {
  color: #DA664F;
color: #DA664F;
}
}


Line 35: Line 35:


.mw-body .mw-parser-output h2::after {
.mw-body .mw-parser-output h2::after {
  border-bottom: solid 1px #4F8E88;
border-bottom: solid 1px #4F8E88;
}
}


Line 41: Line 41:


.toc {
.toc {
  display: inline-block;
display: inline-block;
  min-width: 50%;
min-width: 50%;
  margin: 3em 0 3em;
margin: 3em 0 3em;
  background-color: transparent;
background-color: transparent;
  border: 1px solid #4F8E88;
border: 1px solid #4F8E88;
  border-image-source: url('/images/mbhh_bts/b/bf/UI_tooltip_border_ornament.png');
border-image-source: url('/images/mbhh_bts/b/bf/UI_tooltip_border_ornament.png');
  border-image-width: 32px;
border-image-width: 32px;
  border-image-slice: 101 101 fill;
border-image-slice: 101 101 fill;
  border-image-repeat: repeat round;
border-image-repeat: repeat round;
  padding: 24px 48px;
padding: 24px 48px;
}
}
.mw-body .toctitle {
.mw-body .toctitle {
  border-bottom: solid 1px #CAECF2;
border-bottom: solid 1px #CAECF2;
}
}
.mw-body .toctitle h2 {
.mw-body .toctitle h2 {
  color: #CAECF2;
color: #CAECF2;
}
}


Line 62: Line 62:


.mw-body figure {
.mw-body figure {
  display: inline-block;
display: inline-block;
  float: right;
float: right;
  border: 1px solid #4B9797;
border: 1px solid #4B9797;
  background-color: transparent;
background-color: transparent;
  border-image-source: url('/images/mbhh_bts/4/42/UI_dark_teal_panel.png');
border-image-source: url('/images/mbhh_bts/4/42/UI_dark_teal_panel.png');
  border-image-width: 6px;
border-image-width: 6px;
  border-image-slice: 12 fill;
border-image-slice: 12 fill;
  padding: 4px 4px 0;
padding: 4px 4px 0;
}
}
.mw-body figure figcaption {
.mw-body figure figcaption {
  float: none;
float: none;
  width: 100%;
width: 100%;
  border: none;
border: none;
  background-color: transparent;
background-color: transparent;
}
}
.mw-body figure > a:first-child > :first-child:not(.mw-broken-media) {
.mw-body figure > a:first-child > :first-child:not(.mw-broken-media) {
  border: 1px solid #4B9797;
border: 1px solid #4B9797;
}
}


Line 84: Line 84:


.bts-player-guide {
.bts-player-guide {
  border: 1px solid #4F8E88;
border: 1px solid #4F8E88;
  border-radius: 12px;
border-radius: 12px;
  background-color: #112325;
background-color: #112325;
  border-image-source: url('/images/mbhh_bts/5/5a/Player_Guide_BG_2.png');
border-image-source: url('/images/mbhh_bts/5/5a/Player_Guide_BG_2.png');
  border-image-width: 16px;
border-image-width: 16px;
  border-image-slice: 29 fill;
border-image-slice: 29 fill;
  border-image-repeat; round;
border-image-repeat; round;
  padding: 8px 24px;
padding: 8px 24px;
  margin-right: 26%;
margin-right: 26%;
}
}


Line 99: Line 99:
/* Overrides for mini inner tables inside wikitables */
/* Overrides for mini inner tables inside wikitables */
.bts-resource-list tr, .bts-resource-list td, .bts-resource-list th {
.bts-resource-list tr, .bts-resource-list td, .bts-resource-list th {
  border: 0 !important;
border: 0 !important;
  background: transparent !important;
background: transparent !important;
  padding: 0 0;
padding: 0 0;
}
}


.bts-resource-list td:first-of-type {
.bts-resource-list td:first-of-type {
  text-align: end;
text-align: end;
}
}


Line 111: Line 111:


.bts-infobox-building {
.bts-infobox-building {
  float: right;
float: right;
  clear: right;
clear: right;
  max-width: 360px;
max-width: 360px;
  margin: 80px 0 48px 24px;
margin: 80px 0 48px 24px;
  border: 1px solid #3E7F77;
border: 1px solid #3E7F77;
  border-radius: 8px;
border-radius: 8px;
  background-color: #1C4F48;
background-color: #1C4F48;
  padding: 24px;
padding: 24px 2px;
}
}
.bts-infobox-building > div:not(:first-child) {
margin-top: 1.5em;
}
.bts-infobox-building-header {
.bts-infobox-building-header {
  position: relative;
position: relative;
}
}
.bts-infobox-building-header-icon {
.bts-infobox-building-header-icon {
  position: absolute;
position: absolute;
  bottom: 48px; right: -12px;
bottom: 24px; right: -12px;
  width: 160px;
width: 160px;
}
}
.bts-infobox-building-header h3 {
.bts-infobox-building-title {
  margin-bottom: 2px;
margin-bottom: 2px;
  padding-bottom: 0;
padding-bottom: 0;
  font-size: 1.75em;
font-size: 2em;
  line-height: 1em;
line-height: 1.25em;
}
    padding: 0 24px;
.bts-infobox-building h4 {
}
  margin-top: 2px;
.bts-infobox-building-subtitle {
  padding-top: 0;
margin-top: 2px;
  font-size: 1.25em;
padding: 0 24px;
  line-height: 1.25em;
font-size: 1.25em;
line-height: 1.25em;
}
.bts-infobox-building-subheader {
background-color: #2E726D;
font-weight: bold;
padding: 4px 24px;
}
}
.bts-infobox-building-description {
.bts-infobox-building-description {
  margin-right: 2em;
margin-left: 1em;
margin-right: 17%;
    font-size: 90%;
    font-style: italic;
    padding: 0 24px;
}
.bts-infobox-building-techtree {
padding: 0 24px;
}
}
.bts-infobox-building-construction {
.bts-infobox-building-construction {
  margin-top: 2em;
padding: 0 24px;
}
.bts-infobox-building-tasks {
padding: 0 24px;
}
.bts-infobox-building-tasks-table th {
text-align: left;
}
 
 
 
.bts-infobox-resource {
float: right;
clear: right;
width: 320px;
margin: 80px 0 48px 24px;
background-color: #224F52;
padding: 24px 0;
}
.bts-infobox-resource > div:not(:first-child) {
margin-top: 1em;
}
.bts-infobox-resource > div {
padding: 0 24px;
}
.bts-infobox-resource-header {
position: relative;
}
}
.bts-infobox-resource-header-icon {
position: absolute;
top: -64px; right: 8px;
}
.bts-infobox-resource-header-title {
font-size: 2em;
line-height: 1.25em;
margin-right: 100px;
}
.bts-infobox-resource-header-subtitle {
font-size: 1.25em;
line-height: 1.25em;
}
div.bts-infobox-resource-subheader {
background-color: #112325;
font-weight: bold;
padding-top: 4px;
padding-bottom: 6px;
}
.bts-infobox-resource table {
border-collapse: collapse;
}
.bts-infobox-resource table th {
text-align: left;
}
.bts-infobox-resource table tr:not(:last-child) td {
padding-bottom: 18px;
border-bottom: 1px solid #2E726D;
}
.bts-infobox-resource table th:not(:last-child),
.bts-infobox-resource table td:not(:last-child) {
padding-right: 18px;
}

Latest revision as of 20:01, 10 October 2026

/* All CSS here will be loaded for users of the MBHH skin */
body {
	background-image: url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-right.png?9ba42),
	url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-left.png?30070),
	url(/Beyond_These_Stars/skins/MBHH/resources/images/shade-bottom.png?ff4a7),
	url(/Beyond_These_Stars/skins/MBHH/resources/images/game_bgs/BeyondTheseStars_bg.jpg?b363);
}

.mw-wiki-logo {
	background-size:120% !important;
}



div#mw-content {
	background-color: #090C0C;
	background-image: url('/images/mbhh_bts/3/33/Player_Guide_BG_Recolored.png');
	background-size: 100% auto;
	background-repeat: no-repeat;
}



a, a:visited {
	color: #0EB4C3;
}
a:hover, a:visited:hover {
	color: #7EDFF0;
}
a.new {
	color: #DA664F;
}



.mw-body .mw-parser-output h2::after {
	border-bottom: solid 1px #4F8E88;
}



.toc {
	display: inline-block;
	min-width: 50%;
	margin: 3em 0 3em;
	background-color: transparent;
	border: 1px solid #4F8E88;
	border-image-source: url('/images/mbhh_bts/b/bf/UI_tooltip_border_ornament.png');
	border-image-width: 32px;
	border-image-slice: 101 101 fill;
	border-image-repeat: repeat round;
	padding: 24px 48px;
}
.mw-body .toctitle {
	border-bottom: solid 1px #CAECF2;
}
.mw-body .toctitle h2 {
	color: #CAECF2;
}



.mw-body figure {
	display: inline-block;
	float: right;
	border: 1px solid #4B9797;
	background-color: transparent;
	border-image-source: url('/images/mbhh_bts/4/42/UI_dark_teal_panel.png');
	border-image-width: 6px;
	border-image-slice: 12 fill;
	padding: 4px 4px 0;
}
.mw-body figure figcaption {
	float: none;
	width: 100%;
	border: none;
	background-color: transparent;
}
.mw-body figure > a:first-child > :first-child:not(.mw-broken-media) {
	border: 1px solid #4B9797;
}



.bts-player-guide {
	border: 1px solid #4F8E88;
	border-radius: 12px;
	background-color: #112325;
	border-image-source: url('/images/mbhh_bts/5/5a/Player_Guide_BG_2.png');
	border-image-width: 16px;
	border-image-slice: 29 fill;
	border-image-repeat; round;
	padding: 8px 24px;
	margin-right: 26%;
}



/* Overrides for mini inner tables inside wikitables */
.bts-resource-list tr, .bts-resource-list td, .bts-resource-list th {
	border: 0 !important;
	background: transparent !important;
	padding: 0 0;
}

.bts-resource-list td:first-of-type {
	text-align: end;
}



.bts-infobox-building {
	float: right;
	clear: right;
	max-width: 360px;
	margin: 80px 0 48px 24px;
	border: 1px solid #3E7F77;
	border-radius: 8px;
	background-color: #1C4F48;
	padding: 24px 2px;
}
	.bts-infobox-building > div:not(:first-child) {
		margin-top: 1.5em;
	}
	.bts-infobox-building-header {
		position: relative;
	}
		.bts-infobox-building-header-icon {
			position: absolute;
			bottom: 24px; right: -12px;
			width: 160px;
		}
	.bts-infobox-building-title {
		margin-bottom: 2px;
		padding-bottom: 0;
		font-size: 2em;
		line-height: 1.25em;
    	padding: 0 24px;
	}
	.bts-infobox-building-subtitle {
		margin-top: 2px;
		padding: 0 24px;
		font-size: 1.25em;
		line-height: 1.25em;
	}
	.bts-infobox-building-subheader {
		background-color: #2E726D;
		font-weight: bold;
		padding: 4px 24px;
	}
	.bts-infobox-building-description {
		margin-left: 1em;
		margin-right: 17%;
	    font-size: 90%;
	    font-style: italic;
	    padding: 0 24px;
	}
	.bts-infobox-building-techtree {
		padding: 0 24px;
	}
	.bts-infobox-building-construction {
		padding: 0 24px;
	}
	.bts-infobox-building-tasks {
		padding: 0 24px;
	}
	.bts-infobox-building-tasks-table th {
		text-align: left;
	}



.bts-infobox-resource {
	float: right;
	clear: right;
	width: 320px;
	margin: 80px 0 48px 24px;
	background-color: #224F52;
	padding: 24px 0;
}
	.bts-infobox-resource > div:not(:first-child) {
		margin-top: 1em;
	}
	.bts-infobox-resource > div {
		padding: 0 24px;
	}
	.bts-infobox-resource-header {
		position: relative;
	}
		.bts-infobox-resource-header-icon {
			position: absolute;
			top: -64px; right: 8px;
		}
		.bts-infobox-resource-header-title {
			font-size: 2em;
			line-height: 1.25em;
			margin-right: 100px;
		}
		.bts-infobox-resource-header-subtitle {
			font-size: 1.25em;
			line-height: 1.25em;
		}
	div.bts-infobox-resource-subheader {
		background-color: #112325;
		font-weight: bold;
		padding-top: 4px;
		padding-bottom: 6px;
	}
	.bts-infobox-resource table {
		border-collapse: collapse;
	}
		.bts-infobox-resource table th {
			text-align: left;
		}
		.bts-infobox-resource table tr:not(:last-child) td {
			padding-bottom: 18px;
			border-bottom: 1px solid #2E726D;
		}
		.bts-infobox-resource table th:not(:last-child), 
		.bts-infobox-resource table td:not(:last-child) {
			padding-right: 18px;
		}