“用户:Shio/common.css”的版本间差异

来自ThunionWiki
 
第1行: 第1行:
@media (prefers-color-scheme: dark),
@media (prefers-color-scheme: dark),
body.skin-dark,
body.vector-dark,
body.skin-vector-dark,
body.mw-prefers-dark,
html[data-user-theme="dark"] {
html[data-user-theme="dark"] {


  /* 颜色变量 */
   :root {
   :root {
     --wiki-bg: #0b0c0f;         /* 页面背景 */
     --dark-bg: #0c0d10;
     --wiki-article-bg: #0b0c0f; /* 文章区域背景 */
     --dark-surface: #14161a;
     --wiki-surface: #0f1114;   /* 卡片面板背景 */
     --dark-border: #25282d;
     --wiki-text: #e6eef6;       /* 正文文字 */
     --dark-text: #e8edf3;
     --wiki-muted: #98a0aa;     /* 次要文字(说明、时间) */
     --dark-muted: #a0a7b2;
     --wiki-link: #6fb3ff;       /* 链接 */
     --dark-link: #6fb3ff;
     --wiki-link-visited: #9aaeea;
     --dark-link-visited: #9aaeea;
     --wiki-border: #22252a;    /* 分隔线、表格线 */
     --dark-highlight: #20242b;
    --wiki-code-bg: #0b0c0f;    /* 代码块背景 */
    --wiki-highlight: #263246;  /* 高亮、表头背景等 */
    --wiki-error: #ff7b7b;      /* 错误警告 */
    --wiki-shadow: rgba(0,0,0,0.6);
   }
   }


   html, body, #mw-content-text, #content, #WikiaArticle, .mw-body {
   html, body {
     background-color: var(--wiki-bg) !important;
     background-color: var(--dark-bg) !important;
     color: var(--wiki-text) !important;
     color: var(--dark-text) !important;
   }
   }


   .mw-body, .mw-body *:not(img):not(svg):not(video):not(canvas) {
   #mw-content-text, .mw-body {
     background-color: transparent !important;
     background-color: var(--dark-bg) !important;
     color: inherit !important;
     color: var(--dark-text) !important;
   }
   }


   #mw-panel, #p-personal, .sidebar, .portlet, .mw-portlet {
   .mw-body-content, #mw-content, #content {
     background-color: var(--wiki-surface) !important;
     background: var(--dark-bg) !important;
     color: var(--wiki-text) !important;
     color: var(--dark-text) !important;
    border-color: var(--wiki-border) !important;
    box-shadow: 0 1px 4px var(--wiki-shadow) !important;
   }
   }


   a, a:link, a:visited {
   #mw-header, #mw-site-navigation, #mw-related-navigation, #mw-personal, #mw-page-header {
     color: var(--wiki-link) !important;
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
     color: var(--dark-text) !important;
   }
   }
   a:visited { color: var(--wiki-link-visited) !important; }
 
  a:hover, a:active, a:focus {
   a, a:link {
    text-decoration: underline !important;
    color: var(--dark-link) !important;
    filter: brightness(1.05) !important;
   }
   }
 
  a:visited {
h1, h2, h3, h4, h5, h6 {
     color: var(--dark-link-visited) !important;
     color: var(--wiki-text) !important;
   }
   }
   .mw-headline {
   a:hover, a:focus {
     color: var(--wiki-text) !important;
    text-decoration: underline !important;
     filter: brightness(1.1);
   }
   }


   table, .wikitable {
   table, .wikitable {
     background-color: transparent !important;
     background-color: transparent !important;
     color: var(--wiki-text) !important;
     border-color: var(--dark-border) !important;
     border-color: var(--wiki-border) !important;
     color: var(--dark-text) !important;
   }
   }
   .wikitable th {
   .wikitable th {
     background-color: var(--wiki-highlight) !important;
     background-color: var(--dark-highlight) !important;
    color: var(--wiki-text) !important;
  }
  .wikitable td, .wikitable th {
    border-color: var(--wiki-border) !important;
   }
   }


   pre, code, tt {
   pre, code, tt {
     background-color: var(--wiki-code-bg) !important;
     background-color: #121417 !important;
     color: var(--wiki-text) !important;
     color: var(--dark-text) !important;
     border-color: var(--wiki-border) !important;
     border: 1px solid var(--dark-border) !important;
   }
   }
  pre {
    box-shadow: none !important;
  }
   blockquote {
   blockquote {
    background-color: transparent !important;
     border-left: 3px solid var(--dark-border) !important;
     border-left: 3px solid var(--wiki-border) !important;
     color: var(--dark-muted) !important;
     color: var(--wiki-muted) !important;
   }
   }


   input, textarea, select, button {
   input, textarea, select, button {
     background-color: #111418 !important;
     background-color: var(--dark-surface) !important;
     color: var(--wiki-text) !important;
     color: var(--dark-text) !important;
     border: 1px solid var(--wiki-border) !important;
     border: 1px solid var(--dark-border) !important;
  }
  button {
    background-image: none !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.6) inset !important;
   }
   }


   .tag, .badge, .tooltip {
   #mw-footer, .site-footer {
     background-color: var(--wiki-highlight) !important;
     background-color: var(--dark-surface) !important;
     color: var(--wiki-text) !important;
     color: var(--dark-muted) !important;
     border-color: var(--wiki-border) !important;
     border-top: 1px solid var(--dark-border) !important;
   }
   }


   .mw-warning, .mw-warning a, .infobox, .messagebox {
   .infobox, .messagebox, .mw-warning {
    background-color: #121417 !important;
     background-color: var(--dark-highlight) !important;
    color: var(--wiki-text) !important;
     color: var(--dark-text) !important;
    border-color: var(--wiki-border) !important;
     border-color: var(--dark-border) !important;
  }
 
  #footer, .printfooter, .site-info {
     background-color: transparent !important;
    color: var(--wiki-muted) !important;
     border-color: var(--wiki-border) !important;
  }
 
  .thumb, .image, .mw-image {
     background-color: transparent !important;
    border: 1px solid var(--wiki-border) !important;
   }
   }


  /* 禁用某些图片反转(某些站点用 filter 改变图片颜色时) */
   img, svg, video {
   img, svg, video {
     filter: none !important;
     filter: none !important;
第121行: 第88行:
   }
   }


   /* 强制表格中的链接和按钮可见 */
   [style*="background-color:#fff"],
   .mw-parser-output a, .mw-parser-output button {
   [style*="background-color: white"] {
     color: var(--wiki-link) !important;
     background-color: transparent !important;
   }
   }


 
   .infobox, .wikitable, .messagebox, .mw-body {
   /* 处理高对比度或内联样式较强的元素:尽量把主要文字改回可读色 */
     border-radius: 8px !important;
  [style*="background"], [style*="background-color"] {
     color: var(--wiki-text) !important;
   }
   }
}
}

