Jump to content

MediaWiki:Common.css: Difference between revisions

From Dreamon Studios Wiki
Created page with "→CSS placed here will be applied to all skins: →General: .mw-code, code, textarea, input, select, .mw-widget-dateInputWidget-handle, .oo-ui-popupWidget-popup, .mw-mmv-image-metadata { background-color: #191E28; color: #99a2b1; } .custom-section { background: #101319; border: solid #eaecf0; border-top-width: medium; border-top-style: solid; border-right-width: medium; border-right-style: solid; border-bottom-width: medium;..."
 
No edit summary
Tags: Manual revert Mobile edit Mobile web edit
 
(136 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* Imports */
@import url('https://fonts.googleapis.com/css2?family=Underdog:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap');


/* General */
/* ------------------
.mw-code, code, textarea, input, select, .mw-widget-dateInputWidget-handle, .oo-ui-popupWidget-popup, .mw-mmv-image-metadata {
-- Deceron Classes --
    background-color: #191E28;
------------------ */
    color: #99a2b1;
 
.deceron-mp-table {
  background: var(--background-color-neutral);
  text-align: center;
  border-spacing: 10px;
}
 
.deceron-mp-table td {
  background: var(--background-color-neutral-subtle);
  vertical-align: top;
  padding: 5px;
}
}


.custom-section {
/* ------------------
    background: #101319;
--- General Style ---
    border: solid #eaecf0;
------------------ */
    border-top-width: medium;
    border-top-style: solid;
    border-right-width: medium;
    border-right-style: solid;
    border-bottom-width: medium;
    border-bottom-style: solid;
    border-left-width: medium;
    border-left-style: solid;
    border-image-repeat: stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    border-width: 1px 1px 0.2em;
    padding: 1em;
    box-shadow: 0 1px 2px 1px rgba(0,0,0,0.02);
    border-image-source: url(/images/general/borders.png);
    border-image-width: 3px;
    border-image-slice: 5;
    border-image-repeat: repeat;
    border-style: solid;
    padding: 1em;
    word-wrap: break-word;
    font-size: 0.95em;
    margin-bottom:1em;
  }


.mw-mmv-image-metadata {
html, body {
    border: 1px solid white;
  font-family: "PT Sans", sans-serif;
    border-image-source: url(/images/general/borders.png);
    border-image-width: 1px 0 0 0;
    border-image-slice: 5;
    border-image-repeat: repeat;
}
}


.mw-mmv-post-image {
.mw-body h1,.mw-body .mw-heading1,.mw-body-content h1,.mw-body-content .mw-heading1,.mw-body-content h2,.mw-body-content .mw-heading2 {
    background-color: #101319;
  font-family: "Underdog", serif;
    color: #99a2b1;
  line-height: 1.375
}
}


.mw-message-box-error {
:root {
    background: #d30404;
  color-scheme: dark !important;
    color: white;
 
    border-color: #d30404;
  /* Text */
}
  --color-base: #c4d3d3;
  --color-base-fixed: #c4d3d3;
  --color-base--hover: #ffffff;
  --color-emphasized: #ffffff;
  --color-subtle: #6d9b9b;
  --color-placeholder: #8c949e;
  --color-disabled: #69717c;
  --color-disabled-emphasized: #69717c;
 
  /* Inverted text */
  --color-inverted: #102020;
  --color-inverted-fixed: #102020;
 
  /* Links */
  --color-progressive: #ffaa50;
  --color-progressive--hover: #ffd6ab;
  --color-progressive--active: #ffd6ab;
  --color-progressive--focus: #ffd6ab;
 
  /* Visited links */
  --color-visited: #ff8c1c;
  --color-visited--hover: #da7b1e;
  --color-visited--active: #da7b1e;
 
  /* Backgrounds */
  --background-color-base: #203030;
  --background-color-base-fixed: #203030;
 
  --background-color-neutral: #102020;
  --background-color-neutral-subtle: #152525;


#profile-toggle-button, .mw-mmv-stripe-button, .mw-mmv-options-button {
  --background-color-interactive: #425f5f;
    display: none
  --background-color-interactive--hover: #454b55;
}
  --background-color-interactive--active: #505762;


