MediaWiki:Theme-dark.css

From Brawlhalla 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.
/**
 * The SCSS code for this CSS can be seen at [[User:Diriector Doc/Theme-dark.scss]]
 **/

.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,
#filetoc, .mw-prefs-buttons, .catlinks {
	background: #05131d;
	background: rgba(0, 13, 22, 0.75);
}

html {
	scrollbar-color: #686868 #424242;
}

body {
	background: url(https://brawlhalla.wiki.gg/images/c/c4/Site-background-dark.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

#mw-page-base, #mw-head-base {
	border: none;
	background: transparent;
}

#mw-panel div.portal h3 {
	color: #F37F20;
	background-image: linear-gradient(90deg, transparent, #F37F20, transparent);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% 1px;
}
#mw-panel div.portal .body a span {
	color: white;
	text-shadow: 1px 1px 0.1em #000000;
}

#mw-head div.vectorTabs {
	background-color: transparent;
	background-image: none;
	height: 33px;
	margin-top: 8px;
}
#mw-head div.vectorTabs #ca-watch, #mw-head div.vectorTabs #ca-unwatch {
	height: 25px;
}
#mw-head div.vectorTabs #ca-watch a, #mw-head div.vectorTabs #ca-unwatch a {
	padding-top: 200%;
	height: 100%;
}
#mw-head div.vectorTabs a {
	color: white;
	font-weight: bold;
	text-decoration: none;
	padding: 0px;
	background: transparent;
	height: auto;
}
#mw-head div.vectorTabs ul {
	background-color: transparent;
	background-image: none;
}
#mw-head div.vectorTabs ul li {
	background-color: transparent;
	background-image: none;
}
#mw-head div.vectorTabs ul li span {
	background: #044fae;
	display: inline-block;
	border: 1px solid #044fae;
	border-radius: 4px 4px 4px 4px;
	padding: 2px 10px;
	margin: 0 3px 0 3px;
	height: 19px;
	text-align: center;
}
#mw-head div.vectorTabs ul li#ca-ve-edit a:not(:has(span)) {
	background: #044fae;
	border: 1px solid #044fae;
	border-radius: 4px;
	padding: 2px 10px;
	margin: 0 3px;
	height: 25px;
}
#mw-head div.vectorTabs ul li.selected {
	color: white;
}

.mw-body {
	background: #000d16;
	background: rgba(0, 0, 0, 0.75);
	border: 1px solid #044fae;
	border-radius: 2px;
	color: #fff;
	box-sizing: border-box;
}
.mw-body a {
	text-decoration: none;
	color: #ffed2e;
	background: 0 0;
}
.mw-body a:visited {
	color: #fbc10f;
}
.mw-body a:hover {
	color: #fff694;
}
.mw-body a.tabber__tab:visited {
	color: #ffed2e;
}
.mw-body a.tabber__tab[aria-selected=true], .mw-body a.tabber__tab[aria-selected=true]:visited {
	color: #044fae;
}
.mw-body a.external, .mw-body a.external:visited {
	color: #ffee33;
	background-image: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgdmlld0JveD0iMCAwIDEyIDEyIj48cGF0aCBmaWxsPSIjZmZlZDJlIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMSAxSDZsMiAyIC4zLjMtNCA0IC42LjcgNC00SDlsMiAyVjFaTTIgMmgydjFIMnY3aDdWOGgxdjJhMSAxIDAgMCAxLTEgMUgyYTEgMSAwIDAgMS0xLTFWM2ExIDEgMCAwIDEgMS0xWiIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+);
	background-origin: padding-box;
	background-position-x: 100%;
	background-position-y: 50%;
	background-repeat: no-repeat;
	padding-right: 1em;
}
.mw-body a.external:hover, .mw-body a.external:visited:hover {
	color: #fff799;
}
.mw-body a.new, .mw-body a.new:visited {
	color: #ba0000;
}
.mw-body a.new:hover, .mw-body a.new:visited:hover {
	color: #ff2121;
}
.mw-body a.extiw {
	color: #42b6f0;
}
.mw-body a.extiw:hover {
	color: #a1daf7;
}
.mw-body a.extiw:visited {
	color: #a65af2;
}
.mw-body a.extiw:visited:hover {
	color: #cca1f7;
}
.mw-body .mw-continue-editing a, .mw-body .mw-continue-editing a:visited {
	color: #044fae;
}
.mw-body span.mw-editsection-bracket a:hover, .mw-body span.mw-editsection-bracket a:visited:hover {
	color: #fff694;
}

