git.m6w6.name Git - m6w6/m6w6.github.io/blob - _sass/_colors.scss

   1 $view-backgroud-color: #000;
   2 $page-background-color: rgba(255, 255, 255, 0.90);
   3 $code-background-color: rgba(255, 255, 255, 0.50);
   4
   5 $shadow-color: #666;
   6 $border-color: #ccc;
   7
   8 $header-color: #000;
   9 $body-color: #000;
  10 $code-color: #821;
  11
  12 $a-link-color: #178;
  13 $a-active-color: #182;
  14 $a-visited-color: #218;
  15 $a-hover-color: #182;
  16
  17 @media (prefers-color-scheme: light) {
  18         :root {
  19                 --view-backgroud-color: #000;
  20                 --page-background-color: rgba(255, 255, 255, 0.90);
  21                 --code-background-color: rgba(255, 255, 255, 0.50);
  22
  23                 --shadow-color: #666;
  24                 --border-color: #ccc;
  25
  26                 --header-color: #000;
  27                 --body-color: #000;
  28                 --code-color: #821;
  29
  30                 --a-link-color: #178;
  31                 --a-active-color: #182;
  32                 --a-visited-color: #218;
  33                 --a-hover-color: #182;
  34         }
  35 }
  36
  37 @media (prefers-color-scheme: dark) {
  38         :root {
  39                 --view-backgroud-color: #000;
  40                 --page-background-color: rgba(17, 17, 17, 0.90);
  41                 --code-background-color: rgba(102, 102, 102, 0.50);
  42
  43                 --shadow-color: #666;
  44                 --border-color: #999;
  45
  46                 --header-color: #f0f0f0;
  47                 --body-color: #ddd;
  48                 --code-color: #c43;
  49
  50                 --a-link-color: #8df;
  51                 --a-active-color: #8f9;
  52                 --a-visited-color: #98f;
  53                 --a-hover-color: #8f9;
  54         }
  55 }