#categories{
  --background-color-interactive-subtle: #152525;
    display: grid;
  --background-color-interactive-subtle--hover: #102020;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  --background-color-interactive-subtle--active: #102020;
    gap: 10px;
    width: 100%;
    margin: auto;
}


.categories-el{
  --background-color-disabled: #454b55;
    border: solid #eaecf0;
  --background-color-disabled-subtle: #102020;
    border-width: 2px 2px 0.2em;
    border-image-source: url(/images/general/borders.png);
    border-image-width: 3px;
    border-image-slice: 5;
    border-image-repeat: repeat;
    border-style: solid;
    text-align: left;
    padding-left:15px;
    white-space: nowrap;
    background-color:#191E28;
}


.categories-el pre{
  --background-color-inverted: #eeeeee;
    padding:0px;
}


.categories-subel{
  /* Progressive UI */
    display: inline-block;
  --background-color-progressive: #ffaa50;
    vertical-align: middle;
  --background-color-progressive--hover: #ffd6ab;
}
  --background-color-progressive--active: #ffd6ab;
  --background-color-progressive--focus: #ffd6ab;


.diff-context {
  /* Progressive subtle backgrounds */
    background: #202122 !important;
  --background-color-progressive-subtle: #293653;
    border-color: #b1ad99 !important;
  --background-color-progressive-subtle--hover: #334467;
    color: #f8f9fa !important;
  --background-color-progressive-subtle--active: #3b5078;
}


.diff-addedline .diffchange {
  /* Borders */
    background: #202122 !important;
  --border-color-base: #425f5f;
}
  --border-color-subtle: #3a5353;
  --border-color-muted: #253636;


#pagehistory li.selected {
  --border-color-interactive: #8c949e;
    background-color: #202122 !important;
  --border-color-interactive--hover: #b8bec7;
    color: #f8f9fa !important;
  --border-color-interactive--active: #eeeeee;
}


.mw-body h2, .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6 {
  --border-color-disabled: #454b55;
    border-image-source: url(/images/general/borders.png);
    border-image-width: 0 0 1px 0;
    border-image-slice: 5;
    border-image-repeat: repeat;
}


.client-js .sortable:not(.jquery-tablesorter)>*>tr:first-child>th:not(.unsortable), .jquery-tablesorter th.headerSort {
  --border-color-inverted: #20252b;
    background-size: 30px !important;
  --border-color-inverted-fixed: #20252b;
}


figure[typeof~='mw:File/Thumb'], figure[typeof~='mw:File/Frame'] {
  /* Progressive borders */
    background-color: transparent !important;
  --border-color-progressive: #da7b1e;
    border-width:0px !important;
  --border-color-progressive--hover: #ff8c1c;
}
  --border-color-progressive--active: #ff8c1c;
  --border-color-progressive--focus: #ff8c1c;


figure[typeof~="mw:File/Thumb"] > :not(figcaption) .mw-file-element, figure[typeof~="mw:File/Frame"] > :not(figcaption) .mw-file-element{
  /* Dividers */
    /* border-width:0px; */
  --border-color-divider: #59616d;


    border: solid #eaecf0;
  /* Shadows */
    border-width: 2px 2px 0.2em;
  --box-shadow-color-base: #11151a;
    border-image-source: url(/images/general/borders.png);
  --box-shadow-color-alpha-base: rgba(0, 0, 0, 0.35);
    border-image-width: 3px;
    border-image-slice: 5;
    border-image-repeat: repeat;
    border-style: solid;
}


figure[typeof~='mw:File/Thumb']>figcaption, figure[typeof~='mw:File/Frame']>figcaption {
  /* Backdrops */
    background-color: transparent !important;
  --background-color-backdrop-light: rgba(34, 40, 49, 0.65);
    border-width:0px !important;
  --background-color-backdrop-dark: rgba(0, 0, 0, 0.65);
    text-align:center !important;
}


#pagehistory li.selected {
  /* EVERYTHING ABOVE HAS BEEN EDITED (I THINK) */
    background-color: #202122 !important;
    color: #f8f9fa !important;
}