.autocomment a, .autocomment a:visited {
	color: #808080;
}
.autocomment a:hover, .autocomment a:visited:hover {
	color: #b3b3b3;
}

.vector-menu-tabs .mw-watchlink.icon a:before {
	top: 5px;
}

#simpleSearch {
	background: #202020;
	border: 1px solid #404040;
}
#simpleSearch input {
	background: transparent;
}
#simpleSearch #searchInput {
	color: #e0e0e0;
	width: 100%;
	padding: 0.2em 0 0.2em 0.2em;
	border: none;
}
#simpleSearch #searchButton {
	background-image: linear-gradient(transparent, transparent), url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2213%22%3E %3Cg fill=%22none%22 stroke=%22%2354595d%22 stroke-width=%222%22%3E %3Cpath d=%22M11.29 11.71l-4-4%22/%3E %3Ccircle cx=%225%22 cy=%225%22 r=%224%22/%3E %3C/g%3E %3C/svg%3E");
	background-position: center center;
	background-repeat: no-repeat;
}

#toc {
	background: transparent;
}
#toc .toctogglelabel {
	color: #ffed2e;
}
#toc .tocnumber, #toc #mw-toc-heading {
	color: white;
}

h1, h2, h3, h4, h5, h6 {
	color: #fff;
}

.wikitable, .mw_metadata {
	background: #000d16;
	color: inherit;
	border: 1px solid #3a434a;
}
.wikitable > * > tr > td, .mw_metadata > * > tr > td {
	border-color: #3a434a;
}
.wikitable > * > tr > th, .mw_metadata > * > tr > th {
	background: #263139;
	border-color: #3a434a;
	padding-bottom: 9px;
	padding-top: 9px;
}

#mw-head .vector-menu-dropdown .vector-menu-heading {
	background: #044fae;
	border: 1px solid #044fae;
	border-radius: 4px;
	color: white;
	font-weight: bold;
	padding: 2px 10px;
	margin-top: 8px;
	height: 19px;
	text-align: center;
}

.vector-menu-dropdown .vector-menu-heading:after,
.wikiEditor-ui-toolbar .group .tool-select .label:after,
.mw-mmv-filepage-buttons .mw-mmv-view-expanded .mw-ui-icon:before,
.mw-mmv-filepage-buttons .mw-mmv-view-config .mw-ui-icon:before,
.oo-ui-iconElement-icon,
.oo-ui-indicator-down,
.mwe-math-fallback-image-inline,
.mw-mmv-image-links li.mw-mmv-filename-li:before,
.wikiEditor-ui-toolbar .tabs span.tab a:before {
	filter: invert(1);
}

ul {
	list-style-type: disc;
	list-style-image: unset;
}
ul li::marker {
	color: #fff;
}

.mw-ui-button.mw-ui-progressive:not(:disabled) {
	background-color: #044fae;
	border-color: #044fae;
}

.mw-body h1, .mw-body-content h1, .mw-body-content h2 {
	font-family: "BespokeSansVariable", "Lato", "Helvetica", sans-serif;
}

.vector-search-box form {
	margin: 0.25em 0 0 0;
}

.mw-footer {
	background: #000d16;
	background: rgba(0, 0, 0, 0.75);
	border: 1px solid #044fae;
	border-radius: 2px;
	color: #ffffff;
	margin-top: 1em;
}
.mw-footer li {
	color: white;
}
.mw-footer a, .mw-footer a:visited {
	color: #ffed2e;
}

.catlinks {
	border: 1px solid #4d545c;
}
.catlinks li {
	border-left: 1px solid #4d545c;
}

.editOptions {
	background-color: #353c4b;
	color: white;
	border: 1px solid #2e3338;
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
	color: #ff2525;
}

