Jump to content

MediaWiki:Vector.css

From NFF
Revision as of 00:43, 13 June 2025 by Gunto (talk | contribs) (Created page with "* Fix for Wikitables in Vector 2022 Dark Mode * This code applies dark theme styles to tables when dark mode is active.: The .skin-theme-clientpref-night class is added to the <html> element when dark mode is on: .skin-theme-clientpref-night .wikitable { background-color: #202122; A dark grey, similar to Wikipedia's dark theme: color: #eaecf0; A light grey for text: border: 1px solid #72777d; /* A mid-grey for the main table...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/*
 * Fix for Wikitables in Vector 2022 Dark Mode
 * This code applies dark theme styles to tables when dark mode is active.
 */

/* The .skin-theme-clientpref-night class is added to the <html> element when dark mode is on */
.skin-theme-clientpref-night .wikitable {
    background-color: #202122; /* A dark grey, similar to Wikipedia's dark theme */
    color: #eaecf0;            /* A light grey for text */
    border: 1px solid #72777d; /* A mid-grey for the main table border */
}

/* Style for table headers (<th> tags) in dark mode */
.skin-theme-clientpref-night .wikitable > tr > th,
.skin-theme-clientpref-night .wikitable > * > tr > th {
    background-color: #303132; /* A slightly lighter grey for headers */
    border: 1px solid #72777d;
}

/* Style for table cells (<td> tags) in dark mode */
.skin-theme-clientpref-night .wikitable > tr > td,
.skin-theme-clientpref-night .wikitable > * > tr > td {
    border-color: #72777d; /* Ensure cell borders match */
}

/* Fix for links inside dark mode tables */
.skin-theme-clientpref-night .wikitable a {
    color: #6495ED; /* A nice blue that stands out on a dark background */
}

.skin-theme-clientpref-night .wikitable a:visited {
    color: #9370DB; /* A purplish color for visited links */
}