MediaWiki:Common.css

/* CSS placed here will be applied to all skins */

.plainlist > ul {
	list-style-type: none;
	padding-left: 0;
}

/* less table padding, and not wasting space in cells without a sort button */

.skin-citizen table.wikitable tr td,
.skin-citizen table.wikitable tr th {
   padding: 5px;
}

.skin-citizen table.wikitable tr th.headerSort {
  padding-right: 21px;
}

/* font based on in-game Tekken symbols */

@font-face {
   font-family: IronFist;
   src: url('/w/skins/Tekken/Iron-Fist.woff');
   font-weight: normal;
   font-style: normal;
   font-display: block;
}

.ironfist {
  font-family: IronFist;
}

/*
 * Colors are from https://www.hsluv.org/ color space
 * 
 * Light mode bg: hsluv(0, 0, 100)
 * Dark mode bg: hsluv(0, 0, 5)
 *
 * == hue
 * red    12
 * yellow 65
 * green  120
 * blue   240
 *
 * == saturation
 * base   100
 * muddy  50
 *
 * == lightness
 * base   80
 * {n}    100 - {n}
 * 
 * == lightness (dark mode)
 * base   25
 * {n}    5 + {n}
 */
 
:root {
   --blue-muddy-05: #ecf1f8;
   --yellow: #efc200;
   --green: #6de000;
   --red: #ffb3b3;
}

@media (prefers-color-scheme: dark) {
   :root {
      --blue-muddy-05: #121d26;
      --yellow: #493a00;
      --green: #1c4400;
      --red: #7e0002;
   }
   
   body.skin-citizen {
      background-color: #111111;
   }
}

.bg-green { background-color: var(--green); }
.bg-red { background-color: var(--red); }
.bg-yellow { background-color: var(--yellow); }

.hover-bg-blue-muddy-05:hover {
	background-color: var(--blue-muddy-05);
}