MediaWiki:Gadget-Colortable.css

.colortable { text-align: center; --green-l: #c8ffc8; --red-l: #ffc8c8; --blue-l: #c8c8ff; --yellow-l: #eee8aa; --green-d: #4b804b; --red-d: #804b4b; --blue-d: #4b4b80; --yellow-d: #746f3d; --green: var(--green-l); --red: var(--red-l); --blue: var(--blue-l); --yellow: var(--blue-l); }

@media screen and (prefers-color-scheme: dark) { /* only timeless has a dark theme skin right now */ /* citizen is not here because it manages dark theme itself; adding it here will conflict with its light theme */ body.skin-timeless .colortable { --green: var(--green-d); --red: var(--red-d); --blue: var(--blue-d); --yellow: var(--yellow-d); } }

html.skin-citizen-dark .colortable { --green: var(--green-d); --red: var(--red-d); --blue: var(--blue-d); --yellow: var(--yellow-d); }

body.skin-citizen .colortable td { padding: 10px; /* default padding is 10px 20px 10px 0 but it looks weird with bg colors */ }

.ct-green { background-color: var(--green)  } .ct-red { background-color: var(--red) } .ct-blue { background-color: var(--blue) } .ct-yellow { background-color: var(--yellow) }