#pagehistory li.selected {
	background-color: rgba(20, 30, 255, 0.25);
	color: white;
}

.diff-addedline {
	border-color: #0c742f;
}
.diff-addedline .diffchange {
	background: #0c742f;
}

.diff-context {
	background: transparent;
	border-color: #3a434a;
	color: white;
}

.diff-deletedline {
	border-color: #c40017;
}
.diff-deletedline .diffchange {
	background: #c40017;
}

.diffchange {
	font-weight: bold;
	text-decoration: none;
}

a.mw-diff-movedpara-right, a.mw-diff-movedpara-left {
	color: transparent;
}
a.mw-diff-movedpara-right:after, .rtl a.mw-diff-movedpara-right:after, a.mw-diff-movedpara-left:after, .rtl a.mw-diff-movedpara-left:after {
	color: #fff;
}

code, pre,
.mw-editform #wpTextbox1 {
	background: black;
	color: white;
}

.mw-prefs-buttons {
	border: 1px solid #c8ccd1;
	padding: 1em;
}

div.thumbinner, .thumbimage {
	background: #263139;
	border-color: #3a434a;
}

li.gallerybox div.thumb {
	border: 1px solid #3a434a;
	background-color: #263139;
}

.oo-ui-image-invert.oo-ui-icon-stop, .mw-ui-icon-stop-invert:before {
	filter: unset;
}

.mw-ui-button:not(:disabled), .mw-ui-button:not(:disabled):visited {
	color: white;
	background: #044fae;
}
.mw-ui-button:not(:disabled):hover, .mw-ui-button:not(:disabled):visited:hover {
	color: white;
	background: #056cef;
}

.mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.mw-rcfilters-ui-filterMenuHeaderWidget-header,
.mw-rcfilters-ui-menuSelectWidget-footer,
.wikiEditor-ui-toolbar,
.mw-mmv-image-metadata {
	background-color: #070605;
}

.oo-ui-popupWidget-popup,
.oo-ui-textInputWidget .oo-ui-inputWidget-input,
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled,
.oo-ui-menuSelectWidget,
.mw-editform #wpTextbox1,
.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending),
.oo-ui-textInputWidget .oo-ui-inputWidget-input {
	background-color: #000;
}

.oo-ui-tagItemWidget.oo-ui-widget-enabled,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget,
.mw-rcfilters-ui-itemMenuOptionWidget-label-title,
#msupload-dropzone,
.wikiEditor-ui-toolbar .page-characters div span {
	color: #dfdedd;
}

.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title,
.mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title.oo-ui-labelElement-label,
.mw-rcfilters-ui-itemMenuOptionWidget-label-desc,
.mw-rcfilters-ui-viewSwitchWidget label.oo-ui-labelWidget,
.mw-rcfilters-ui-tagItemWidget-popup-content,
.wikiEditor-ui-toolbar .page-table th,
.wikiEditor-ui-toolbar .group .label {
	color: #ABA6A2;
}

.oo-ui-clippableElement-clippable.oo-ui-popupWidget-body,
.oo-ui-tagItemWidget.oo-ui-widget-enabled:hover,
.oo-ui-textInputWidget .oo-ui-inputWidget-input,
.wikiEditor-ui-toolbar .page-table td,
.mw-selflink.selflink {
	color: #fff;
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:visited {
	color: #ffed2e;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:visited:hover {
	color: #fff694;
}

.mw-rcfilters-ui-filterMenuSectionOptionWidget {
	background-color: #15130F;
}

.oo-ui-iconElement-icon.oo-ui-checkboxInputWidget-checkIcon,
.oo-ui-image-progressive.oo-ui-icon-markup, .mw-ui-icon-markup-progressive:before,
.oo-ui-image-progressive.oo-ui-icon-highlight, .mw-ui-icon-highlight-progressive:before,
.oo-ui-buttonElement-pressed .oo-ui-iconElement-icon,
#mw-input-wplanguage .oo-ui-indicator-down {
	filter: unset;
}

.mw-rcfilters-ui-itemMenuOptionWidget:hover,
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
.oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
	background-color: #022857;
	color: #fff;
}

