EveryCRT Wiki

MediaWiki:Minerva.css: Difference between revisions

← Older edit
No edit summary
No edit summary
 
Line 1: Line 1:
/* All CSS here will be loaded for users of the MinervaNeue skin */
/* All CSS here will be loaded for users of the MinervaNeue skin */
/* Display footer links fix for MediaWiki < 1.44: */
/* Display footer links fix for MediaWiki < 1.44: */
/* https://www.mediawiki.org/wiki/Manual:Footer#Note_for_MediaWiki_versions_before_1.44.0 */
/* https://www.mediawiki.org/wiki/Manual:Footer#Note_for_MediaWiki_versions_before_1.44.0 */
Line 9: Line 11:




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


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


/* Token tags - the selected items */
/* Select2 token/choice tags */
html.skin-theme-clientpref-night .pfTokens .token {
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice {
     background-color: #45475a !important;
     background-color: #45475a !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
Line 29: Line 27:
}
}


/* Token text - ensure all text inside tokens is visible */
/* Text inside the token */
html.skin-theme-clientpref-night .pfTokens .token,
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice,
html.skin-theme-clientpref-night .pfTokens .token span,
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice span,
html.skin-theme-clientpref-night .pfTokens .token p,
html.skin-theme-clientpref-night .select2-container--default .select2-selection__rendered,
html.skin-theme-clientpref-night .pfTokens .token label {
html.skin-theme-clientpref-night .select2-container--default .select2-selection__rendered li {
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
}
}


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


/* Token input text field */
html.skin-theme-clientpref-night .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
html.skin-theme-clientpref-night .pfTokens input,
    color: #ff6b8a !important;
html.skin-theme-clientpref-night .pfTokens input[type="text"] {
}
 
/* 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;
     background-color: #313244 !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
    border-color: #45475a !important;
}
}


/* Token input placeholder text */
/* Placeholder text */
html.skin-theme-clientpref-night .pfTokens input::placeholder {
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;
     color: #a6adc8 !important;
     opacity: 1 !important;
     opacity: 1 !important;
}
}


/* Form table styling */
/* Dropdown menu */
html.skin-theme-clientpref-night .formtable {
html.skin-theme-clientpref-night .select2-container--default .select2-dropdown {
    background-color: #1e1e2e;
}
 
html.skin-theme-clientpref-night .formtable th {
    color: #cdd6f4;
}
 
html.skin-theme-clientpref-night .formtable td {
    color: #cdd6f4;
}
 
/* All text inputs in forms */
html.skin-theme-clientpref-night .formtable input[type="text"],
html.skin-theme-clientpref-night .formtable input[type="url"],
html.skin-theme-clientpref-night .formtable textarea,
html.skin-theme-clientpref-night .formtable select {
     background-color: #313244 !important;
     background-color: #313244 !important;
    color: #cdd6f4 !important;
     border-color: #45475a !important;
     border-color: #45475a !important;
}
}


/* Combobox inputs */
html.skin-theme-clientpref-night .select2-container--default .select2-results__option {
html.skin-theme-clientpref-night .pfComboBox,
html.skin-theme-clientpref-night .pfComboBox input {
     background-color: #313244 !important;
     background-color: #313244 !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
    border-color: #45475a !important;
}
}


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


/* Form buttons */
/* Search box in dropdown */
html.skin-theme-clientpref-night input[type="submit"],
html.skin-theme-clientpref-night .select2-container--default .select2-search--dropdown .select2-search__field {
html.skin-theme-clientpref-night .mw-htmlform-submit {
     background-color: #313244 !important;
     background-color: #45475a !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
     border-color: #585b70 !important;
     border-color: #45475a !important;
}
}


