User:Fen/Portals/Incidents/styles.css: Difference between revisions

Fen (talk | contribs)
for dark theme users
Fen (talk | contribs)
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 112: Line 112:


/* Dark theme */
/* Dark theme */
/* Auto dark mode: OS preference */
@media screen {
  html.skin-theme-clientpref-night .incidents-portal-wrapper {
    background: #1e1e1e;
    color: #e5e5e5;
  }
  html.skin-theme-clientpref-night .incidents-header {
    background: linear-gradient(to right, #7f1d1d, #5a1010);
    color: #fff;
    border-left-color: #ff4d4d;
    box-shadow: 0 0 15px rgba(255, 77, 77, 0.3);
  }
  html.skin-theme-clientpref-night .incidents-title {
    color: #ffbdbd;
  }
  html.skin-theme-clientpref-night .incidents-subtitle {
    color: #ffcccc;
  }
  html.skin-theme-clientpref-night .incidents-card {
    background: #2b2b2b;
    border: 2px solid #4d2c2c;
    border-left: 5px solid #aa0000;
    border-left-color: #aa0000;
    box-shadow: 0 2px 6px rgba(200, 0, 0, 0.1);
  }
  html.skin-theme-clientpref-night .incidents-card:hover {
    box-shadow: 0 5px 10px rgba(255, 0, 0, 0.2);
  }
  html.skin-theme-clientpref-night .incidents-card-title {
    color: #ff9999;
    border-bottom-color: #666;
  }
  html.skin-theme-clientpref-night .incidents-card-body {
    color: #f0f0f0;
  }
  html.skin-theme-clientpref-night .incidents-card-body a[href*="Category:"] {
    background: #3a1a1a;
    border: 1px solid #aa4444;
    color: #ff9999;
  }
  html.skin-theme-clientpref-night .incidents-card-body a[href*="Category:"]:hover {
    background: #502020;
    color: #ffdddd;
    border-color: #ff6666;
  }
  html.skin-theme-clientpref-night a:link,
  html.skin-theme-clientpref-night a:visited {
    color: #ff5e5e;
  }
  html.skin-theme-clientpref-night a:hover {
    color: #ff9999;
  }
  html.skin-theme-clientpref-night .content-header {
    color: #aabbee;
    border-bottom-color: #7881c7;
  }
}
@media screen and (prefers-color-scheme: dark) {
@media screen and (prefers-color-scheme: dark) {
   html.skin-theme-clientpref-os .incidents-portal-wrapper {
   html.skin-theme-clientpref-os .incidents-portal-wrapper {
Line 136: Line 208:
     background: #2b2b2b;
     background: #2b2b2b;
     border: 2px solid #4d2c2c;
     border: 2px solid #4d2c2c;
    border-left: 5px solid #aa0000;
     border-left-color: #aa0000;
     border-left-color: #aa0000;
     box-shadow: 0 2px 6px rgba(200, 0, 0, 0.1);
     box-shadow: 0 2px 6px rgba(200, 0, 0, 0.1);
Line 172: Line 245:
   html.skin-theme-clientpref-os a:hover {
   html.skin-theme-clientpref-os a:hover {
     color: #ff9999;
     color: #ff9999;
  }
}
@media screen {
  html.skin-theme-clientpref-night .law-portal-wrapper,
  html.skin-theme-clientpref-os .law-portal-wrapper {
    background-color: #131813;
    color: #e0e0e0;
  }
  html.skin-theme-clientpref-night .law-header,
  html.skin-theme-clientpref-os .law-header {
    background: linear-gradient(135deg, #003319, #001c10);
    color: #e2ffe2;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.6);
  }
  html.skin-theme-clientpref-night .law-card,
  html.skin-theme-clientpref-os .law-card {
    background: #1c1f1c;
    border: 1px solid #333;
    border-left: 6px solid #228b22;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  }
  html.skin-theme-clientpref-night .law-card-title,
  html.skin-theme-clientpref-os .law-card-title {
    color: #66ff66;
  }
  html.skin-theme-clientpref-night a:link,
  html.skin-theme-clientpref-night a:visited,
  html.skin-theme-clientpref-os a:link,
  html.skin-theme-clientpref-os a:visited {
    color: #7fff7f;
  }
  html.skin-theme-clientpref-night a:hover,
  html.skin-theme-clientpref-os a:hover {
    color: #b3ffb3;
   }
   }
}
}