.mw-rcfilters-ui-datePopupWidget .mw-rcfilters-ui-valuePickerWidget-title,
.mw-rcfilters-ui-savedLinksListWidget-placeholder.oo-ui-optionWidget .oo-ui-labelElement-label {
	color: #8D8882;
}

.wikiEditor-ui-toolbar .tabs span.tab a,
#msupload-div a {
	color: #0963f6;
}

.wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited,
.wikiEditor-ui-toolbar .group .tool-select .label,
.wikiEditor-ui-toolbar .group .tool-select .label:visited {
	color: #ddd;
}

#msupload-div {
	background: #1c1c1c;
}

.wikiEditor-ui-toolbar .booklet > .index > :hover {
	color: #000;
}

#msupload-dropzone.drop-over {
	background-color: #fcfdd5;
	color: #202122;
}

#msupload-list .file {
	background: #15130f;
}
#msupload-list .file .file-warning {
	color: #aeb8de;
}

#msupload-bottom #msupload-files {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAQAAAAngNWGAAABcklEQVQoz43SS0vUcRTG8cfbTL2JQCJaRBdqUdkiIrBV0KZ6AxURSdCNqEAQIugFhFAkRYSLCETQdJNQiERJLoQ2gpSmmE7TNoJPi/k3jkrkc3a/35dzec5J6tLkqCv6TJry1FXHNGejtBtSNWtAj26vzKgasWMt1OSiBR8cThLb7EoS+41b1KVlFbyg4p4tiRaPzFvSr5wouWvFjb/YdgvuJIkWL/1W05BSkrjpu91JNBvxVluS6K1j8CJJtHpjXClOqBY9nbSiUT+dTRI7VZyJW6aLFvrM+qJaxFezeoufCfej3/OG+ff5VeTrbHh96HV8du2/4DnzmwXn6qXtVV4PanOkKD1cH8agg4l2owYNGrUnccr71WE6a/YYM+14zc/Cv04zpgp7TkezYe+UPFOxbK4hllUMaDVWLES7b7rzD7ltqbaQJM774YGtG6CyHhXX15/ZpI412AETFnWtO99NHW497yGXPPbRJ09c1tGY6w9PW4W9Kyhd5wAAAABJRU5ErkJggg==);
}

.mw-message-box-warning {
	background-color: #e7f1fe;
	border-color: #338dff;
}
.mw-message-box-warning a {
	color: #0645ad;
}
.mw-message-box-warning a:visited {
	color: #0b0080;
}
.mw-message-box-warning a:hover {
	color: #2272f7;
}
.mw-message-box-warning a:hover:visited {
	color: #1400e6;
}

.mw-mmv-post-image {
	background-color: #000;
	border-top: 1px solid #c8ccd1;
	color: #dfdedd;
}
.mw-mmv-post-image a {
	color: #0963f6;
}

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

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

.search-types .current a {
	color: white !important;
}

#mw-searchoptions {
	background-color: transparent;
}

.oo-ui-labelWidget.oo-ui-inline-help {
	color: #6c7378;
}

.oo-ui-optionWidget.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-highlighted {
	color: #202122;
}
.oo-ui-optionWidget.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
	background-color: rgba(119, 157, 228, 0.2);
}
.oo-ui-optionWidget.oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-optionWidget-highlighted {
	background-color: #8080ff;
}

.oo-ui-tabSelectWidget-framed {
	background-color: #15130f;
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
	background-color: #000;
	color: #fff;
}
.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
	background-color: rgba(255, 255, 255, 0.4);
	color: #000;
}

.oo-ui-tabOptionWidget {
	color: #bfbdbb;
}

.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:hover td {
	background-color: #332e24;
}
.mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td {
	background-color: rgba(248, 249, 250, 0.25);
}

.filehistory a img, #file img:hover {
	background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbC1vcGFjaXR5PSIuMjUiPjxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik0wIDBoMTZ2MTZIMHoiLz48cGF0aCBmaWxsPSIjYzhjOGM4IiBkPSJNMCAwaDh2OEgwem04IDhoOHY4SDh6Ii8+PC9nPjwvc3ZnPg==) repeat;
}