MediaWiki:Common.css: Difference between revisions
CaptainChris (talk | contribs) No edit summary |
CaptainChris (talk | contribs) No edit summary |
||
| Line 133: | Line 133: | ||
} | } | ||
/* [[Template:Infobox]], [[Template:Infobox row]] */ | |||
.infobox { | .infobox { | ||
position: relative; | |||
clear: right; | |||
margin: 0 0 1em 1em; | |||
width: 300px; | |||
font-size: 90%; | |||
background: #ffffff; | |||
float: right; | |||
border: 1px solid #b8d4f1; /* soft blue border */ | |||
padding: 2px; | |||
overflow: auto; | |||
box-shadow: 0 1px 3px rgba(0, 50, 100, 0.1); | |||
border-radius: 4px; | |||
} | |||
@media all and (max-width: 511px) { | |||
.infobox { | |||
float: none; | |||
margin-left: 0; | |||
width: auto; | |||
} | |||
} | |||
@media all and (max-width: 337px) { | |||
.infobox { | |||
margin-left: -16px; | |||
margin-right: -16px; | |||
border-left: none; | |||
border-right: none; | |||
} | |||
} | } | ||
.infobox-title { | .infobox-title { | ||
background: #3b82f6; /* bright medium blue */ | |||
color: #ffffff; | |||
padding-top: 8px; | |||
padding-bottom: 8px; | |||
border-radius: 2px 2px 0 0; | |||
} | |||
.infobox > .infobox-title { | |||
font-weight: bold; | |||
text-align: center; | |||
font-size: 120%; | |||
border: none; | |||
} | |||
.infobox th + td > ul { | |||
list-style: none; | |||
margin-left: unset; | |||
} | |||
.infobox-imagearea { | |||
text-align: center; | |||
padding: 4px; | |||
} | |||
.infobox-imagearea > div:not(:first-child) { | |||
padding-top: 1em; | |||
} | } | ||
.infobox- | /* horizontally center animated images */ | ||
.mw-body-content .infobox-imagearea .animated { | |||
display: inline-flex; | |||
align-items: center; | |||
} | } | ||
.infobox- | /* infobox gallery tweaks */ | ||
.infobox- | .infobox-imagearea li.gallerybox div.thumb { | ||
background: none; | |||
border: none; | |||
margin: 0; | |||
} | |||
.infobox-imagearea ul.gallery, | |||
.infobox-imagearea li.gallerybox, | |||
.infobox-imagearea li.gallerybox div.thumb > div { | |||
margin: 0 !important; | |||
} | |||
.infobox-imagearea li.gallerybox div.gallerytext { | |||
font-weight: bold; | |||
font-size: 100%; | |||
padding: 0; | |||
} | } | ||
.infobox- | /* infobox tabber */ | ||
.infobox-imagearea .tabber .tabbertab, | |||
.infobox-imagearea ul.tabbernav li a, | |||
.infobox-imagearea ul.tabbernav li.tabberactive a { | |||
background: none; | |||
border: none; | |||
} | } | ||
.infobox- | .infobox-imagearea ul.tabbernav { | ||
font: inherit; | |||
font-size: 100%; | |||
} | |||
.infobox-imagearea ul.tabbernav li a:hover, | |||
.infobox-imagearea ul.tabbernav li.tabberactive a:hover { | |||
color: #0d47a1; /* deep blue hover */ | |||
} | |||
.infobox-imagearea ul.tabbernav > li { | |||
margin-bottom: 5px; | |||
padding: 0; | |||
} | |||
.infobox-imagearea ul.tabbernav > li > a { | |||
color: #2763c4; /* standard blue tab text */ | |||
padding-bottom: 1px; | |||
display: block; | |||
} | |||
/* prevent tab text jump */ | |||
.infobox-imagearea ul.tabbernav > li > a::before { | |||
display: block; | |||
content: attr(alt); | |||
font-weight: bold; | |||
height: 0; | |||
color: transparent; | |||
overflow: hidden; | |||
visibility: hidden; | |||
} | |||
.infobox-imagearea ul.tabbernav > li.tabberactive { | |||
border: none; | |||
} | |||
.infobox-imagearea ul.tabbernav > li.tabberactive > a { | |||
font-weight: bold; | |||
border-bottom: 2px solid #3b82f6; /* blue active underline */ | |||
color: #1e40af; /* darker blue active text */ | |||
} | |||
.infobox .infobox-rows { | |||
display: table; | |||
margin: 0 !important; | |||
width: 100% !important; | |||
border-collapse: separate; | |||
border-spacing: 1px; | |||
} | |||
.infobox .infobox-rows { | |||
border-collapse: collapse !important; | |||
} | |||
.infobox-rows tr:nth-child(2n) { | |||
background-color: #f0f7ff; /* light blue alternating rows */ | |||
} | |||
.infobox-rows > tbody > tr > th { | |||
text-align: left; | |||
white-space: nowrap; | |||
color: #0d47a1; | |||
} | |||
.mw-body-content .infobox-rows p { | |||
margin: 0; | |||
} | |||
/* merge adjacent dls */ | |||
.infobox-rows dl + dl { | |||
margin-top: -0.4em; | |||
} | |||
.infobox-rows dl:last-child { | |||
margin-bottom: 0.2em; | |||
} | } | ||
.infobox- | .infobox-footer { | ||
text-align: center; | |||
color: #0d47a1; | |||
background: #e8f2ff; | |||
border-top: 1px solid #b8d4f1; | |||
padding: 4px; | |||
font-style: italic; | |||
} | } | ||
. | /* hide debug JSON */ | ||
.history-json { | |||
display: none; | |||
} | } | ||