Template:Infobox official post/styles.css: Difference between revisions

Add dark mode infobox styles
 
Remove infobox label wrapping overrides
Tag: Manual revert
 
(2 intermediate revisions by the same user not shown)
Line 46: Line 46:
body.skin-theme-clientpref-night .infobox {
body.skin-theme-clientpref-night .infobox {
background-color: #1e1e1e;
background-color: #1e1e1e;
color: #d0d0d0;
color: #ffffff;
border-color: #444;
border-color: #444;
}
}
Line 61: Line 61:
body.skin-theme-clientpref-night .infobox .infobox-full-data {
body.skin-theme-clientpref-night .infobox .infobox-full-data {
background-color: #1e1e1e;
background-color: #1e1e1e;
color: #d0d0d0;
color: #ffffff;
border-color: #444;
border-color: #444;
}
}
Line 96: Line 96:
body.skin-theme-clientpref-os .infobox {
body.skin-theme-clientpref-os .infobox {
background-color: #1e1e1e;
background-color: #1e1e1e;
color: #d0d0d0;
color: #ffffff;
border-color: #444;
border-color: #444;
}
}
Line 111: Line 111:
body.skin-theme-clientpref-os .infobox .infobox-full-data {
body.skin-theme-clientpref-os .infobox .infobox-full-data {
background-color: #1e1e1e;
background-color: #1e1e1e;
color: #d0d0d0;
color: #ffffff;
border-color: #444;
border-color: #444;
}
}
Line 139: Line 139:
body.skin-theme-clientpref-os .infobox a:visited {
body.skin-theme-clientpref-os .infobox a:visited {
color: #88ccff;
color: #88ccff;
}
}
/* Dark-mode color correction for VU infoboxes. */
@media screen {
html.skin-theme-clientpref-night .infobox,
body.skin-theme-clientpref-night .infobox,
html.skin-theme-clientpref-night .infobox th,
html.skin-theme-clientpref-night .infobox td,
html.skin-theme-clientpref-night .infobox .infobox-label,
html.skin-theme-clientpref-night .infobox .infobox-data,
html.skin-theme-clientpref-night .infobox .infobox-full-data,
body.skin-theme-clientpref-night .infobox th,
body.skin-theme-clientpref-night .infobox td,
body.skin-theme-clientpref-night .infobox .infobox-label,
body.skin-theme-clientpref-night .infobox .infobox-data,
body.skin-theme-clientpref-night .infobox .infobox-full-data {
color: #ffffff;
}
html.skin-theme-clientpref-night .infobox .infobox-above,
html.skin-theme-clientpref-night .infobox .infobox-title,
html.skin-theme-clientpref-night .infobox .infobox-header,
html.skin-theme-clientpref-night .infobox .infobox-subheader,
html.skin-theme-clientpref-night .infobox .infobox-below,
body.skin-theme-clientpref-night .infobox .infobox-above,
body.skin-theme-clientpref-night .infobox .infobox-title,
body.skin-theme-clientpref-night .infobox .infobox-header,
body.skin-theme-clientpref-night .infobox .infobox-subheader,
body.skin-theme-clientpref-night .infobox .infobox-below {
color: #e0f0ff !important;
}
html.skin-theme-clientpref-night .infobox a:link,
html.skin-theme-clientpref-night .infobox a:visited,
body.skin-theme-clientpref-night .infobox a:link,
body.skin-theme-clientpref-night .infobox a:visited {
color: #88ccff;
}
html.skin-theme-clientpref-night .infobox a.new:link,
html.skin-theme-clientpref-night .infobox a.new:visited,
body.skin-theme-clientpref-night .infobox a.new:link,
body.skin-theme-clientpref-night .infobox a.new:visited {
color: #ff6b6b;
}
}
@media screen and (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .infobox,
body.skin-theme-clientpref-os .infobox,
html.skin-theme-clientpref-os .infobox th,
html.skin-theme-clientpref-os .infobox td,
html.skin-theme-clientpref-os .infobox .infobox-label,
html.skin-theme-clientpref-os .infobox .infobox-data,
html.skin-theme-clientpref-os .infobox .infobox-full-data,
body.skin-theme-clientpref-os .infobox th,
body.skin-theme-clientpref-os .infobox td,
body.skin-theme-clientpref-os .infobox .infobox-label,
body.skin-theme-clientpref-os .infobox .infobox-data,
body.skin-theme-clientpref-os .infobox .infobox-full-data {
color: #ffffff;
}
html.skin-theme-clientpref-os .infobox .infobox-above,
html.skin-theme-clientpref-os .infobox .infobox-title,
html.skin-theme-clientpref-os .infobox .infobox-header,
html.skin-theme-clientpref-os .infobox .infobox-subheader,
html.skin-theme-clientpref-os .infobox .infobox-below,
body.skin-theme-clientpref-os .infobox .infobox-above,
body.skin-theme-clientpref-os .infobox .infobox-title,
body.skin-theme-clientpref-os .infobox .infobox-header,
body.skin-theme-clientpref-os .infobox .infobox-subheader,
body.skin-theme-clientpref-os .infobox .infobox-below {
color: #e0f0ff !important;
}
html.skin-theme-clientpref-os .infobox a:link,
html.skin-theme-clientpref-os .infobox a:visited,
body.skin-theme-clientpref-os .infobox a:link,
body.skin-theme-clientpref-os .infobox a:visited {
color: #88ccff;
}
html.skin-theme-clientpref-os .infobox a.new:link,
html.skin-theme-clientpref-os .infobox a.new:visited,
body.skin-theme-clientpref-os .infobox a.new:link,
body.skin-theme-clientpref-os .infobox a.new:visited {
color: #ff6b6b;
}
}
}
}