Template:License/styles.css: Difference between revisions
No edit summary |
Fix darkmode |
||
| Line 24: | Line 24: | ||
.mw-license-desc a { font-weight: bold; } | .mw-license-desc a { font-weight: bold; } | ||
/* Light mode badge colours */ | |||
.mw-license-cc-by .mw-license-badge { background: #b3e0b3; } | .mw-license-cc-by .mw-license-badge { background: #b3e0b3; } | ||
.mw-license-cc-by-sa .mw-license-badge { background: #99d699; } | .mw-license-cc-by-sa .mw-license-badge { background: #99d699; } | ||
| Line 32: | Line 33: | ||
.mw-license-cc0 .mw-license-badge { background: #c4b5fd; } | .mw-license-cc0 .mw-license-badge { background: #c4b5fd; } | ||
.mw-license-arr .mw-license-badge { background: #e8e8e8; } | .mw-license-arr .mw-license-badge { background: #e8e8e8; } | ||
/* ── Dark mode ────────────────────────────────────────────────────────────── */ | |||
/* Covers: manual "Night" toggle and OS-level dark preference */ | |||
.skin-theme-clientpref-night .mw-license-box, | |||
.skin-theme-clientpref-os .mw-license-box { | |||
border-color: #555; | |||
color: #e8e8e8; | |||
} | |||
.skin-theme-clientpref-night .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-badge { | |||
border-right-color: #555; | |||
} | |||
.skin-theme-clientpref-night .mw-license-cc-by .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by .mw-license-badge { background: #1a4d1a; color: #c8f0c8; } | |||
.skin-theme-clientpref-night .mw-license-cc-by-sa .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by-sa .mw-license-badge { background: #144014; color: #a8e0a8; } | |||
.skin-theme-clientpref-night .mw-license-cc-by-nc .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc .mw-license-badge { background: #4d3d00; color: #ffe99a; } | |||
.skin-theme-clientpref-night .mw-license-cc-by-nc-sa .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc-sa .mw-license-badge { background: #4d3200; color: #ffd97a; } | |||
.skin-theme-clientpref-night .mw-license-cc-by-nd .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by-nd .mw-license-badge { background: #0d3a52; color: #a8d8f0; } | |||
.skin-theme-clientpref-night .mw-license-cc-by-nc-nd .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc-nd .mw-license-badge { background: #52112e; color: #f0a8cc; } | |||
.skin-theme-clientpref-night .mw-license-cc0 .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-cc0 .mw-license-badge { background: #2d1a5e; color: #d4bbff; } | |||
.skin-theme-clientpref-night .mw-license-arr .mw-license-badge, | |||
.skin-theme-clientpref-os .mw-license-arr .mw-license-badge { background: #333; color: #ccc; } | |||
/* OS preference: only apply dark colours when the OS is actually dark */ | |||
@media (prefers-color-scheme: light) { | |||
.skin-theme-clientpref-os .mw-license-box { border-color: #aaa; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-badge { border-right-color: #aaa; } | |||
.skin-theme-clientpref-os .mw-license-cc-by .mw-license-badge { background: #b3e0b3; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc-by-sa .mw-license-badge { background: #99d699; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc .mw-license-badge { background: #fde68a; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc-sa .mw-license-badge { background: #fcd34d; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc-by-nd .mw-license-badge { background: #a5d8f3; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc-by-nc-nd .mw-license-badge { background: #f3a5d8; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-cc0 .mw-license-badge { background: #c4b5fd; color: inherit; } | |||
.skin-theme-clientpref-os .mw-license-arr .mw-license-badge { background: #e8e8e8; color: inherit; } | |||
} | |||