MediaWiki:Common.css

From Pico 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.
/***********************************************************************************************************
 * import loadout
 ***********************************************************************************************************/
@import url(https://commons.wiki.gg/wiki/MediaWiki:wdl.css?action=raw&ctype=text/css);
/***********************************************************************************************************
 * local theme setting
 ***********************************************************************************************************/
:root {
  --wiki-logo-width--px: 500;
  --wiki-logo-height--px: 153;
  --wiki-logo-image: url(https://pico.wiki.gg/images/e/e6/Site-logo.png);
  --wiki-logo-filter: drop-shadow(0px 0px 5px rgba(0,0,0, 0.5));
  --wiki-body-background-color: #191d20;
  --wiki-body-background-image: linear-gradient(to bottom, #3b3217, #191d20 25%);
  --wiki-body-background-repeat: no-repeat;
  --wiki-body-background-attachment: fixed;
  --wiki-box-border-radius: 5px;
  --wiki-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);
  --wiki-box-background-opacity--fore: 1;
  --wiki-content-background-color: #2f3238;
  --wiki-content-background-color--rgb: 47, 50, 56;
  --wiki-content-background-color--secondary: #282a2f;
  --wiki-content-background-color--secondary--rgb: 40, 42, 47;
  --wiki-content-text-color: #e6e6e6;
  --wiki-content-text-color--rgb: 230, 230, 230;
  --wiki-content-text-color--secondary: #999;
  --wiki-content-text-color--accent: #12b548;
  --wiki-content-link-color: #ffcc00;
  --wiki-content-link-color--rgb: 255,204,0;
  --wiki-content-link-color--hover: #ffe065;
  --wiki-content-link-color--hover--rgb: 255,224,101;
  --wiki-content-redlink-color: #ff6678;
  --wiki-content-redlink-color--rgb: 255,102,120;
  --wiki-content-border-color: #5d5f64;
  --wiki-content-border-color--rgb: 93, 95, 100;
  --wiki-content-border-color--secondary: #5d5f64;
  --wiki-content-border-color--secondary--rgb: 93, 95, 100;
  --wiki-content-border-color--accent: #525252;
  --wiki-content-border-color--accent--rgb: 82,82,82;
  --wiki-navigation-background-color: var(--wiki-content-background-color);
  --wiki-navigation-background-color--rgb: var(--wiki-content-background-color--rgb);
  --wiki-accent-color: #f5c400;
  --wiki-accent-color--rgb: 245,196,0;
  --wiki-accent-color--hover: #ffe270;
  --wiki-accent-color--hover--rgb: 255,226,112;
  --wiki-alert-color: #ff9a9b;
  --wiki-alert-color--rgb: 255,154,155;
  --wiki-warning-color: #ffab5b;
  --wiki-warning-color--rgb: 255,171,91;
  --wiki-success-color: #23d70f;
  --wiki-success-color--rgb: 35,215,15;
  --wiki-icon-to-link-filter: invert(91%) sepia(21%) saturate(6922%) hue-rotate(356deg) brightness(101%) contrast(108%);
}
@media screen and (max-width: 900px) {
  :root {
    --layout-logo-scale: 0.75;
  }
}
@media screen and (max-width: 600px) {
  :root {
    --layout-logo-scale: 0.5;
  }
}
.theme-dark {
  --wiki-body-background-color: #000;
  --wiki-body-background-image: url(https://pico.wiki.gg/images/8/80/Site-background.jpg);
  --wiki-body-background-position: center top;
  --wiki-body-background-size: auto 260px;
  --wiki-content-border-color: #3a3a3a;
  --wiki-content-border-color--rgb: 58, 58, 58;
  --wiki-content-border-color--secondary: #3a3a3a;
  --wiki-content-border-color--secondary--rgb: 58, 58, 58;
  --wiki-box-border-width: 1px;
  --wiki-content-background-color: #000;
  --wiki-content-background-color--rgb: 0,0,0;
  --wiki-content-background-color--secondary: #0d0d0d;
  --wiki-content-background-color--secondary--rgb: 13,13,13;
  --wiki-content-link-color: #ffec1c;
  --wiki-content-link-color--rgb: 255,236,28;
  --wiki-content-link-color--hover: #fff482;
  --wiki-content-link-color--hover--rgb: 255,244,130;
  --wiki-icon-to-link-filter: invert(82%) sepia(59%) saturate(623%) hue-rotate(354deg) brightness(107%) contrast(101%);
}
@media (max-width: 1365px) {
  :root.theme-dark {
    --wiki-body-background-size: auto 308px;
  }
}
/***********************************************************************************************************
 * local layout setting
 ***********************************************************************************************************/
/*
min-width: calc($layout-sidebar-width + $layout-content-max-width + $layout-sidespace * 2 + $layout-box-gap-x * 3)

$layout-content-max-width: 1600px;
$layout-sidebar-width: 180px;
$layout-sidespace: 30px;
$layout-box-gap-x: 12px;
 */
@media screen and (min-width: 1876px) {
  :root {
    --layout-sidespace: minmax(0,1fr); /* whitespace width on most left and most right */
    --layout-content-width: 1641px;
  }
}

html.theme-dark::before {
  background-attachment: var(--wiki-body-background-attachment);
}

@media screen and (min-width: 1366px) {
  .theme-dark #mw-panel .vector-menu-portal + .vector-menu-portal {
    border-top-width: 1px;
  }
}

.evgallery figure {
  vertical-align: top;
}