.diff-context {
  /* Destructive / semantic colors */
    background: #202122 !important;
  --color-destructive: #ff5454;
    border-color: #b1ad99 !important;
  --color-destructive--hover: #ff7878;
    color: #f8f9fa !important;
  --color-destructive--active: #ff7878;
}
  --color-destructive--focus: #ff7878;


.diff-addedline .diffchange {
  --color-destructive--visited: #9f5555;
    background: #202122 !important;
  --color-destructive--visited--hover: #854848;
}
  --color-destructive--visited--active: #512e2e;


.CodeMirror-code {
  --color-error: #bf3c2c;
    background-color: #0a0f14 !important;
  --color-error--hover: #9f3526;
}
  --color-error--active: #612419;


.cm-mw-template, .cm-mw-template-name, .cm-mw-template-name-mnemonic, .cm-mw-template-argument-name, .cm-mw-template-delimiter, .cm-mw-template-bracket {
  --color-warning: #886425;
    color: #7f3cc5 !important;
  --color-success: #177860;
}
  --color-notice: #404244;


.CodeMirror-line::selection, .CodeMirror-line>span::selection, .CodeMirror-line>span>span::selection {
  --color-icon-error: #f54739;
    background: #2e2e2eff !important;
  --color-icon-warning: #ab7f2a;
}
  --color-icon-success: #099979;
  --color-icon-notice: #72777d;


.cm-mw-matchingbracket {
  --color-content-added: #006400;
    background-color: transparent !important;
  --color-content-removed: #8b0000;
    color: #e7c009 !important;
    box-shadow: none !important;
}


.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined, .oo-ui-tagItemWidget.oo-ui-widget-enabled, .oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed), .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled, .oo-ui-tagMultiselectWidget-handle {
  /* Icon filters */
    background-color: transparent !important;
  --filter-invert-icon: 0;
    color: #66665c !important;
  --filter-invert-primary-button-icon: 1;
}


.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
  /* Additional shadows */
    color: #666666 !important;
  --box-shadow-color-progressive--active: #233566;
}
  --box-shadow-color-progressive--focus: #36c;
  --box-shadow-color-progressive-selected: #36c;
  --box-shadow-color-progressive-selected--hover: #3056a9;
  --box-shadow-color-progressive-selected--active: #233566;
  --box-shadow-color-destructive--focus: #36c;
  --box-shadow-color-inverted: #fff;
  --box-shadow-color-transparent: transparent;


.mw-rcfilters-ui-filterMenuHeaderWidget-header {
  /* Blending */
    background-color: #191e28 !important;
  --mix-blend-mode-base: normal;
}
  --mix-blend-mode-blend: multiply;


.mw-rcfilters-ui-filterMenuSectionOptionWidget {
  /* Destructive backgrounds */
    background-color: #191e28 !important;
  --background-color-destructive: #bf3c2c;
}
  --background-color-destructive--hover: #9f3526;
  --background-color-destructive--active: #612419;
  --background-color-destructive--focus: #36c;


.mw-rcfilters-ui-itemMenuOptionWidget.oo-ui-optionWidget-selected {
  --background-color-destructive-subtle: #ffe9e5;
    background-color: #000000 !important;
  --background-color-destructive-subtle--hover: #ffdad3;
}
  --background-color-destructive-subtle--active: #ffc8bd;


.mw-rcfilters-ui-filterMenuOptionWidget.oo-ui-flaggedElement-muted:not(.oo-ui-optionWidget-selected) {
  /* Error backgrounds */
    background-color: #000000 !important;
  --background-color-error: #ff5454;
}
  --background-color-error--hover: #ff7878;
  --background-color-error--active: #ff7878;


.mw-rcfilters-ui-menuSelectWidget-footer {
  --background-color-error-subtle: #c22a2a;
    background-color: transparent !important;
  --background-color-error-subtle--hover: #e34e4e;
}
  --background-color-error-subtle--active: #e34e4e;


.mw-rcfilters-ui-itemMenuOptionWidget:hover {
  /* Semantic backgrounds */
    background-color: #071023 !important;
  --background-color-warning-subtle: #fdf2d5;
}
  --background-color-success-subtle: #dff2eb;
  --background-color-notice-subtle: #eaecf0;