2025年11月9日 (日) 14:29的最新版本

@media (prefers-color-scheme: dark),
html[data-user-theme="dark"] {

  /* 颜色变量 */
  :root {
    --dark-bg: #0c0d10;
    --dark-surface: #14161a;
    --dark-border: #25282d;
    --dark-text: #e8edf3;
    --dark-muted: #a0a7b2;
    --dark-link: #6fb3ff;
    --dark-link-visited: #9aaeea;
    --dark-highlight: #20242b;
  }

  html, body {
    background-color: var(--dark-bg) !important;
    color: var(--dark-text) !important;
  }

  #mw-content-text, .mw-body {
    background-color: var(--dark-bg) !important;
    color: var(--dark-text) !important;
  }

  .mw-body-content, #mw-content, #content {
    background: var(--dark-bg) !important;
    color: var(--dark-text) !important;
  }

  #mw-header, #mw-site-navigation, #mw-related-navigation, #mw-personal, #mw-page-header {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
  }

  a, a:link {
    color: var(--dark-link) !important;
  }
  a:visited {
    color: var(--dark-link-visited) !important;
  }
  a:hover, a:focus {
    text-decoration: underline !important;
    filter: brightness(1.1);
  }

  table, .wikitable {
    background-color: transparent !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text) !important;
  }
  .wikitable th {
    background-color: var(--dark-highlight) !important;
  }

  pre, code, tt {
    background-color: #121417 !important;
    color: var(--dark-text) !important;
    border: 1px solid var(--dark-border) !important;
  }
  blockquote {
    border-left: 3px solid var(--dark-border) !important;
    color: var(--dark-muted) !important;
  }

  input, textarea, select, button {
    background-color: var(--dark-surface) !important;
    color: var(--dark-text) !important;
    border: 1px solid var(--dark-border) !important;
  }

  #mw-footer, .site-footer {
    background-color: var(--dark-surface) !important;
    color: var(--dark-muted) !important;
    border-top: 1px solid var(--dark-border) !important;
  }

  .infobox, .messagebox, .mw-warning {
    background-color: var(--dark-highlight) !important;
    color: var(--dark-text) !important;
    border-color: var(--dark-border) !important;
  }

  img, svg, video {
    filter: none !important;
    background: transparent !important;
  }

  [style*="background-color:#fff"],
  [style*="background-color: white"] {
    background-color: transparent !important;
  }

  .infobox, .wikitable, .messagebox, .mw-body {
    border-radius: 8px !important;
  }
}