MediaWiki:Common.css

Opmerking: na het publiceren moet je misschien je browsercache legen om de veranderingen te zien.

Firefox / Safari: houd Shift ingedrukt terwijl u:je op Vernieuwen klikt of druk op Ctrl-F5 of Ctrl-R (⌘-Shift-R op een Mac)
Google Chrome: druk op Ctrl-Shift-R (⌘-Shift-R op een Mac)
Edge: houd Ctrl ingedrukt terwijl u:je op Vernieuwen klikt of druk op Ctrl-F5.

/* Base infobox styling */
.infobox {
    border: 1px solid var(--infobox-border, #ccc);
    border-radius: 6px;
    padding: 0.5em;
    margin: 1em 0;
    font-size: 90%;
    width: 300px;
    background-color: var(--infobox-bg, #f9f9f9);
    color: var(--infobox-text, #000);
}

/* Infobox header */
.infobox .infobox-title {
    font-weight: bold;
    font-size: 110%;
    padding: 0.4em;
    text-align: center;
    background-color: var(--infobox-header-bg, #e0e0e0);
    color: var(--infobox-header-text, #000);
    border-bottom: 1px solid var(--infobox-border, #ccc);
}

/* Infobox rows */
.infobox .infobox-row {
    padding: 0.3em 0.5em;
    border-bottom: 1px solid var(--infobox-border, #ccc);
}
.infobox .infobox-row:last-child {
    border-bottom: none;
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .infobox {
        --infobox-bg: #1e1e1e;
        --infobox-text: #e0e0e0;
        --infobox-border: #444;
    }
    .infobox .infobox-title {
        --infobox-header-bg: #333;
        --infobox-header-text: #fff;
    }
}

/* Adapting banners to dark and light page mode  */

/* Light mode defaults */
:root {
  --banner-bg: #eeeeee;
  --banner-fg: #000000;
}

/* Dark mode overrides */
@media (prefers-color-scheme: dark) {
  :root {
    --banner-bg: #222222;
    --banner-fg: #ffffff;
  }
}