Projet:Charte graphique/Articles/Infoboxes
Pour tester rapidement le code, insérez le code suivant dans votre vector.js ou timeless.js
(méthode non recommandé pour des questions du temps de chargement de la page) :
/* Design pour les infobox v3 */
importStylesheet('User:Tomybrz/infobox.css');
/* Crédits d'auteurs: [[Wikipédia:Atelier graphique/Projet de nouvelle charte graphique/Articles/Infoboxes]] */
Code complet
modifierSi vous voulez avoir un rendu du code immédiatement, insérez ce code sur vector.css ou timeless.css
/* Nouveau style des infobox */
div.infobox_v3 {
padding: 10px;
width: 25em;
background: #ffffff;
clear: right;
float: right;
font-size: 0.9em;
line-height: 1.4;
margin: 1em 1em 0.5em 1em;
max-width: 325px;
word-wrap: break-word;
box-shadow: 0 0 .2rem #999;
border: 0px;
}
.infobox_v3 table {
padding: 0;
margin: 0 0 15px;
}
.infobox_v3 .entete {
padding: 10px;
margin-top:-10px;
margin-bottom:5px;
margin-right:-10px;
margin-left:-10px;
}
.infobox_v3 th[scope="row"], .infobox_v3 td {
padding-left: 2px;
padding-right: 2px;
}
.infobox_v3 .images {
padding:0 !important;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}
.infobox_v3 .images img {
border-top-left-radius: 0px;
border-top-right-radius: 0px;
height: auto;
max-width: 320px;
width: 100%;
}
.infobox_v3 p.legend {
background: #FFF;
color: #54525d;
font-size: 0.9em;
margin: 0;
padding: 3px 6px 12px;
text-align: left;
}
.infobox_v3 p.legend {
background: #FFF;
color:#54525d;
}
.infobox_v3 p.legend a {color:#54525d; text-align: center;}
.infobox_v3 .navbar {display:none;}
.infobox_v3 p.bloc,
.infobox_v3 table caption {background-color:#eaecf0 !important; color: #222 !important;}
/* Crédits d'auteurs: [[Projet:Charte graphique/Articles/Infoboxes]] */
Versions
modifier22 octobre 2018
modifierMise à jour, réorganisation du code.
Maintenances diverses
20 juin 2018
modifierajout de
border:1.5px solid #aaa;
Mise à jour de la page de présentation
Ajout du code rapide
15 septembre 2017
modifierRéintégration du titre de l'infobox, très demandé par la communauté
Mise en avant de l'image et de sa légende
Reprise de la marge interne entre le bord et les titres
Reprise des intertitres de sections et des mises en couleur de ceux-ci pour plus de sobriété
Correction des bugs et des faux positifs
Maintenances diverses
23 mai 2017
modifierPrise en charge uniquement sur les infobox v3
Accentuation de la marge entre le texte et l'infobox
Atténuation de la bordure de l'infobox et création d'un arrondi aux coins
Suppression du titre de l'infobox, redondant avec le texte, afin de mettre en avant l'image
Mise en avant de l'image et de sa légende
Reprise de la marge interne entre le bord et les titres
Reprise des intertitres de sections et des mises en couleur de ceux-ci pour plus de sobriété
Suppression des liens de pied de page (modification, documentation), redondants