|
|
| Line 256: |
Line 256: |
| /* Infoboxes */ | | /* Infoboxes */ |
| .infobox { | | .infobox { |
| border: 1px solid var(--border-color-base, #a2a9b1); | | border: 1px solid #a2a9b1; |
| color: var(--color-base, #202122);
| | color: black; |
| background-color: var(--background-color-neutral-subtle, #f8f9fa); | |
| padding: 0.2em; | | padding: 0.2em; |
| font-size: 88%; | | font-size: 88%; |
| Line 266: |
Line 265: |
| } | | } |
|
| |
|
| /* Ensure nothing inside forces black text */
| | @media screen { |
| .infobox * {
| | .infobox { |
| color: inherit; | | background-color: var(--background-color-neutral-subtle, #f8f9fa); |
| }
| | } |
| | |
| /* Links inside infobox follow theme colors */
| |
| .infobox a:link, | |
| .infobox a:visited {
| |
| color: var(--color-progressive, #36c);
| |
| } | |
| | |
| .infobox a.new:link,
| |
| .infobox a.new:visited {
| |
| color: var(--color-destructive, #d33);
| |
| } | | } |
|
| |
|
| Line 424: |
Line 413: |
| } | | } |
|
| |
|
| /* Hide maintenance / tracking categories */
| |
| .mw-hidden-cats {
| |
| display: none;
| |
| }
| |
|
| |
| /* Override inline hard-coded header backgrounds in infoboxes */
| |
| .infobox td.infobox-above,
| |
| .infobox th.infobox-above,
| |
| .infobox td.infobox-title,
| |
| .infobox th.infobox-title,
| |
| .infobox caption,
| |
| .infobox th[colspan] {
| |
| background: var(--background-color-progressive-subtle, #eaf3ff) !important;
| |
| color: var(--color-base, #202122) !important;
| |
| }
| |
|
| |
| /* Ensure ALL infobox cells remain readable */
| |
| .infobox td,
| |
| .infobox th {
| |
| color: var(--color-base, #202122) !important;
| |
| border-color: var(--border-color-base, #a2a9b1);
| |
| }
| |
| /* | | /* |
| * Put anything you mean to be a sitewide addition above the TemplateStyles | | * Put anything you mean to be a sitewide addition above the TemplateStyles |
| * comment above. | | * comment above. |
| */ | | */ |
| /* Dark mode fixes for navboxes and similar boxes */
| |
| @media screen {
| |
| /* User-selected Dark mode */
| |
| html.skin-theme-clientpref-night .navbox,
| |
| html.skin-theme-clientpref-night .navbox-subgroup,
| |
| html.skin-theme-clientpref-night .navbox th,
| |
| html.skin-theme-clientpref-night .navbox td {
| |
| background-color: #1e1e1e !important; /* dark main body */
| |
| color: #d0d0d0 !important;
| |
| border-color: #444 !important;
| |
| }
| |
|
| |
| /* Match infobox header color but darkened for dark mode (titles, above/below rows) */
| |
| html.skin-theme-clientpref-night .navbox-title,
| |
| html.skin-theme-clientpref-night .navbox-abovebelow,
| |
| html.skin-theme-clientpref-night .navbox th[scope="col"], /* column headers */
| |
| html.skin-theme-clientpref-night .navbox .navbox-title, /* nested titles */
| |
| html.skin-theme-clientpref-night .navbox .navbox-group { /* left-side group labels, often "side ones" */
| |
| background-color: #1B223D !important; /* darkened blue-gray variant of #eaf3ff */
| |
| color: #e0f0ff !important; /* very light blue-white text for contrast */
| |
| border-color: #3a506b !important; /* subtle border to match */
| |
| }
| |
|
| |
| /* If your navbox uses .navbox-group for left-side labels, this targets them specifically */
| |
| html.skin-theme-clientpref-night .navbox .navbox-group {
| |
| background-color: #1B223D !important;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| /* Alternating rows stay dark */
| |
| html.skin-theme-clientpref-night .navbox-odd,
| |
| html.skin-theme-clientpref-night .navbox-even {
| |
| background-color: #252525 !important;
| |
| }
| |
|
| |
| /* Links inside navbox */
| |
| html.skin-theme-clientpref-night .navbox a:not(.new):not(.mw-selflink) {
| |
| color: #88ccff !important;
| |
| }
| |
|
| |
| /* For Automatic/OS dark preference */
| |
| @media (prefers-color-scheme: dark) {
| |
| html.skin-theme-clientpref-os .navbox,
| |
| html.skin-theme-clientpref-os .navbox-subgroup,
| |
| html.skin-theme-clientpref-os .navbox th,
| |
| html.skin-theme-clientpref-os .navbox td {
| |
| background-color: #1e1e1e !important;
| |
| color: #d0d0d0 !important;
| |
| border-color: #444 !important;
| |
| }
| |
| html.skin-theme-clientpref-os .navbox-title,
| |
| html.skin-theme-clientpref-os .navbox-abovebelow,
| |
| html.skin-theme-clientpref-os .navbox th[scope="col"],
| |
| html.skin-theme-clientpref-os .navbox .navbox-title,
| |
| html.skin-theme-clientpref-os .navbox .navbox-group {
| |
| background-color: #1B223D !important;
| |
| color: #e0f0ff !important;
| |
| border-color: #3a506b !important;
| |
| }
| |
| html.skin-theme-clientpref-os .navbox .navbox-group {
| |
| background-color: #1B223D !important;
| |
| }
| |
| html.skin-theme-clientpref-os .navbox-odd,
| |
| html.skin-theme-clientpref-os .navbox-even {
| |
| background-color: #252525 !important;
| |
| }
| |
| }
| |
| }
| |