MediaWiki:Minerva.css: Difference between revisions

Latest revision as of 04:44, 20 January 2026

/* All CSS here will be loaded for users of the MinervaNeue skin */


/* Display footer links fix for MediaWiki < 1.44: */
/* https://www.mediawiki.org/wiki/Manual:Footer#Note_for_MediaWiki_versions_before_1.44.0 */
ul.footer-places li {
  display:inline !important;
}




/* ===== SELECT2 / PAGE FORMS DARK MODE FIXES ===== */
/* Add this to MediaWiki:Minerva.css or MediaWiki:Common.css */

/* Select2 container */
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple {
    background-color: #313244 !important;
    border-color: #45475a !important;
}

/* Select2 token/choice tags */
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #45475a !important;
    color: #cdd6f4 !important;
    border-color: #585b70 !important;
}

/* Text inside the token */
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice,
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice span,
html.skin-theme-clientpref-night .select2-container--default .select2-selection__rendered,
html.skin-theme-clientpref-night .select2-container--default .select2-selection__rendered li {
    color: #cdd6f4 !important;
}

/* The × remove button */
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #f38ba8 !important;
}

html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #ff6b8a !important;
}

/* Search input field inside Select2 */
html.skin-theme-clientpref-night .select2-container--default .select2-search--inline .select2-search__field,
html.skin-theme-clientpref-night .select2-search__field {
    background-color: #313244 !important;
    color: #cdd6f4 !important;
}

/* Placeholder text */
html.skin-theme-clientpref-night .select2-container--default .select2-search--inline .select2-search__field::placeholder,
html.skin-theme-clientpref-night .select2-search__field::placeholder {
    color: #a6adc8 !important;
    opacity: 1 !important;
}

/* Dropdown menu */
html.skin-theme-clientpref-night .select2-container--default .select2-dropdown {
    background-color: #313244 !important;
    border-color: #45475a !important;
}

html.skin-theme-clientpref-night .select2-container--default .select2-results__option {
    background-color: #313244 !important;
    color: #cdd6f4 !important;
}

/* Dropdown item hover/highlighted state */
html.skin-theme-clientpref-night .select2-container--default .select2-results__option--highlighted,
html.skin-theme-clientpref-night .select2-container--default .select2-results__option--highlighted[aria-selected],
html.skin-theme-clientpref-night .select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #45475a !important;
    color: #cdd6f4 !important;
}

/* Search box in dropdown */
html.skin-theme-clientpref-night .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #313244 !important;
    color: #cdd6f4 !important;
    border-color: #45475a !important;
}

/* "Searching..." and "No results found" messages */
html.skin-theme-clientpref-night .select2-container--default .select2-results__message {
    color: #a6adc8 !important;
}

/* ===== OS DARK MODE PREFERENCE ===== */
@media (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple {
        background-color: #313244 !important;
        border-color: #45475a !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #45475a !important;
        color: #cdd6f4 !important;
        border-color: #585b70 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice,
    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice span,
    html.skin-theme-clientpref-os .select2-container--default .select2-selection__rendered,
    html.skin-theme-clientpref-os .select2-container--default .select2-selection__rendered li {
        color: #cdd6f4 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        color: #f38ba8 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
        color: #ff6b8a !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-search--inline .select2-search__field,
    html.skin-theme-clientpref-os .select2-search__field {
        background-color: #313244 !important;
        color: #cdd6f4 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-search--inline .select2-search__field::placeholder,
    html.skin-theme-clientpref-os .select2-search__field::placeholder {
        color: #a6adc8 !important;
        opacity: 1 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-dropdown {
        background-color: #313244 !important;
        border-color: #45475a !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-results__option {
        background-color: #313244 !important;
        color: #cdd6f4 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-results__option--highlighted,
    html.skin-theme-clientpref-os .select2-container--default .select2-results__option--highlighted[aria-selected],
    html.skin-theme-clientpref-os .select2-container--default .select2-results__option[aria-selected=true] {
        background-color: #45475a !important;
        color: #cdd6f4 !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-search--dropdown .select2-search__field {
        background-color: #313244 !important;
        color: #cdd6f4 !important;
        border-color: #45475a !important;
    }

    html.skin-theme-clientpref-os .select2-container--default .select2-results__message {
        color: #a6adc8 !important;
    }
}