BorderConnect Wiki

MediaWiki:Common.css: Difference between revisions

← Older editNewer edit →
No edit summary
No edit summary
Line 2,488: Line 2,488:
}
}


/* --- FIX SEARCH DROPDOWN READABILITY IN DARK MODE (ALL RESOLUTIONS) --- */
/* --- OVERRIDE HARDCODED 'HTML BODY' SEARCH COLORS IN DARK MODE --- */


/* 1. Main text: Target desktop, tablet, and mobile search overlays */
/* 1. Main Text & Descriptions: Outrank the html body !important rule */
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-search-result-title,
html.skin-theme-clientpref-night body .cdx-menu-item__content,
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-menu-item__text,
html.skin-theme-clientpref-night body .cdx-menu-item__text,
html.skin-theme-clientpref-night .vector-search-box-vue .cdx-menu-item__text,
html.skin-theme-clientpref-night body .cdx-typeahead-search-menu__item-title,
html.skin-theme-clientpref-night .cdx-search-result-title {
html.skin-theme-clientpref-night body .cdx-menu-item__description,
     color: #f8f9fa !important; /* Off-white for high readability */
html.skin-theme-clientpref-night body .cdx-search-result-title {
     color: #f8f9fa !important;
}
}


/* 2. Descriptions: If you have subtext under the titles, make it a lighter gray */
/* 2. Bolded Matching Text: Make sure the typed letters pop */
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-menu-item__text__description,
html.skin-theme-clientpref-night body .cdx-menu-item__content b,
html.skin-theme-clientpref-night .cdx-search-result__description {
html.skin-theme-clientpref-night body .cdx-menu-item__text b,
    color: #c8ccd1 !important;
html.skin-theme-clientpref-night body .cdx-typeahead-search-menu__item-title b,
}
html.skin-theme-clientpref-night body .cdx-search-result-title b {
 
     color: #ffffff !important;
/* 3. Matched text: The bolded letters the user typed */
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-search-result-title b,
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-search-result-title strong,
html.skin-theme-clientpref-night .cdx-search-result-title b {
     color: #ffffff !important; /* Pure white */
     font-weight: bold !important;
     font-weight: bold !important;
}
}


/* 4. Bottom link: "Search for pages containing..." */
/* 3. Bottom Link: "Search for pages containing..." */
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-menu-item--search-page,
html.skin-theme-clientpref-night body .cdx-menu-item--search-page,
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-menu-item--search-page * {
html.skin-theme-clientpref-night body .cdx-menu-item--search-page * {
     color: #8ab4f8 !important; /* Readable modern blue */
     color: #8ab4f8 !important;
}
 
/* 5. Mobile Background & Hover Fix: Ensure the overlay itself stays dark */
html.skin-theme-clientpref-night .cdx-typeahead-search__menu,
html.skin-theme-clientpref-night .vector-search-box-vue .cdx-menu {
    background-color: #202122 !important; /* Force dark background on mobile */
}
}


html.skin-theme-clientpref-night .cdx-menu-item:hover,
/* 4. Hover states to ensure they still look good */
html.skin-theme-clientpref-night .cdx-menu-item.cdx-menu-item--selected,
html.skin-theme-clientpref-night body .cdx-menu-item:hover,
html.skin-theme-clientpref-night .cdx-typeahead-search__menu .cdx-menu-item:active {
html.skin-theme-clientpref-night body .cdx-menu-item.cdx-menu-item--selected,
     background-color: #3c4043 !important; /* Highlight color */
html.skin-theme-clientpref-night body .cdx-typeahead-search__menu .cdx-menu-item:active {
     background-color: #3c4043 !important;  
}
}
Retrieved from "https://wiki.borderconnect.com/index.php?title=MediaWiki:Common.css"