Jump to content

MediaWiki:Common.css: Difference between revisions

← Older edit
No edit summary
Tag: Reverted
No edit summary
Tags: Manual revert Mobile edit Mobile web edit
 
(112 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* 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 ---
--- Infoboxes ---
Line 4: Line 259:


.infobox {
.infobox {
   background-color: #f8f9fa;
   background-color: #102020;
   border: 1px solid #a2a9b1;
   border: 1px solid #425f5f;
   color: black;
   color: #c4d3d3;
   padding: .2em;
   padding: .2em;
   font-size: .9em;
   font-size: .9em;
Line 22: Line 277:
.infobox .infobox-above,
.infobox .infobox-above,
.infobox .infobox-title {
.infobox .infobox-title {
  background-color: #425f5f !important;
  color: #fff !important;
   font-size: 1.25em;
   font-size: 1.25em;
   font-weight: bold;
   font-weight: bold;
Line 28: Line 285:


.infobox .infobox-caption {
.infobox .infobox-caption {
  font-size: .9em;
   font-weight: normal !important;
   font-weight: normal !important;
   text-align: center !important;
   text-align: center !important;
Line 34: Line 290:


.infobox .infobox-header {
.infobox .infobox-header {
  background-color: #3a5353 !important;
  color: #fff !important;
   font-size: 1.1em;
   font-size: 1.1em;
   font-weight: bold;
   font-weight: bold;
Line 53: Line 311:
@media (max-width: 640px) {
@media (max-width: 640px) {
   .infobox {
   .infobox {
    width: 100%;
     float: none;
     float: none;
     clear: both;
     clear: both;
    width: 100% !important;
     margin: 0 0 1em 0;
     margin: 0 0 1em 10em;
     table-layout: fixed;
     table-layout: fixed;
   }
   }
 
    
   .infobox th,
  .infobox td {
    width: 100% !important;
  }
   
   .infobox .nowrap {
   .infobox .nowrap {
     white-space: normal;
     white-space: normal;
Retrieved from "https://wiki.dreamonstudios.com/w/MediaWiki:Common.css"