MediaWiki:Vector.css
Note: After saving, you have to bypass your browser's cache to see the changes. The simplest method that will work for most users is to hold down the ⇧ Shift key and click the Reload toolbar button. For details and other methods, see Help:Clear your browser cache.
/*
* This stylesheet modifies the Vector theme.
*
* Common styles should go in [[MediaWiki:Common.css]].
*/
/* ===== Fonts ===== */
@font-face {
font-family: 'Fontin';
src: local('Fontin Regular'), url(/w/media/Fontin-Regular.ttf) format('truetype');
}
@font-face {
font-family: 'Fontin';
src: local('Fontin Bold'), url(/w/media/Fontin-Bold.ttf) format('truetype');
font-weight: bold;
}
@font-face {
font-family: 'Fontin';
src: local('Fontin Italic'), url(/w/media/Fontin-Italic.ttf) format('truetype');
font-style: italic;
}
@font-face {
font-family: 'FontinSmallCaps';
src: local('Fontin SmallCaps'), url(/w/media/Fontin-SmallCaps.ttf) format('truetype');
}
/* ===== Variables ===== */
:root {
color-scheme: dark;
--default-font: Verdana, Arial, Helvetica, sans-serif;
--stylized-font: Fontin, Verdana, Arial, Helvetica, sans-serif;
--stylized-smallcaps-font: FontinSmallCaps, Verdana, Arial, Helvetica, sans-serif;
--monospace-font: "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", "Liberation Mono", monospace;
--text-color: #a38d6d;
--link-color: #e4dc75;
--link-active-color: #f2dcae;
--red-link-color: #f25749;
--red-link-active-color: #f2b4ae;
--outer-text-color: rgb(198, 187, 179);
--outer-link-color: rgb(232 230 227);
--outer-link-text-shadow: 0 0 0.5rem rgba(0, 0, 0, 1), -1px -1px 0 rgba(0, 0, 0, 0.25), 1px -1px 0 rgba(0, 0, 0, 0.25), -1px 1px 0 rgba(0, 0, 0, 0.25), 1px 1px 0 rgba(0, 0, 0, 0.25);
}
/* ===== Body ===== */
@media screen {
body {
font-family: var(--default-font);
background: #000 url(https://pw-test2.grindinggear.com/images/9/98/Bg.jpg) no-repeat fixed left top;
background-size: contain;
}
}
/* ===== Links ===== */
@media screen {
a,
a:visited,
.mw-parser-output a.extiw,
.mw-parser-output a.extiw:visited,
.mw-parser-output a.external,
.mw-parser-output a.external:visited {
color: var(--link-color);
}
a:active,
.mw-parser-output a.extiw:active,
.mw-parser-output a.external:active {
color: var(--link-active-color);
}
a.new,
a.new:visited {
color: var(--red-link-color);
}
a.new:active {
color: var(--red-link-active-color);
}
}
/* ===== Headings ===== */
.page-header__title,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
color: #dfcf99;
border-bottom-color: #5e4f45;
}
@media screen {
pre,
code,
tt,
kbd,
samp,
.mw-code,
.mw-editfont-monospace,
.wikiEditor-ui .ace_editor {
font-family: var(--monospace-font);
}
}
/* ===== Header ===== */
#mw-page-base {
background: transparent;
}
/* ===== User menu ===== */
@media screen {
.vector-user-menu-legacy a,
.vector-user-menu-legacy a:visited{
color: var(--outer-link-color);
text-shadow: var(--outer-link-text-shadow);
}
.vector-user-menu-legacy #pt-anonuserpage,
.vector-user-menu-legacy #pt-userpage a {
background-position: left bottom;
}
}
/* ===== Sidebar menu ===== */
@media screen {
.vector-legacy-sidebar .vector-menu-portal {
background-color: rgba(0,0,0,0.3);
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-heading {
color: var(--outer-text-color);
}
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a,
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
color: var(--outer-link-color);
text-shadow: var(--outer-link-text-shadow);
}
}
/* ===== Footer ===== */
@media screen {
.mw-footer li {
color: var(--outer-text-color);
}
.mw-footer a {
color: var(--outer-link-color);
text-shadow: var(--outer-link-text-shadow);
}
}
/* ===== Page content ===== */
@media screen {
.mw-body {
border: 2px solid #4c3c2c;
border-image-source: radial-gradient(at top center, #736445, #3d3326, #402f27, #3f372a, #0c0b09);
border-image-slice: 1;
color: var(--text-color);
background-color: #0f0f0f;
box-shadow: 0 1.5rem 3rem rgba(0,0,0,0.5);
}
}
/* ===== Revision history ===== */
#pagehistory li {
border: 1px solid transparent;
padding: 0;
}
#pagehistory li.selected {
outline: none;
border: 1px dashed #16678a;
color: inherit;
background-color: #191b1c;
}
/* ===== Table of contents ===== */
@media screen {
.toc,
.toccolours {
background: #141414;
border-color: #a38d6d;
}
.toctogglelabel {
color: var(--link-color);
}
.tocnumber {
color: #72777d;
}
}
/* ===== Revision comparison ===== */
.diff-lineno,
.diff td.diff-marker {
color: #dfcf99;
}
.mw-diff-movedpara-left:after,
.mw-diff-movedpara-right:after {
color: #dfcf99;
}
.diff td {
padding: 0.15em 0.3em;
}
.diff-addedline,
.diff-deletedline,
.diff-context {
border-radius: 0.3em;
font-family: var(--monospace-font);
}
.diff-context {
border-color: #2c2b2b;
color: #5e4f45;
background: #141414;
}
.diff-deletedline {
border-color: #894a17;
background: #191b1c;
}
.diff-deletedline .diffchange {
color: #dfcf99;
background: #4d3420;
}
.diff-addedline {
border-color: #16678a;
background: #191b1c;
}
.diff-addedline .diffchange {
color: #dfcf99;
background: #203f4c;
}
/* ===== Dark theme syntax highlighting ===== */
@media screen and (prefers-color-scheme: dark) {
.ace-tm,
.mw-highlight pre {
color: #F8F8F2;
background-color: #272822;
}
.ace-tm .ace_gutter {
color: #8F908A;
background: #2F3129;
}
.mw-content-ltr.mw-highlight-lines pre,
.mw-content-ltr.content .mw-highlight-lines pre {
box-shadow: inset 2.75em 0 0 #2F3129;
}
.ace-tm .ace_print-margin {
width: 1px;
background: #555651;
}
.ace-tm .ace_cursor {
color: #F8F8F0
}
.ace-tm .ace_marker-layer .ace_selection {
background: #49483E
}
.ace-tm.ace_multiselect .ace_selection.ace_start {
box-shadow: 0 0 3px 0px #272822;
}
.ace-tm .ace_marker-layer .ace_step {
background: rgb(102, 82, 0);
}
.ace-tm .ace_marker-layer .ace_bracket {
border: 1px solid #49483E;
margin: -1px 0 0 -1px;
}
.ace-tm .ace_marker-layer .ace_active-line {
background: #202020;
}
.ace-tm .ace_gutter-active-line {
background-color: #272727;
}
.ace-tm .ace_marker-layer .ace_selected-word {
border: 1px solid #49483E;
}
.ace-tm .ace_invisible {
color: #52524d;
}
.ace-tm .ace_constant,
.ace-tm .ace_entity.ace_name.ace_tag,
.ace-tm .ace_keyword,
.ace-tm .ace_meta.ace_tag,
.ace-tm .ace_storage,
.mw-highlight .k,
.mw-highlight .kr,
.mw-highlight .ow,
.mw-highlight .nt {
color: #F92672;
}
.ace-tm .ace_keyword.ace_operator,
.mw-highlight .o {
color: #828282;
}
.ace-tm .ace_punctuation,
.ace-tm .ace_punctuation.ace_tag,
.mw-highlight .nc,
.mw-highlight .nf,
.mw-highlight .nv,
.mw-highlight .nd {
color: inherit;
}
.ace-tm .ace_constant.ace_character,
.ace-tm .ace_constant.ace_language,
.ace-tm .ace_constant.ace_numeric,
.ace-tm .ace_constant.ace_other,
.mw-highlight .mi,
.mw-highlight .mf,
.mw-highlight .mh,
.mw-highlight .kc {
color: #AE81FF;
}
.ace-tm .ace_invalid {
color: #F8F8F0;
background-color: #F92672;
}
.ace-tm .ace_invalid.ace_deprecated {
color: #F8F8F0;
background-color: #AE81FF;
}
.ace-tm .ace_support.ace_constant,
.ace-tm .ace_support.ace_function,
.mw-highlight .bp {
color: #66D9EF;
}
.ace-tm .ace_fold {
border-color: #F8F8F2;
background-color: #A6E22E;
}
.ace-tm .ace_storage.ace_type,
.ace-tm .ace_support.ace_class,
.ace-tm .ace_support.ace_type,
.mw-highlight .kd,
.mw-highlight .kp,
.mw-highlight .kt {
font-style: italic;
color: #66D9EF;
}
.ace-tm .ace_entity.ace_name.ace_function,
.ace-tm .ace_entity.ace_other,
.ace-tm .ace_entity.ace_other.ace_attribute-name,
.ace-tm .ace_variable,
.ace-tm .ace_comment.ace_doc.ace_tag,
.ace-tm .ace_constant.ace_library,
.mw-highlight .nb,
.mw-highlight .nn {
color: #A6E22E;
}
.ace-tm .ace_variable.ace_parameter,
.mw-highlight .cp {
font-style: italic;
color: #FD971F;
}
.ace-tm .ace_string,
.mw-highlight .s,
.mw-highlight .s1,
.mw-highlight .s2,
.mw-highlight .se,
.mw-highlight .sx {
color: #E6DB74;
}
.ace-tm .ace_comment,
.ace-tm .ace_comment.ace_doc,
.mw-highlight .c,
.mw-highlight .c1,
.mw-highlight .cm {
color: #75715E;
}
.ace-tm .ace_indent-guide {
filter: brightness(0.5);
}
}