Modèl:Infobox/Style.css
Apparence
.globegris {
background-image: url("/media/wikipedia/commons/1/10/Wikipedia-logo-v2-200px-transparent.png");
background-repeat: no-repeat;
background-position: -40px -15px;
}
/* Infobox V2 (voir : [[Projet:Infobox/V2]]) */
.infobox_v2 {
background-color: var(--background-color-neutral-subtle, #f8f9fa);
color: var(--color-emphasized, #000);
font-size: 90%;
line-height: 1.2em;
float: right;
clear: right;
margin: 0 0 0.5em 1em;
width: 294px;
border: 1px solid var(--border-color-base, #a2a9b1);
border-spacing: 5px;
}
.infobox_v2 th {
vertical-align: super;
text-align: left;
}
.infobox_v2 .entete {
height: 43px;
vertical-align: middle;
text-align: center;
font-size: 140%;
font-weight: bolder;
line-height: 1.1em;
color: var(--color-emphasized, #000);
}
/* Padding si pictogramme d'infobox, e.g. ".entete.foobar"
Pas de pictogramme donc pas de padding sur ".entete.defaut" et ".entete"
Possibilité de désactiver ce padding en ajoutant une classe "large" */
.infobox_v2 .entete:not(.defaut):not([class="entete"]):not(.large) {
padding: 1px 48px;
}
/* Pour [[Modèle:Image et son]], etc. */
.infobox_v2 .media {
height: 35px;
vertical-align: middle;
text-align: center;
font-weight: bolder;
color: var(--color-emphasized, #000);
}
/* Graphiques transparents d'en-têtes des Infobox */
.entete {
background-position: right center;
background-repeat: no-repeat;
}
.media.audio {
background: url("/media/wikipedia/commons/thumb/a/a6/Gnome-speakernotes.png/35px-Gnome-speakernotes.png") no-repeat left top;
}
.media.video {
background: url("/media/wikipedia/commons/thumb/2/20/Tango-video-x-generic.png/35px-Tango-video-x-generic.png") no-repeat left top;
}
/* Pour le [[modèle:Infobox/Géolocalisation multiple]] et le [[modèle:Géolocdual]]. */
.img_toggle ul {
list-style: none;
text-align: center;
}
/* Infobox V3 */
div.infobox_v3 {
padding: 5px;
width: 25em;
background: var(--background-color-neutral-subtle, #f8f9fa);
border: 1px solid var(--border-color-base, #a2a9b1);
clear: right;
float: right;
font-size: 0.9em;
line-height: 1.4;
margin: 0 0 0.5em 1em;
max-width: 325px;
word-wrap: break-word;
}
.infobox_v3 .entete {
display: table;
height: 45px;
width: 100%;
font-weight: bold;
text-align: center;
font-size: 1.4em;
line-height: 1.1;
margin-bottom: 10px;
background-color: #dfedff;
}
.infobox_v3 .entete > div {
display: table-cell;
vertical-align: middle;
padding: 3px;
}
.infobox_v3:not(.large) .entete.icon > div {
padding: 3px 48px;
}
/* Images */
.infobox_v3 .images {
text-align: center;
display: flex;
justify-content: space-around;
align-items: center;
}
.infobox_v3 .images a {
max-width: 100%;
flex: 0 0 auto; /* be kind ie11 */
}
.infobox_v3 .deux-images a {
max-width: 48%;
}
.infobox_v3 .images img {
max-width: 100%;
height: auto;
}
.infobox_v3 .legend {
font-size: 0.9em;
text-align: center;
margin: 5px 0 8px 0;
}
/* Tableaux */
.infobox_v3 table {
width: 100%;
margin: 5px 0;
table-layout: fixed;
border-collapse: collapse;
}
.infobox_v3 th[scope="col"] {
text-align: center;
word-wrap: normal;
}
.infobox_v3 th[scope=row] {
text-align: left;
/* @noflip */
padding-right: 10px;
width: 8em;
max-width: 140px;
word-wrap: normal;
}
.infobox_v3 th[scope=row],
.infobox_v3 td {
padding-top: 4px;
vertical-align: super;
}
.infobox_v3 th[scope=row].middle {
vertical-align: middle;
}
.infobox_v3.bordered th[scope=row],
.infobox_v3.bordered td {
padding-bottom: 4px;
border-top: 1px solid #dfedff;
}
.infobox_v3.bordered caption.bordered {
margin: 0 0 -1px 0;
}
.infobox_v3 tr.left td {
text-align: left;
}
.infobox_v3 tr.vborder td {
border-left: 1px dotted var(--border-color-base, #a2a9b1);
}
.infobox_v3 tr.vborder td:first-child {
border-left: none;
}
.infobox_v3 td.data {
text-align: center;
}
.infobox_v3 tr:first-child ul:first-child {
margin-top: 0;
}
/* Titres bloc et caption tableaux */
.infobox_v3 p.bloc,
.infobox_v3 caption {
font-weight: bold;
text-align: center;
line-height: 1.1;
margin: 0 0 5px 0;
padding: 4px;
background: #dfedff;
}
.infobox_v3 p.bloc {
margin: 5px 0;
}
.infobox_v3 caption.bordered,
.infobox_v3 p.bordered {
border-top: 1px solid #dfedff;
border-bottom: 1px solid #dfedff;
background: transparent;
}
.infobox_v3 .bordered.navbar,
.infobox_v3 .bordered.infobox-navigateur {
padding-top: 4px;
border-bottom: 0;
}
/* TODO : mettre à jour la classe .hidden générique */
.infobox_v3 caption.hidden {
margin: 0 !important;
padding: 0 !important;
}
/* Séparateur */
.infobox_v3 .hr {
font-size: 1px;
line-height: 1px;
margin: 5px 0;
background-color: #dfedff;
}
.infobox_v3 .hr.collapse {
margin: 5px 0 -8px 0;
}
/* Tnavbar */
.infobox_v3 .navbar {
text-align: right;
font-size: 0.8em;
line-height: 1.1;
margin: 8px 0 0;
}
.infobox_v3 .navbar .plainlinks {
float: left;
}
/* Navigateur */
.infobox_v3 .overflow {
overflow: hidden;
}
.infobox_v3 .prev a,
.infobox_v3 .prev_bloc {
background: url("/media/wikipedia/commons/thumb/4/49/ArrowLeftNavbox.svg/12px-ArrowLeftNavbox.svg.png") no-repeat left center;
float: left;
max-width: 40%;
padding: 0 0 0 18px;
text-align: left;
}
.infobox_v3 .next a,
.infobox_v3 .next_bloc {
background: url("/media/wikipedia/commons/thumb/1/10/ArrowRightNavbox.svg/12px-ArrowRightNavbox.svg.png") no-repeat right center;
float: right;
max-width: 40%;
padding: 0 18px 0 0;
text-align: right;
}