MediaWiki:Common.css: Difference between revisions

Latest revision as of 02:11, 9 March 2024

/*    CSS placed here will be applied to all skins    */
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anta&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

body, .vector-feature-zebra-design-disabled body {
	font-family: Rubik, system-ui, Helvetica, Arial, sans-serif;
	font-size: 1rem;
	line-height: 1.5rem;
	color: #cbcbcb;
	background-color: rgb(17, 18, 22);
	margin: 10px;
	background-image: url(/backline_teal.png), url(/backline_teal_top.png);
	background-size: auto;
	background-repeat: no-repeat, no-repeat;
	background-position: center bottom 400px, center 2%;
}
#mw-page-base, .vector-feature-zebra-design-disabled #vector-main-menu-pinned-container .vector-main-menu {
	background-color: transparent;
  background-image: none;
}
.mw-logo {
	min-width: auto;
}
.vector-feature-zebra-design-disabled .vector-header-container {
	background-color: rgba(7, 8, 10, 0.49);
  backdrop-filter: blur(2px);
  border-radius: 30px;
  color: #cbcbcb;
	margin-bottom: 10px;
  border: 0px solid #000;
  position: relative;
	z-index: 1;
}
.vector-feature-zebra-design-disabled .mw-page-container {
  background-color: rgba(7, 8, 10, 0.49);
  backdrop-filter: blur(2px);
  border-radius: 10px;
  color: #cbcbcb;
	margin-bottom: 10px;
  border: 0px solid #000;
  z-index: 0;
	position: relative;
}
.vector-feature-zebra-design-disabled .vector-dropdown .vector-dropdown-content {
  background-color: rgba(7, 8, 10, 0.95);
  backdrop-filter: blur(2px);
  border-radius: 10px;
  color: #cbcbcb;
	margin-bottom: 10px;
  border: 0px solid #000;
  padding: 5px;
}
.vector-menu-tabs-legacy .selected {
	background-color: transparent;
}
.vector-menu-tabs-legacy .selected a {
	background-image: none;
	color: #56bbd2 !important;
  }
 .vector-menu-tabs-legacy li {
	background-image: none;
	height: 100%;
	margin: 0;
	padding: 0;
	line-height: 1.125em;
	white-space: nowrap;
  }
  .vector-menu-tabs-legacy li a {
	transition: .5s;
	color: #baf2ff;
		height: auto;
	background-color: #3C8FA240;
	cursor: pointer;
	border: 1px solid #baf2ff;
	border-radius: 10px;
	padding: 0.4rem;
	line-height: normal;
	text-shadow: black 0px 1px 1px;
	font-family: Anta, monospace;
	text-transform: uppercase;
}
 .vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown .vector-menu-heading {
	background-image: none;
  }
.mw-logo-icon {
	margin-left: -2.8em
}
 .vector-feature-main-menu-pinned-disabled .mw-logo {
margin-left: -30px;
}
.vector-main-menu-landmark {
	margin-left: 10px;
}
.mw-logo-container, .cdx-button:enabled, #simpleSearch > .cdx-button.cdx-button--fake-button--enabled {
	display: none;
  }
.mw-header .vector-typeahead-search-container {
	float: right;
	min-width: 290px
}
h1, h2, h3, h4, h5, h6, .mw-body h1, .mw-body-content h1, .mw-body-content h2 {
	font-family: Anta, monospace;
	color: #cbcbcb;
}
a, .vector-feature-zebra-design-disabled .vector-toc .vector-toc-link,   .vector-feature-zebra-design-disabled .vector-pinnable-header-toggle-button, #pt-userpage-2 a:not(.mw-selflink), .vector-menu-tabs .mw-list-item a, .vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a, .vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a, .vector-feature-zebra-design-disabled .vector-dropdown .mw-list-item a:not(.mw-selflink), .vector-menu-tabs .mw-list-item.selected a, .vector-menu-tabs .mw-list-item.selected a:visited {
	color: #3C8FA2;
	text-decoration: none;
	font-weight: bold;
	transition: .5s;
}