/* Placeholder text everywhere */
/* "Searching..." and "No results found" messages */
html.skin-theme-clientpref-night input::placeholder,
html.skin-theme-clientpref-night .select2-container--default .select2-results__message {
html.skin-theme-clientpref-night textarea::placeholder {
     color: #a6adc8 !important;
     color: #a6adc8 !important;
    opacity: 1 !important;
}
}


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


     html.skin-theme-clientpref-os .pfTokens .token {
     html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice {
         background-color: #45475a !important;
         background-color: #45475a !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
Line 140: Line 102:
     }
     }


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


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


     html.skin-theme-clientpref-os .pfTokens input,
     html.skin-theme-clientpref-os .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
     html.skin-theme-clientpref-os .pfTokens input[type="text"] {
        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;
         background-color: #313244 !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
        border-color: #45475a !important;
     }
     }


     html.skin-theme-clientpref-os .pfTokens input::placeholder {
     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;
         color: #a6adc8 !important;
         opacity: 1 !important;
         opacity: 1 !important;
     }
     }


     html.skin-theme-clientpref-os .formtable {
     html.skin-theme-clientpref-os .select2-container--default .select2-dropdown {
        background-color: #1e1e2e;
    }
 
    html.skin-theme-clientpref-os .formtable th {
        color: #cdd6f4;
    }
 
    html.skin-theme-clientpref-os .formtable td {
        color: #cdd6f4;
    }
 
    html.skin-theme-clientpref-os .formtable input[type="text"],
    html.skin-theme-clientpref-os .formtable input[type="url"],
    html.skin-theme-clientpref-os .formtable textarea,
    html.skin-theme-clientpref-os .formtable select {
         background-color: #313244 !important;
         background-color: #313244 !important;
        color: #cdd6f4 !important;
         border-color: #45475a !important;
         border-color: #45475a !important;
     }
     }


     html.skin-theme-clientpref-os .pfComboBox,
     html.skin-theme-clientpref-os .select2-container--default .select2-results__option {
    html.skin-theme-clientpref-os .pfComboBox input {
         background-color: #313244 !important;
         background-color: #313244 !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
        border-color: #45475a !important;
     }
     }


     html.skin-theme-clientpref-os .ui-autocomplete,
     html.skin-theme-clientpref-os .select2-container--default .select2-results__option--highlighted,
    html.skin-theme-clientpref-os .ui-menu {
     html.skin-theme-clientpref-os .select2-container--default .select2-results__option--highlighted[aria-selected],
        background-color: #313244 !important;
     html.skin-theme-clientpref-os .select2-container--default .select2-results__option[aria-selected=true] {
        border-color: #45475a !important;
    }
 
    html.skin-theme-clientpref-os .ui-autocomplete .ui-menu-item,
     html.skin-theme-clientpref-os .ui-autocomplete .ui-menu-item a,
    html.skin-theme-clientpref-os .ui-menu .ui-menu-item,
     html.skin-theme-clientpref-os .ui-menu .ui-menu-item a {
        color: #cdd6f4 !important;
        background-color: #313244 !important;
    }
 
    html.skin-theme-clientpref-os .ui-autocomplete .ui-menu-item:hover,
    html.skin-theme-clientpref-os .ui-autocomplete .ui-state-focus,
    html.skin-theme-clientpref-os .ui-menu .ui-menu-item:hover,
    html.skin-theme-clientpref-os .ui-menu .ui-state-focus {
         background-color: #45475a !important;
         background-color: #45475a !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
     }
     }


     html.skin-theme-clientpref-os input[type="submit"],
     html.skin-theme-clientpref-os .select2-container--default .select2-search--dropdown .select2-search__field {
    html.skin-theme-clientpref-os .mw-htmlform-submit {
         background-color: #313244 !important;
         background-color: #45475a !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
         border-color: #585b70 !important;
         border-color: #45475a !important;
     }
     }


     html.skin-theme-clientpref-os input::placeholder,
     html.skin-theme-clientpref-os .select2-container--default .select2-results__message {
    html.skin-theme-clientpref-os textarea::placeholder {
         color: #a6adc8 !important;
         color: #a6adc8 !important;
        opacity: 1 !important;
     }
     }
}
}
Retrieved from "https://wiki.everycrt.com/wiki/MediaWiki:Minerva.css"
MediaWiki Appliance - Powered by TurnKey Linux