MediaWiki:Common.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* === Infobox (light theme default) === */ | /* ===== Infobox (light theme default) ===== */ | ||
table.infobox { | table.infobox{ | ||
border: 1px solid #a2a9b1; | width:270px; /* fixed like enwiki */ | ||
background: #f8f9fa; | max-width:270px; | ||
color: inherit; | box-sizing:border-box; /* include border in the 270px */ | ||
font-size: 90%; | float:right; clear:right; | ||
line-height: 1. | margin:0 0 1em 1em; | ||
border-collapse: collapse | border:1px solid #a2a9b1; | ||
background:#f8f9fa; | |||
color:inherit; | |||
font-size:90%; | |||
line-height:1.5em; /* enwiki-ish line height */ | |||
border-collapse:collapse; | |||
} | } | ||
table.infobox th, table.infobox td { padding: . | table.infobox th, table.infobox td{ | ||
table.infobox th { text-align: left; } | padding:.2em .4em; /* enwiki padding */ | ||
vertical-align:top; | |||
} | |||
table.infobox th{ text-align:left; } | |||
table.infobox th.infobox-title{ | |||
/* title styling (light mode); center + 125% */ | |||
text-align:center; | |||
font-size:125%; | |||
font-weight:bold; | |||
background:var(--ib-title-bg, #cfe3a3); /* uses |color= if set */ | |||
} | |||
/* Wrap very long strings/URLs so width stays 270px */ | |||
table.infobox td{ overflow-wrap:anywhere; word-break:break-word; } | |||
/* | /* ===== Dark theme via skin toggle ===== */ | ||
table.infobox | html.skin-theme-clientpref-night table.infobox{ | ||
background:#202124; border-color:#5f6368; color:#e8eaed; | |||
} | } | ||
html.skin-theme-clientpref-night table.infobox th{ | |||
background:#2a2b2e; color:#e8eaed; | |||
html.skin-theme-clientpref-night table.infobox { | |||
background: # | |||
} | } | ||
html.skin-theme-clientpref-night table.infobox th.infobox-title{ | |||
html.skin-theme-clientpref-night table.infobox th.infobox-title { | background:#323f2b; color:#e8eaed; /* ignore |color= in dark */ | ||
background: #323f2b; | |||
} | } | ||
/* Optional: link colors inside infobox in dark | /* Optional: link colors inside infobox in dark */ | ||
html.skin-theme-clientpref-night table.infobox a { color: #8ab4f8; } | html.skin-theme-clientpref-night table.infobox a{ color:#8ab4f8; } | ||
html.skin-theme-clientpref-night table.infobox a:visited { color: #c58af9; } | html.skin-theme-clientpref-night table.infobox a:visited{ color:#c58af9; } | ||
/* phone styles */ | |||
@media (max-width:600px){ table.infobox{ width:100%; max-width:none; float:none; margin:0 0 1em 0; } } | |||
Revision as of 22:23, 1 October 2025
/* ===== Infobox (light theme default) ===== */
table.infobox{
width:270px; /* fixed like enwiki */
max-width:270px;
box-sizing:border-box; /* include border in the 270px */
float:right; clear:right;
margin:0 0 1em 1em;
border:1px solid #a2a9b1;
background:#f8f9fa;
color:inherit;
font-size:90%;
line-height:1.5em; /* enwiki-ish line height */
border-collapse:collapse;
}
table.infobox th, table.infobox td{
padding:.2em .4em; /* enwiki padding */
vertical-align:top;
}
table.infobox th{ text-align:left; }
table.infobox th.infobox-title{
/* title styling (light mode); center + 125% */
text-align:center;
font-size:125%;
font-weight:bold;
background:var(--ib-title-bg, #cfe3a3); /* uses |color= if set */
}
/* Wrap very long strings/URLs so width stays 270px */
table.infobox td{ overflow-wrap:anywhere; word-break:break-word; }
/* ===== Dark theme via skin toggle ===== */
html.skin-theme-clientpref-night table.infobox{
background:#202124; border-color:#5f6368; color:#e8eaed;
}
html.skin-theme-clientpref-night table.infobox th{
background:#2a2b2e; color:#e8eaed;
}
html.skin-theme-clientpref-night table.infobox th.infobox-title{
background:#323f2b; color:#e8eaed; /* ignore |color= in dark */
}
/* Optional: link colors inside infobox in dark */
html.skin-theme-clientpref-night table.infobox a{ color:#8ab4f8; }
html.skin-theme-clientpref-night table.infobox a:visited{ color:#c58af9; }
/* phone styles */
@media (max-width:600px){ table.infobox{ width:100%; max-width:none; float:none; margin:0 0 1em 0; } }