a:hover, .vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:hover, .vector-menu-dropdown .mw-list-item a:hover, .cdx-button:enabled, .cdx-button.cdx-button--fake-button--enabled, .vector-feature-zebra-design-disabled .vector-toc .vector-toc-link,   .vector-feature-zebra-design-disabled .vector-pinnable-header-toggle-button:hover, #pt-userpage-2 a:not(.mw-selflink):hover, .vector-menu-tabs .mw-list-item a:hover, .vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a:hover, .vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a:hover, .vector-feature-zebra-design-disabled .vector-dropdown .mw-list-item a:not(.mw-selflink):hover {
	color: #1a5765;
	text-decoration: none;
}
  .vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a,   .vector-menu-dropdown .mw-list-item a, .toctogglelabel {
	color: #3C8FA2;
	text-decoration: none;
}
  .vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited, a:visited,   .mw-parser-output a.extiw:visited, .mw-parser-output a.external:visited,  .vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a:not(.mw-selflink):visited, .vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a:not(.mw-selflink):visited {
   color: #3C8FA2;
	text-decoration: none;
  }
 .vector-menu-dropdown .vector-menu-heading {
	color: #3C8FA2;
	 padding: 0.5em 8px 6px;
  }
  .vector-menu-tabs .mw-watchlink.icon a {
  padding: 2.2em 0 0 0;
}
.vector-menu-tabs .mw-watchlink.icon a::before {
	top: .48em;
}
  .vector-menu-dropdown .vector-menu-content {
	background-color: rgba(30, 30, 34, .6);
		backdrop-filter: blur(3px);
		border-radius: 0 0 10px 10px;
		border-color: #baf2ff;
}
  .vector-search-box-input, .cdx-typeahead-search .cdx-text-input--has-start-icon .cdx-text-input__input, .cdx-search-input--has-end-button {
background-color:	#131315;
		border: 2px solid transparent;
		border-radius: 10px;
}
  .searchButton[name="go"], .cdx-search-input .cdx-text-input__icon.cdx-text-input__start-icon, .vector-icon { 
filter: invert(80%);
}
.editOptions { 
	background-color:	#131315;
	color: #cbcbcb;
}
.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	transition: .5s;
  color: #baf2ff;
  background-color: #3C8FA240;
  cursor: pointer;
  border: 1px solid #baf2ff;
  border-radius: 10px;
  padding: 6px;
  padding: 0.428571429rem;
  line-height: normal;
  text-shadow: black 0px 1px 1px;
  font-family: Anta, monospace;
  text-transform: uppercase;
}
#left-navigation { 
  margin-left: 11.5em;
}
.mw-editform #wpTextbox1 {
	background-color: rgb(30, 30, 34);
	color:#fff;
		border-radius: 10px 10px 0 0;
	border: 1px solid transparent;
	padding: 10px;
}
.toc, .toccolours,   .vector-feature-zebra-design-disabled .vector-toc {
 background-color: rgb(30, 30, 34);
	border-radius: 10px;
	border: 1px solid #000;
	padding: 10px;
}
  figure[typeof~="mw:File/Thumb"], figure[typeof~="mw:File/Frame"] {
 background-color: rgb(30, 30, 34);
	border-radius: 10px 10px 0 0;
	border: 0px solid #000;
	padding: 0px;
}
 figure[typeof~="mw:File/Thumb"] > figcaption, figure[typeof~="mw:File/Frame"] > figcaption {
  background-color: rgb(30, 30, 34);
	border-radius: 0 0 10px 10px;
	border-top: 1px solid #000;
   border-bottom: 0;
   border-left: 0;
   border-right: 0;
   box-shadow: rgba(0, 0, 0, 0.8) 0 0 10px;
}
 figure[typeof~="mw:File/Thumb"] > a:first-child > :first-child:not(.mw-broken-media), figure[typeof~="mw:File/Frame"] > a:first-child > :first-child:not(.mw-broken-media), figure[typeof~="mw:File/Thumb"] > span:first-child > :first-child:not(.mw-broken-media), figure[typeof~="mw:File/Frame"] > span:first-child > :first-child:not(.mw-broken-media) {
  background-color: rgb(30, 30, 34);
	border-radius: 10px;
	border: 0px solid transparent;
box-shadow: rgba(0, 0, 0, 0.8) 0 0 3px;
}
  .mw-footer li { 
	color: #586068;  
  }
  .wikitable {
   background-color: rgb(30, 30, 34);
	  border-radius: 10px;
	  border: 1px solid #000;
	  padding: 10px;
	  color: #cbcbcb;
  }
	.wikitable > tr > th, .wikitable > * > tr > th {
	  background-color: rgb(23, 23, 28);
  }
  pre, code, .mw-code {
   background-color: rgb(20, 20, 24);
	border: 0;
	color: #fff;
	padding: 5px;
  }
  .vector-feature-zebra-design-disabled .vector-toc .vector-toc-list-item-active > .vector-toc-link, .vector-feature-zebra-design-disabled .vector-toc .vector-toc-level-1-active:not(.vector-toc-list-item-expanded) > .vector-toc-link, .vector-feature-zebra-design-disabled .vector-toc .vector-toc-list-item-active.vector-toc-level-1-active > .vector-toc-link {
	color: inherit;	
}
  .vector-feature-zebra-design-disabled #vector-page-tools-pinned-container .vector-page-tools::after,   .vector-feature-zebra-design-disabled #vector-toc-pinned-container .vector-toc::after {
		background-image: none;
}
  .infobox {
	background-color: rgb(30, 30, 34);
	  border-radius: 10px;
	  border: 1px solid #000;
	  padding: 10px;
	color:#cbcbcb;
	margin:0.5em 0 0.5em 1em;
	padding:10px;
	float:right;
	clear:right;
	text-align:left;
	font-size:88%;
	line-height:1.5em
  }
  li.gallerybox div.thumb {
	  border: 1px solid #000;
	  background-color: rgb(23, 23, 28);
	}
  .catlinks {
	border: 1px solid #000;
	background-color: rgb(23, 23, 28);
	padding: 8px;
}
.details {
	text-align: center;
	  font-weight: bold;
	  background: #14141a;
}
  .tocnumber {
color: #cbcbcb;
}
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
 background-color: rgb(30, 30, 34);
	  border-radius: 10px;
	  border: 1px solid #000;
	  padding: 10px;
	color:#cbcbcb; 
}
.oo-ui-popupWidget-popup {
	background-color: rgba(7, 8, 10, 0.95);
	  backdrop-filter: blur(2px);
	  border-radius: 10px;
	  color: #cbcbcb;
	  border: 0px solid #000;
	  padding: 5px;
}

/*  Infobox template style  */
/* mrwonko: I omitted some unnecessary classes, see https://en.wikipedia.org/w/index.php?title=MediaWiki:Common.css&action=edit for the full file. */
/*.infobox {
    border: 1px solid #aaa;
    background-color: #f9f9f9;
    color: black;
    /* @noflip */
    margin: 0.5em 0 0.5em 1em;
    padding: 0.2em;
    /* @noflip */
    float: right;
    /* @noflip */
    clear: right;
    /* @noflip */
    text-align: left;
    font-size: 88%;
    line-height: 1.5em;
}*/
.infobox caption {
    font-size: 125%;
    font-weight: bold;
}
.infobox td,
.infobox th {
    vertical-align: top;
}
.infobox.bordered {
    border-collapse: collapse;
}
.infobox.bordered td,
.infobox.bordered th {
    border: 1px solid #aaa;
}
.infobox.bordered .borderless td,
.infobox.bordered .borderless th {
    border: 0;
}
.details {
text-align: center;
  font-weight: bold;
  background: #14141a;
}
@media (max-width: 600px) {
.vector-feature-zebra-design-disabled .vector-header-container { 
 min-width: unset;
}
img.mw-file-element {
  max-width: 210px;
  height: auto;
}
}