.mw-rcfilters-ui-itemMenuOptionWidget-label-title {
  /* Content change backgrounds */
    color: #6b6b6b !important;
  --background-color-content-added: #a3d3ff;
}
  --background-color-content-removed: #ffe49c;


ol.references li:target, sup.reference:target {
  /* Other backgrounds */
    background-image: linear-gradient(to right, #250b0b, #101319) !important;
  --background-color-transparent: transparent;
    -webkit-text-stroke-width: medium !important;
  --background-color-button-quiet--hover: rgba(0, 24, 73, 0.027);
}
  --background-color-button-quiet--active: rgba(0, 24, 73, 0.082);
  --background-color-input-binary--checked: #36c;
  --background-color-tab-list-item-framed--hover: rgba(255, 255, 255, 0.3);
  --background-color-tab-list-item-framed--active: rgba(255, 255, 255, 0.65);


ul.gallery.gallery.gallery {
  /* Icon opacity */
    text-align: center;
  --opacity-icon-base: 0.87;
}
  --opacity-icon-base--hover: 0.74;
  --opacity-icon-base--selected: 1;
  --opacity-icon-base--disabled: 0.51;
  --opacity-icon-placeholder: 0.51;
  --opacity-icon-subtle: 0.67;


ul.mw-gallery-packed li.gallerybox div.thumb {
  /* Additional borders */
    box-shadow: 0 2px 8px 0px rgba(0, 0, 0, 0.5) !important;
  --border-color-error: #f54739;
}
  --border-color-error--hover: #9f3526;
  --border-color-error--active: #612419;


/**** Homepage ****/
  --border-color-warning: #ab7f2a;
  --border-color-success: #099979;
  --border-color-notice: #72777d;


#intro {
  --border-color-content-added: #a3d3ff;
    width: 100%;
  --border-color-content-removed: #ffe49c;
    height: 250px;
  --border-color-transparent: transparent;
    background: #191E28;
    background-image: url(/images/intro.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-image-source: url(/images/general/borders.png);
    border-image-width: 3px;
    border-image-slice: 5;
    border-image-repeat: repeat;
    border-style: solid;
}


#intro b {
  /* Focus / accent */
    font-size: 20px;
  --outline-color-progressive--focus: #ffd6ab;
}
  --accent-color-base: #ffd6ab;


/**** Table Dark CSS ****/
  /* Subtle text */
.wikitable, .mw-datatable {
  --color-base--subtle: #54595d;
    border-width: 0px;
    width: 100%;
}
}


.wikitable tr th, .mw-datatable tr th {
/* -----------------
    background-color: #101319;
--- Logo fix ---
    border: 1px solid #99a2b1;
----------------- */
}


.wikitable tr td, .mw-datatable tr td {
.mw-logo-wordmark {
     background-color: #191E28;
     display: none;
    border: 1px solid #99a2b1;
}
}


.wikitable>tr>th, .wikitable>*>tr>th {
/* Force the Vector 2022 logo/icon to stay visible on mobile views */
     background-color: #191e28 !important;
@media (max-width: 719px) {
     text-align: center;
  .mw-header .mw-logo {
     display: inline-flex !important;
     margin-right: 0.5em;
  }
   
  /* Ensure the icon image inside the logo link is visible */
  .mw-header .mw-logo-icon {
    display: inline-block !important;
  }
}
}


