Template:Infobox styles.css: Difference between revisions
Increase spacing between location groups (4px → 8px) for better visual separation (via update-page on MediaWiki MCP Server) |
Add .infobox-part class support for part infoboxes (via update-page on MediaWiki MCP Server) |
||
| Line 1: | Line 1: | ||
/* Shared Infobox Styles for EveryCRT Wiki */ | /* Shared Infobox Styles for EveryCRT Wiki */ | ||
/* Supports CRT model, AV device, Accessory, and Document infoboxes */ | /* Supports CRT model, AV device, Accessory, Part, and Document infoboxes */ | ||
/* Includes dark mode via skin-theme-clientpref classes */ | /* Includes dark mode via skin-theme-clientpref classes */ | ||
| Line 7: | Line 7: | ||
.infobox-crt-model, | .infobox-crt-model, | ||
.infobox-av-device, | .infobox-av-device, | ||
.infobox-accessory { | .infobox-accessory, | ||
.infobox-part { | |||
background-color: #ffffff; | background-color: #ffffff; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
| Line 15: | Line 16: | ||
.infobox-crt-model .infobox-title, | .infobox-crt-model .infobox-title, | ||
.infobox-av-device .infobox-title, | .infobox-av-device .infobox-title, | ||
.infobox-accessory .infobox-title { | .infobox-accessory .infobox-title, | ||
.infobox-part .infobox-title { | |||
background-color: #6c5ce7; | background-color: #6c5ce7; | ||
color: #ffffff; | color: #ffffff; | ||
| Line 23: | Line 25: | ||
.infobox-crt-model .infobox-section-header, | .infobox-crt-model .infobox-section-header, | ||
.infobox-av-device .infobox-section-header, | .infobox-av-device .infobox-section-header, | ||
.infobox-accessory .infobox-section-header { | .infobox-accessory .infobox-section-header, | ||
.infobox-part .infobox-section-header { | |||
background-color: #d0d0d5; | background-color: #d0d0d5; | ||
color: #333333; | color: #333333; | ||
| Line 30: | Line 33: | ||
.infobox-crt-model .infobox-label, | .infobox-crt-model .infobox-label, | ||
.infobox-av-device .infobox-label, | .infobox-av-device .infobox-label, | ||
.infobox-accessory .infobox-label { | .infobox-accessory .infobox-label, | ||
.infobox-part .infobox-label { | |||
background-color: #f0f0f5; | background-color: #f0f0f5; | ||
color: #333333; | color: #333333; | ||
| Line 37: | Line 41: | ||
.infobox-crt-model .infobox-value, | .infobox-crt-model .infobox-value, | ||
.infobox-av-device .infobox-value, | .infobox-av-device .infobox-value, | ||
.infobox-accessory .infobox-value { | .infobox-accessory .infobox-value, | ||
.infobox-part .infobox-value { | |||
background-color: #ffffff; | background-color: #ffffff; | ||
color: #333333; | color: #333333; | ||
| Line 44: | Line 49: | ||
.infobox-crt-model .infobox-image, | .infobox-crt-model .infobox-image, | ||
.infobox-av-device .infobox-image, | .infobox-av-device .infobox-image, | ||
.infobox-accessory .infobox-image { | .infobox-accessory .infobox-image, | ||
.infobox-part .infobox-image { | |||
background-color: #ffffff; | background-color: #ffffff; | ||
} | } | ||
| Line 119: | Line 125: | ||
.infobox-crt-model, | .infobox-crt-model, | ||
.infobox-av-device, | .infobox-av-device, | ||
.infobox-accessory { | .infobox-accessory, | ||
.infobox-part { | |||
float: none !important; | float: none !important; | ||
width: 100% !important; | width: 100% !important; | ||
| Line 128: | Line 135: | ||
.infobox-crt-model .infobox-image img, | .infobox-crt-model .infobox-image img, | ||
.infobox-av-device .infobox-image img, | .infobox-av-device .infobox-image img, | ||
.infobox-accessory .infobox-image img { | .infobox-accessory .infobox-image img, | ||
.infobox-part .infobox-image img { | |||
max-width: 100%; | max-width: 100%; | ||
height: auto; | height: auto; | ||
| Line 186: | Line 194: | ||
html.skin-theme-clientpref-night .infobox-crt-model, | html.skin-theme-clientpref-night .infobox-crt-model, | ||
html.skin-theme-clientpref-night .infobox-av-device, | html.skin-theme-clientpref-night .infobox-av-device, | ||
html.skin-theme-clientpref-night .infobox-accessory { | html.skin-theme-clientpref-night .infobox-accessory, | ||
html.skin-theme-clientpref-night .infobox-part { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
border-color: #45475a; | border-color: #45475a; | ||
| Line 193: | Line 202: | ||
html.skin-theme-clientpref-night .infobox-crt-model .infobox-title, | html.skin-theme-clientpref-night .infobox-crt-model .infobox-title, | ||
html.skin-theme-clientpref-night .infobox-av-device .infobox-title, | html.skin-theme-clientpref-night .infobox-av-device .infobox-title, | ||
html.skin-theme-clientpref-night .infobox-accessory .infobox-title { | html.skin-theme-clientpref-night .infobox-accessory .infobox-title, | ||
html.skin-theme-clientpref-night .infobox-part .infobox-title { | |||
background-color: #7c6cf7; | background-color: #7c6cf7; | ||
color: #ffffff; | color: #ffffff; | ||
| Line 200: | Line 210: | ||
html.skin-theme-clientpref-night .infobox-crt-model .infobox-section-header, | html.skin-theme-clientpref-night .infobox-crt-model .infobox-section-header, | ||
html.skin-theme-clientpref-night .infobox-av-device .infobox-section-header, | html.skin-theme-clientpref-night .infobox-av-device .infobox-section-header, | ||
html.skin-theme-clientpref-night .infobox-accessory .infobox-section-header { | html.skin-theme-clientpref-night .infobox-accessory .infobox-section-header, | ||
html.skin-theme-clientpref-night .infobox-part .infobox-section-header { | |||
background-color: #45475a; | background-color: #45475a; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 207: | Line 218: | ||
html.skin-theme-clientpref-night .infobox-crt-model .infobox-label, | html.skin-theme-clientpref-night .infobox-crt-model .infobox-label, | ||
html.skin-theme-clientpref-night .infobox-av-device .infobox-label, | html.skin-theme-clientpref-night .infobox-av-device .infobox-label, | ||
html.skin-theme-clientpref-night .infobox-accessory .infobox-label { | html.skin-theme-clientpref-night .infobox-accessory .infobox-label, | ||
html.skin-theme-clientpref-night .infobox-part .infobox-label { | |||
background-color: #313244; | background-color: #313244; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 214: | Line 226: | ||
html.skin-theme-clientpref-night .infobox-crt-model .infobox-value, | html.skin-theme-clientpref-night .infobox-crt-model .infobox-value, | ||
html.skin-theme-clientpref-night .infobox-av-device .infobox-value, | html.skin-theme-clientpref-night .infobox-av-device .infobox-value, | ||
html.skin-theme-clientpref-night .infobox-accessory .infobox-value { | html.skin-theme-clientpref-night .infobox-accessory .infobox-value, | ||
html.skin-theme-clientpref-night .infobox-part .infobox-value { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 221: | Line 234: | ||
html.skin-theme-clientpref-night .infobox-crt-model .infobox-image, | html.skin-theme-clientpref-night .infobox-crt-model .infobox-image, | ||
html.skin-theme-clientpref-night .infobox-av-device .infobox-image, | html.skin-theme-clientpref-night .infobox-av-device .infobox-image, | ||
html.skin-theme-clientpref-night .infobox-accessory .infobox-image { | html.skin-theme-clientpref-night .infobox-accessory .infobox-image, | ||
html.skin-theme-clientpref-night .infobox-part .infobox-image { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
} | } | ||
| Line 243: | Line 257: | ||
html.skin-theme-clientpref-night .infobox-crt-model a, | html.skin-theme-clientpref-night .infobox-crt-model a, | ||
html.skin-theme-clientpref-night .infobox-av-device a, | html.skin-theme-clientpref-night .infobox-av-device a, | ||
html.skin-theme-clientpref-night .infobox-accessory a { | html.skin-theme-clientpref-night .infobox-accessory a, | ||
html.skin-theme-clientpref-night .infobox-part a { | |||
color: #89b4fa; | color: #89b4fa; | ||
} | } | ||
| Line 249: | Line 264: | ||
html.skin-theme-clientpref-night .infobox-crt-model a:visited, | html.skin-theme-clientpref-night .infobox-crt-model a:visited, | ||
html.skin-theme-clientpref-night .infobox-av-device a:visited, | html.skin-theme-clientpref-night .infobox-av-device a:visited, | ||
html.skin-theme-clientpref-night .infobox-accessory a:visited { | html.skin-theme-clientpref-night .infobox-accessory a:visited, | ||
html.skin-theme-clientpref-night .infobox-part a:visited { | |||
color: #cba6f7; | color: #cba6f7; | ||
} | } | ||
| Line 328: | Line 344: | ||
html.skin-theme-clientpref-os .infobox-crt-model, | html.skin-theme-clientpref-os .infobox-crt-model, | ||
html.skin-theme-clientpref-os .infobox-av-device, | html.skin-theme-clientpref-os .infobox-av-device, | ||
html.skin-theme-clientpref-os .infobox-accessory { | html.skin-theme-clientpref-os .infobox-accessory, | ||
html.skin-theme-clientpref-os .infobox-part { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
border-color: #45475a; | border-color: #45475a; | ||
| Line 335: | Line 352: | ||
html.skin-theme-clientpref-os .infobox-crt-model .infobox-title, | html.skin-theme-clientpref-os .infobox-crt-model .infobox-title, | ||
html.skin-theme-clientpref-os .infobox-av-device .infobox-title, | html.skin-theme-clientpref-os .infobox-av-device .infobox-title, | ||
html.skin-theme-clientpref-os .infobox-accessory .infobox-title { | html.skin-theme-clientpref-os .infobox-accessory .infobox-title, | ||
html.skin-theme-clientpref-os .infobox-part .infobox-title { | |||
background-color: #7c6cf7; | background-color: #7c6cf7; | ||
color: #ffffff; | color: #ffffff; | ||
| Line 342: | Line 360: | ||
html.skin-theme-clientpref-os .infobox-crt-model .infobox-section-header, | html.skin-theme-clientpref-os .infobox-crt-model .infobox-section-header, | ||
html.skin-theme-clientpref-os .infobox-av-device .infobox-section-header, | html.skin-theme-clientpref-os .infobox-av-device .infobox-section-header, | ||
html.skin-theme-clientpref-os .infobox-accessory .infobox-section-header { | html.skin-theme-clientpref-os .infobox-accessory .infobox-section-header, | ||
html.skin-theme-clientpref-os .infobox-part .infobox-section-header { | |||
background-color: #45475a; | background-color: #45475a; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 349: | Line 368: | ||
html.skin-theme-clientpref-os .infobox-crt-model .infobox-label, | html.skin-theme-clientpref-os .infobox-crt-model .infobox-label, | ||
html.skin-theme-clientpref-os .infobox-av-device .infobox-label, | html.skin-theme-clientpref-os .infobox-av-device .infobox-label, | ||
html.skin-theme-clientpref-os .infobox-accessory .infobox-label { | html.skin-theme-clientpref-os .infobox-accessory .infobox-label, | ||
html.skin-theme-clientpref-os .infobox-part .infobox-label { | |||
background-color: #313244; | background-color: #313244; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 356: | Line 376: | ||
html.skin-theme-clientpref-os .infobox-crt-model .infobox-value, | html.skin-theme-clientpref-os .infobox-crt-model .infobox-value, | ||
html.skin-theme-clientpref-os .infobox-av-device .infobox-value, | html.skin-theme-clientpref-os .infobox-av-device .infobox-value, | ||
html.skin-theme-clientpref-os .infobox-accessory .infobox-value { | html.skin-theme-clientpref-os .infobox-accessory .infobox-value, | ||
html.skin-theme-clientpref-os .infobox-part .infobox-value { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
color: #cdd6f4; | color: #cdd6f4; | ||
| Line 363: | Line 384: | ||
html.skin-theme-clientpref-os .infobox-crt-model .infobox-image, | html.skin-theme-clientpref-os .infobox-crt-model .infobox-image, | ||
html.skin-theme-clientpref-os .infobox-av-device .infobox-image, | html.skin-theme-clientpref-os .infobox-av-device .infobox-image, | ||
html.skin-theme-clientpref-os .infobox-accessory .infobox-image { | html.skin-theme-clientpref-os .infobox-accessory .infobox-image, | ||
html.skin-theme-clientpref-os .infobox-part .infobox-image { | |||
background-color: #1e1e2e; | background-color: #1e1e2e; | ||
} | } | ||
| Line 385: | Line 407: | ||
html.skin-theme-clientpref-os .infobox-crt-model a, | html.skin-theme-clientpref-os .infobox-crt-model a, | ||
html.skin-theme-clientpref-os .infobox-av-device a, | html.skin-theme-clientpref-os .infobox-av-device a, | ||
html.skin-theme-clientpref-os .infobox-accessory a { | html.skin-theme-clientpref-os .infobox-accessory a, | ||
html.skin-theme-clientpref-os .infobox-part a { | |||
color: #89b4fa; | color: #89b4fa; | ||
} | } | ||
| Line 391: | Line 414: | ||
html.skin-theme-clientpref-os .infobox-crt-model a:visited, | html.skin-theme-clientpref-os .infobox-crt-model a:visited, | ||
html.skin-theme-clientpref-os .infobox-av-device a:visited, | html.skin-theme-clientpref-os .infobox-av-device a:visited, | ||
html.skin-theme-clientpref-os .infobox-accessory a:visited { | html.skin-theme-clientpref-os .infobox-accessory a:visited, | ||
html.skin-theme-clientpref-os .infobox-part a:visited { | |||
color: #cba6f7; | color: #cba6f7; | ||
} | } | ||