.wikitable>*>tr>th {
/* -----------------
    border: 1px solid #b1ad99 !important;
--- Infoboxes ---
}
----------------- */


.wikitable {
.infobox {
    padding: inherit !important;
  background-color: #102020;
    border-collapse: inherit !important;
  border: 1px solid #425f5f;
  color: #c4d3d3;
  padding: .2em;
  font-size: .9em;
  line-height: 1.5em;
  border-spacing: 3px;
}
}


/**** Tabs Dark CSS ****/
.infobox th,
.tabs-label {
.infobox td {
    background-image: url(/images/general/background-button.png);
  padding: .2em .5em;
    padding: 5px;
  text-align: left;
    border-image-source: url(/images/general/borders.png);
  vertical-align: top;
    border-image-width: 3px;
    border-image-slice: 5;
    border-image-repeat: repeat;
    border-style: solid;
    border-width: 0.2em;
}
}


.tabs-tabbox>.tabs-label {
.infobox .infobox-above,
    margin-right: 5px;
.infobox .infobox-title {
  background-color: #425f5f !important;
  color: #fff !important;
  font-size: 1.25em;
  font-weight: bold;
  text-align: center !important;
}
}


.tabs-tabbox>.tabs-input+.tabs-input+.tabs-label {
.infobox .infobox-caption {
    margin-left: 0px;
  font-weight: normal !important;
  text-align: center !important;
}
}


.tabs-tabbox>.tabs-container {
.infobox .infobox-header {
    border-image-source: url(/images/general/borders.png);
  background-color: #3a5353 !important;
    border-image-width: 3px;
  color: #fff !important;
    border-image-slice: 5;
  font-size: 1.1em;
    border-image-repeat: repeat;
  font-weight: bold;
    border-style: solid;
  text-align: center !important;
    border-width: 0.2em;
    background-color: #191E28;
}
}


.tabs-tabbox>.tabs-input:checked+.tabs-label {
.infobox .infobox-label {
    color: white;
  font-weight: bold;
}
}


 
/* Fixes weird stretching bug with the Vector skin */
/**** Headers ****/
.infobox img {
.mw-body h3, .mw-body .toctitle h2 {
  display: block;
    font-size: 1.5em;
  margin: 0 auto;
    border-image-source: none !important;
  max-width: 100%;
    color: #8d8b88;
  height: auto;
}
}


 
@media (max-width: 640px) {
 
  .infobox {
/**** User Colors ****/
    width: 100%;
a[href$="/w/User:Malid"], a[href$="/w/User:DamianQ"], a[href$="/w/User:Milten"], a[href$="/w/User:Profestus"], a[href$="/w/User:Pakshee"], a[href$="/w/User:Imbar"], a[href$="/w/User:JaroKrieg"], a[href$="/w/User:Asnen"], a[href$="/w/User:Flatczer"], a[href$="/w/User:Tentralus"] {
    float: none;
     color: #917453 !important;
    clear: both;
    margin: 0 0 1em 0;
    table-layout: fixed;
  }
 
  .infobox .nowrap {
     white-space: normal;
  }
}
}


a[href$="/w/User:Garok"], a[href$="/w/User:Dragos"], a[href$="/w/User:Saradoc"] {
@media (min-width: 640px) {
     color: #e7c009 !important;
  .infobox {
    /* @noflip */
    margin: 0.5em 0 0.5em 1em;
    /* @noflip */
    float: right;
    /* @noflip */
    clear: right;
     width: 22em;
  }
}
}

Latest revision as of 20:02, 14 September 2026

/* Imports */
@import url('https://fonts.googleapis.com/css2?family=Underdog:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap');

/* ------------------
-- Deceron Classes --
------------------ */

.deceron-mp-table {
  background: var(--background-color-neutral);
  text-align: center;
  border-spacing: 10px;
}

.deceron-mp-table td {
  background: var(--background-color-neutral-subtle);
  vertical-align: top;
  padding: 5px;
}

/* ------------------
--- General Style ---
------------------ */

html, body {
  font-family: "PT Sans", sans-serif;
}

.mw-body h1,.mw-body .mw-heading1,.mw-body-content h1,.mw-body-content .mw-heading1,.mw-body-content h2,.mw-body-content .mw-heading2 {
  font-family: "Underdog", serif;
  line-height: 1.375
}

:root {
  color-scheme: dark !important;

  /* Text */
  --color-base: #c4d3d3;
  --color-base-fixed: #c4d3d3;
  --color-base--hover: #ffffff;
  --color-emphasized: #ffffff;
  --color-subtle: #6d9b9b;
  --color-placeholder: #8c949e;
  --color-disabled: #69717c;
  --color-disabled-emphasized: #69717c;

  /* Inverted text */
  --color-inverted: #102020;
  --color-inverted-fixed: #102020;

  /* Links */
  --color-progressive: #ffaa50;
  --color-progressive--hover: #ffd6ab;
  --color-progressive--active: #ffd6ab;
  --color-progressive--focus: #ffd6ab;

  /* Visited links */
  --color-visited: #ff8c1c;
  --color-visited--hover: #da7b1e;
  --color-visited--active: #da7b1e;

  /* Backgrounds */
  --background-color-base: #203030;
  --background-color-base-fixed: #203030;

  --background-color-neutral: #102020;
  --background-color-neutral-subtle: #152525;

  --background-color-interactive: #425f5f;
  --background-color-interactive--hover: #454b55;
  --background-color-interactive--active: #505762;

  --background-color-interactive-subtle: #152525;
  --background-color-interactive-subtle--hover: #102020;
  --background-color-interactive-subtle--active: #102020;

  --background-color-disabled: #454b55;
  --background-color-disabled-subtle: #102020;

  --background-color-inverted: #eeeeee;

  /* Progressive UI */
  --background-color-progressive: #ffaa50;
  --background-color-progressive--hover: #ffd6ab;
  --background-color-progressive--active: #ffd6ab;
  --background-color-progressive--focus: #ffd6ab;

  /* Progressive subtle backgrounds */
  --background-color-progressive-subtle: #293653;
  --background-color-progressive-subtle--hover: #334467;
  --background-color-progressive-subtle--active: #3b5078;

  /* Borders */
  --border-color-base: #425f5f;
  --border-color-subtle: #3a5353;
  --border-color-muted: #253636;

  --border-color-interactive: #8c949e;
  --border-color-interactive--hover: #b8bec7;
  --border-color-interactive--active: #eeeeee;

  --border-color-disabled: #454b55;

  --border-color-inverted: #20252b;
  --border-color-inverted-fixed: #20252b;

  /* Progressive borders */
  --border-color-progressive: #da7b1e;
  --border-color-progressive--hover: #ff8c1c;
  --border-color-progressive--active: #ff8c1c;
  --border-color-progressive--focus: #ff8c1c;

  /* Dividers */
  --border-color-divider: #59616d;

  /* Shadows */
  --box-shadow-color-base: #11151a;
  --box-shadow-color-alpha-base: rgba(0, 0, 0, 0.35);

  /* Backdrops */
  --background-color-backdrop-light: rgba(34, 40, 49, 0.65);
  --background-color-backdrop-dark: rgba(0, 0, 0, 0.65);

  /* EVERYTHING ABOVE HAS BEEN EDITED (I THINK) */

  /* Destructive / semantic colors */
  --color-destructive: #ff5454;
  --color-destructive--hover: #ff7878;
  --color-destructive--active: #ff7878;
  --color-destructive--focus: #ff7878;

  --color-destructive--visited: #9f5555;
  --color-destructive--visited--hover: #854848;
  --color-destructive--visited--active: #512e2e;

  --color-error: #bf3c2c;
  --color-error--hover: #9f3526;
  --color-error--active: #612419;

  --color-warning: #886425;
  --color-success: #177860;
  --color-notice: #404244;

  --color-icon-error: #f54739;
  --color-icon-warning: #ab7f2a;
  --color-icon-success: #099979;
  --color-icon-notice: #72777d;

  --color-content-added: #006400;
  --color-content-removed: #8b0000;

  /* Icon filters */
  --filter-invert-icon: 0;
  --filter-invert-primary-button-icon: 1;

  /* Additional shadows */
  --box-shadow-color-progressive--active: #233566;
  --box-shadow-color-progressive--focus: #36c;
  --box-shadow-color-progressive-selected: #36c;
  --box-shadow-color-progressive-selected--hover: #3056a9;
  --box-shadow-color-progressive-selected--active: #233566;
  --box-shadow-color-destructive--focus: #36c;
  --box-shadow-color-inverted: #fff;
  --box-shadow-color-transparent: transparent;

  /* Blending */
  --mix-blend-mode-base: normal;
  --mix-blend-mode-blend: multiply;

  /* Destructive backgrounds */
  --background-color-destructive: #bf3c2c;
  --background-color-destructive--hover: #9f3526;
  --background-color-destructive--active: #612419;
  --background-color-destructive--focus: #36c;

  --background-color-destructive-subtle: #ffe9e5;
  --background-color-destructive-subtle--hover: #ffdad3;
  --background-color-destructive-subtle--active: #ffc8bd;

  /* Error backgrounds */
  --background-color-error: #ff5454;
  --background-color-error--hover: #ff7878;
  --background-color-error--active: #ff7878;

  --background-color-error-subtle: #c22a2a;
  --background-color-error-subtle--hover: #e34e4e;
  --background-color-error-subtle--active: #e34e4e;

  /* Semantic backgrounds */
  --background-color-warning-subtle: #fdf2d5;
  --background-color-success-subtle: #dff2eb;
  --background-color-notice-subtle: #eaecf0;

  /* Content change backgrounds */
  --background-color-content-added: #a3d3ff;
  --background-color-content-removed: #ffe49c;

  /* Other backgrounds */
  --background-color-transparent: transparent;
  --background-color-button-quiet--hover: rgba(0, 24, 73, 0.027);
  --background-color-button-quiet--active: rgba(0, 24, 73, 0.082);
  --background-color-input-binary--checked: #36c;
  --background-color-tab-list-item-framed--hover: rgba(255, 255, 255, 0.3);
  --background-color-tab-list-item-framed--active: rgba(255, 255, 255, 0.65);

  /* Icon opacity */
  --opacity-icon-base: 0.87;
  --opacity-icon-base--hover: 0.74;
  --opacity-icon-base--selected: 1;
  --opacity-icon-base--disabled: 0.51;
  --opacity-icon-placeholder: 0.51;
  --opacity-icon-subtle: 0.67;

  /* Additional borders */
  --border-color-error: #f54739;
  --border-color-error--hover: #9f3526;
  --border-color-error--active: #612419;

  --border-color-warning: #ab7f2a;
  --border-color-success: #099979;
  --border-color-notice: #72777d;

  --border-color-content-added: #a3d3ff;
  --border-color-content-removed: #ffe49c;
  --border-color-transparent: transparent;

  /* Focus / accent */
  --outline-color-progressive--focus: #ffd6ab;
  --accent-color-base: #ffd6ab;

  /* Subtle text */
  --color-base--subtle: #54595d;
}

/* -----------------
--- Logo fix ---
----------------- */

.mw-logo-wordmark {
    display: none;
}

/* Force the Vector 2022 logo/icon to stay visible on mobile views */
@media (max-width: 719px) {
  .mw-header .mw-logo {
    display: inline-flex !important;
    margin-right: 0.5em;
  }
    
  /* Ensure the icon image inside the logo link is visible */
  .mw-header .mw-logo-icon {
    display: inline-block !important;
  }
}

/* -----------------
--- Infoboxes ---
----------------- */

.infobox {
  background-color: #102020;
  border: 1px solid #425f5f;
  color: #c4d3d3;
  padding: .2em;
  font-size: .9em;
  line-height: 1.5em;
  border-spacing: 3px;
}

.infobox th,
.infobox td {
  padding: .2em .5em;
  text-align: left;
  vertical-align: top;
}

.infobox .infobox-above,
.infobox .infobox-title {
  background-color: #425f5f !important;
  color: #fff !important;
  font-size: 1.25em;
  font-weight: bold;
  text-align: center !important;
}

.infobox .infobox-caption {
  font-weight: normal !important;
  text-align: center !important;
}

.infobox .infobox-header {
  background-color: #3a5353 !important;
  color: #fff !important;
  font-size: 1.1em;
  font-weight: bold;
  text-align: center !important;
}

.infobox .infobox-label {
  font-weight: bold;
}

/* Fixes weird stretching bug with the Vector skin */
.infobox img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}

@media (max-width: 640px) {
  .infobox {
    width: 100%;
    float: none;
    clear: both;
    margin: 0 0 1em 0;
    table-layout: fixed;
  }
  
  .infobox .nowrap {
    white-space: normal;
  }
}

@media (min-width: 640px) {
  .infobox {
    /* @noflip */
    margin: 0.5em 0 0.5em 1em;
    /* @noflip */
    float: right;
    /* @noflip */
    clear: right;
    width: 22em;
  }
}
Retrieved from "https://wiki.dreamonstudios.com/w/index.php?title=MediaWiki:Common.css&oldid=349"