Aller au contenu

Légendes Pokémon : Z-A approche !

Nous vous rappelons que seules les informations publiées officiellement seront acceptées sur le wiki jusqu'à la sortie du jeu, le 16 octobre.
Tout ajout issu de leak ou jeu obtenu avant l'heure sera supprimé. Merci de votre compréhension, et bonne navigation sur Poképédia !

MediaWiki:Common.css

De Poképédia

Note : après avoir publié vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

  • Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
  • Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
  •  Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
/** Le CSS placé ici sera appliqué à toutes les apparences hors version mobile. Voir [[MediaWiki:Mobile.css]] pour modifier les styles de la version mobile. */

/********** CLASSES STANDARDS POUR LES TABLEAUX (FICHEINFO, NAVIVATION ET BADGE COMPRIS) **********/

/* reset de la classe wikitable du skin vector */
table.wikitable > tr > th, table.wikitable > tr > td,
table.wikitable > * > tr > th, table.wikitable > * > tr > td {
    border: inherit;
    padding: inherit;
}
table.wikitable > tr > th,
table.wikitable > * > tr > th {
    background-color: #cfe4f2;
    padding: 3px;
    text-align: center;
}

/* bugfixes du skin par défaut vector 2022 */
.mw-header {
    display: flex;
    flex-wrap:nowrap;
    align-items:center;
    column-gap:0px;
    min-width: 1px;
}

.vector-feature-zebra-design-enabled .vector-header {
    display:grid;
    column-gap:24px;
}

.vector-body-before-content {
    display: none;
}

.mw-body p {
	margin: 0.5em 0 0.5em 0
}
.mw-body p + ul,
.mw-body p + ol,
.mw-body p + table,
.mw-body p + dl,
.mw-body p + blockquote {
	margin-top: 0;
}
  
/* Tableaux selon la charte graphique. Ils sont centrés par défaut. */
table.tableaustandard, table.wikitable {
    max-width: 75%;
    margin: 1em auto 1em auto;
    border: 1px solid #aaa;
    border-collapse: separate;
    border-radius: 8px;
    background-color: #e4f0f7;
    padding: 3px;
    color: black;
}
table.tableaustandard th, table.tableaustandard td, table.wikitable th, table.wikitable td {
    border-radius: 3px;
    vertical-align: middle;
}
table.tableaustandard th, table.wikitable th {
    background-color: #cfe4f2;
    padding: 5px;
    text-align: center;
}
table.tableaustandard td, table.wikitable td {
    background-color: #fcfcfc;
    padding: 5px;
}
table.tableaustandard caption, table.wikitable caption {
    margin-left: inherit;
    margin-right: inherit;
    font-weight: bold;
}

li.gallerybox div.thumb {
    border-radius: 8px;
    border: 1px solid #aaa;
}

/* Parfois, on veut tout centrer */
table.centre td {
    text-align: center;
}

/* Pour les fiches d'information (infoboxes), utiliser la classe ficheinfo en plus de tableaustandard */
table.ficheinfo {
    float: right;
    width: 30%;
    max-width: 30%;
    margin-left: 1em;
    clear: right;
    margin: 0.5em auto 1em 1em;
}
table.ficheinfo th.entêtesection {
    text-align: center;
}
table.ficheinfo th {
    text-align: right;
}
table.ficheinfo td.illustration {
    background-color: #ffffff;
    text-align: center;
}
table.ficheinfo td.précision {
    background-color: #eef6fa;
    text-align: center;
    font-size: 0.9em;
}

/* Pour les tableaux de navigation (bas d'articles), utiliser la classe navigation en plus de tableaustandard */
table.navigation {
    clear: both;
    max-width: 75%;
}
table.navigation caption {
    font-size: 1.1em;
    font-weight: bold;
}
table.navigation td {
    text-align: center;
    font-size: 0.9em;
}

/* Pour les badges (boîtes) utilisateur et projets, utiliser la classe badge en plus de tableaustandard */
table.badge {
    width: 16rem;
    max-width: 16rem;
    margin-right: auto;
    margin-left: 0;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
    padding: 0;
    height: 4rem;
    font-size: 0.9em;
}
table.badge th {
    width: 4rem;
    border-radius: 6px;
}
table.badge td {
    border-radius: 6px;
}

/* Pour obtenir des tableaux dont la ligne d'entête reste fixe à l'écran malgré le défilement */
table.entetefixe {
    position: relative;
}
table.entetefixe thead, table.entetefixe tbody th {
    position: sticky;
    top: 0;
}
table.tableaustandard.pokeliste td, table.tableaustandard.listeobjets td {
    text-align:left;
    vertical-align:top;
    white-space:nowrap;
}

table.tableaustandard.listedesobjets td:nth-child(1),
table.tableaustandard.listedesobjets .résistance,
table.tableaustandard.listedesobjets .faiblesse,
table.tableaustandard.listedesobjets .standard,
table.tableaustandard.listedesobjets .immunité {
    text-align:center;
}

table.tableaustandard.listedesobjets td:nth-child(2),
table.tableaustandard.listedesobjets td:nth-child(4),
table.tableaustandard.listedesobjets td:nth-child(5),
table.tableaustandard.listedesobjets td:nth-child(6) {
    white-space:nowrap;
}

table.ruban {
    border-radius: 8px;
    width: 100%;
    border: 1px solid #aaa;
    background: #f8f9fa;
}

table.ruban th {
    border-radius: 6px;
    background: #cfe4f2;
    font-size: 80%;
    padding: 0;
}

table.ruban-pokemon td, table.ruban td {
    background: #f8f9fa;
    padding: 0.5em 0;
}

/********** BANDEAUX **********/
ul.bandeau {
    list-style-type: none;
    list-style-image: none;
    margin: 1em auto;
    width: 66%;
    padding: 4px;
    border: 4px double #b22222;
    border-radius: 8px;
}
ul.bandeau li {
    display:flex;
    align-items: center;
    justify-content: center;
    margin: 1px auto;
    border-radius: 3px;
    background: #eaf4fd;
    text-align: center;
    padding: 0.5em;
}
ul.bandeau li > span {
    margin-left: 1em;
}

table.bandeau {
    border-radius: 8px;
    border: 1px solid #aaa;
    width: 60%;
	margin: 5px auto;
	text-align: center;
    background-color: #EAF4FD;
    padding: 3px;
}
table.bandeau th {
	background: transparent;
	width: 80px;
    border-radius: 3px;
    padding: 5px;
}
table.bandeau td {
    border-radius: 3px;
    text-align: left;
    vertical-align: middle;
    background-color: #fcfcfc;
    padding: 5px;
    font-size: 85%;
}

div.bandeau {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: fit-content(100%) auto;
    grid-template-rows: repeat(1, 1fr);
    gap: 5px;
    align-items: stretch; 
    width: 80%;
    max-width: 800px;
    margin: 5px auto;
    padding: 5px;
    border: 1px solid #aaa;
    border-radius: 8px;
}

div.bandeau-icone {
    text-align: center;
    align-self: center;
    min-width: 64px;
}

div.bandeau-message {
    align-content: center;
    padding: 5px;
    border-radius: 3px;
    font-size: 85%;
}

div.bandeau-message > p {
    margin: 0.5em 0 0.5em 0;
}

/********** PORTAILS **********/

/* Pour faire des lignes et des colonnes, sans tableaux */
.bloc-ligne {
    display:flex;
    align-items: stretch;
    justify-content: space-between;
}
.bloc-colonne {
    display:flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
}
.bloc-liste {
    display: flex;
    flex-wrap: wrap;
}

/* Général */
.portail-bloc {
    border:2px solid #b9cce4;
    margin-bottom: 0.5em;
    padding: 0.8em;
    border-radius: 8px;
}
#portail-partieprincipale .portail-miseenavant:last-of-type, #portail-miseenavantsecondaire .portail-bloc:last-of-type, #portail-categories .portail-bloccatégories:last-of-type {
    position:relative;
}
.lien-modification {
    position:absolute;
    right: 0;
    bottom: 0;
    font-size: small;
}
.lien-modification a.external { /* classe plainlinks */
    background: transparent none repeat scroll 0% 0% !important;
    padding: 0px !important;
}

/* Section Présentation */
#portail-presentation {
    text-align: center;
    flex-wrap: wrap;
    align-items: center;
}
#portail-introduction {
    flex-grow: 1;
    flex-basis: 18rem;
}
#portail-exploration {
    flex-grow: 1;
    flex-basis: 9rem;
    font-variant: small-caps;
    margin: auto auto;
}
#portail-illustration {
    align-self: flex-start;
    background: white;
    width: 120px;
    border-radius: 100px;
    border: solid 4px #b9cce4;
    padding: 6px;
    margin: 1em;
}

/* Section Contributions */
#portail-contributions {
    text-align: center;
    padding: 0.1em 0.1em;
    flex-wrap: wrap;
}
#portail-contributions > div {
    background-color:#eaf4fd;
    margin: 0.1em;
    flex-grow: 1;
    line-height:2rem;
}
#portail-contributions > div:first-child {
    flex-grow: 1.3;
}

#portail-licence {
	display:flex;
	flex-wrap: wrap;
	text-align: center;
	justify-content: space-evenly;
	align-content: stretch;
	height: 100%;
	width: 100%;
	padding: .5em;
	gap: .5em;
	box-sizing: border-box
}

#portail-licence > div {
	padding: 5px;
	min-width:150px;
	flex-grow: 1;
	display:flex;
	gap: .5em;
	flex-direction:column;
	background-color: #eaf4fd;
	border: 2px solid #b9cce4;
	border-radius: 8px;
}

#portail-licence > div > div:nth-child(1) {
	flex-grow:1;
	align-content:center
}

#portail-licence > div > div:nth-child(2) {
	flex-grow:.5;
}

/* Section Mises en avant */
.portail-miseenavant {
    width: 50%;
    text-align: center;
}
#portail-partieprincipale > div:first-child {
    flex-grow: 1;
}
.portail-miseenavant:first-of-type {
    border-right: 2px dotted #DDDDF7;
}
.portail-miseenavant h3 {
    margin-top: 1em;
}
.portail-miseenavant h3:first-of-type {
    margin-top: 2em;
}
#portail-miseenavantsecondaire {
    width: 20rem;
    text-align: center;
    margin-left: 0.5em;
}
#portail-miseenavantsecondaire > .portail-bloc {
    flex-grow: 1;
    background: #eaf4fd;
}

.accueil-partieprincipale {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 0.5em
}

.portail-liensutiles {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 5px;
	justify-items: center;
	align-items: start;
}

.conteneur-tuiles-imagées {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 1.5em;
	align-items: stretch;
	max-height: 300px;
	overflow-y: scroll;
}
.tuile-imagée > div:nth-child(1) img {
  height: 80px;
  width: 80px;
  object-fit: cover;
  border: solid 2px #b9cce4;
  border-radius: 50%;
}
.tuile-imagée div:nth-child(2) {
	padding: 0 5px;
	background-color: #eaf4fd;
	border: 2px solid #b9cce4;
	border-radius: 6px;
	align-content: center
}
.tuile-imagée-annonce > div:nth-child(1) img {
  border-color: #FFEA7B;
}
.tuile-imagée-annonce div:nth-child(2) {
  border-color: #FFEA7B;
  background-color: #FFFDF7;
}

/* Pour la version mobile */
@media all and (max-width: 1600px) {
	.conteneur-tuiles-imagées {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

@media all and (max-width: 1250px) {
	.conteneur-tuiles-imagées {
		grid-template-columns: 1fr 1fr;
	}
}

@media all and (max-width: 800px) {
	.accueil-partieprincipale {
		grid-template-columns: 1fr;
	}
	
	.conteneur-tuiles-imagées {
		grid-template-columns: 1fr;
		max-height: 600px;
	}
}

@media all and (max-width: 700px) {
	.portail-liensutiles {
		grid-template-columns: 1fr 1fr;
	}
}

/* Section Catégories */
.portail-bloccatégories {
    flex-grow: 1;
    flex-basis: 18rem;
    height: 5em;
    background: #eaf4fd;
    margin: 0.1em;
    padding: 0.8em;
    display: flex;
    justify-content: space-between;
    border-radius: 5px;
}
.portail-bloccatégories > div {
    margin-left: 1em;
    flex-grow: 1;
}
.portail-bloccatégories > div.floatleft {
    max-width: 55px;
}
#portail-categories {
    padding: 0.1em 0.1em;
}

/********** AUTRES DÉFINITIONS DE STYLES **********/

/* Bloc de citation */
blockquote {
  border-width:1px 0px; 
  border-style:dotted;
  border-color:#b9cce4;
  background-color: #f3f7fa;
  font-style:italic;
  padding-left:1em;
  padding-right:1em;
}

/* Avancement */
.avancementFaible, .avancementUrgent {
  background: #ff0000;
  background:-moz-linear-gradient(0deg, #FED0BF, #ff0000); 
  background:-webkit-gradient(linear, left top, right top, from(#FED0BF), to(#ff0000));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#FED0BF', endColorstr='#ff0000');
}
.avancementMoyen {
  background: #FFA500;
  background:-moz-linear-gradient(0deg, #FEE9BF, #FFA500); 
  background:-webkit-gradient(linear, left top, right top, from(#FEE9BF), to(#FFA500));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#FEE9BF', endColorstr='#FFA500');
}
.avancementImportant {
  background: #18c621;
  background:-moz-linear-gradient(0deg, #D4FEE7, #18c621); 
  background:-webkit-gradient(linear, left top, right top, from(#D4FEE7), to(#18c621));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#D4FEE7', endColorstr='#18c621');
}

/* Boutons afficher-masquer */
button[value=afficher], button[value=masquer] {
  display: none;
  border: none;
  background: none;
  color: #0645ad;;
}
button[value=afficher]:hover, button[value=masquer]:hover {
  text-decoration: underline;
}
button[value=afficher]:active, button[value=masquer]:active {
  color: #faa700;
}

/* Changement de la génération affichée pour certaines sections (Localisations des Pokémon, par exemple).
La première classe place correctement les liens, la deuxième affiche l'affiche de la/des génération(s) affichée(s) */
.permuter {
  position: relative;
  z-index: 10;
  margin-top: -3em;
  margin-bottom: -.5em;
}
.affichage-actuel {
  font-size: 1.8em;
  font-weight: normal;
}

/* Ancres à côté des titres de section. @license http://krinkle.mit-license.org/ @author Timo Tijhof, 2013–2014 */
.mw-header {
    /* core sets this to fix editsection link bunching, but they no longer float
     * and we need this so that the anchors are visible */
    overflow: visible;
}
.mw-headline-headanchor {
    padding-left: 17px;
    margin-left: -17px;
    background-size: 14px 12px;
    background-repeat: no-repeat;
    background-position: 0 50%;
}
.mw-headline-headanchor,
.mw-headline-headanchor:hover,
.mw-headline-headanchor:visited {
    color: inherit;
    text-decoration: none;
}
.mw-headline-headanchor:focus {
    outline: 0;
}
.mw-header:hover .mw-headline-headanchor,
.mw-headline-headanchor:target {
    background-image: url('/images/c/c6/Ic%C3%B4ne_lien.png');
}

/* Animations de capacité */
.run-animation {
  cursor: pointer;    
}

/* Sensibilités Pokémon - coloration des remarques */
table.sensibilite li:target { background-color: #ddeeff; }

/* Sensibilités Pokémon - taille des div colorés montrant l'efficacité */
.sensibilite .ligne-efficacités > td > div {
    width: 62px;
    height: 22px;
    border-radius: 3px;
    margin: auto;
}

/* Bandeau en haut des modif récentes */
.mw-recentchanges-toplinks > span {
    display: none;
}
.mw-recentchanges-toplinks > div {
    display: block !important;
}

/* Troncature des liens manquants dans les imageries (et uniquement là) */
.liensrougesreduits a.new::before {
    content: "(?)";
    width: 30px;
    display: inline-block;
    vertical-align: baseline;
}
.liensrougesreduits a.new {
    width: 30px;
    overflow: hidden;
    display: inline-block;
    vertical-align: baseline;
    white-space: nowrap;
}

/* Limite de taille pour les images, utilisée sur le [[Modèle:Cellule Pokémon]] */
.maxheight100px img {
    max-height: 100px;
    width: auto;
}

/********** CORRECTIONS CSS LÉGÈRES À DES STYLES EXISTANTS **********/

/* Références, notamment la coloration en bleu après avoir cliqué sur une référence */
.references { font-size: 85%; }
ol.references li:target { background-color: #ddeeff; }
sup.reference:target { background-color: #ddeeff; }

/* Pour cacher le titre de la page d'accueil (seul cas autorisé) */
body.action-view.page-Portail_Accueil #firstHeading {
    position: absolute;
    top: -5000px;
}

/* Style du bouton pour enrouler les tableaux (notamment) */
.mw-collapsible-toggle {
  font-weight: normal;
}

/* Pour les petits écrans, l'habillage Monobook fait en sorte que les images suivent la taille de l'élément parent.
   Cela ne convient pas pour les sprites de Modèle:TableauDresseurHaut d'où la règle suivante pour annuler. */
@media screen and (max-width:550px) {
    body.skin--responsive .monobook-body .maxheight100px img {
        max-width: unset !important;
    }
}

/* Style des cartes qui grossissent au survol dans les listes de cartes */
.survol-carte {
    transition: all .2s;
    z-index: 1;
    overflow: visible;
    position: relative;
}

.survol-carte:hover {
    filter: drop-shadow(rgba(0,0,0,0.8) 0 0 4px);
    transform: scale(1.2);
    z-index: 2;
    position:relative
}

/* Taille des cartes standard dans les galeries de cartes */
.width175 img {
    width: 175px;
    height: auto;
}
.width245 img {
    width: 245px;
    height: auto;
}

.height175 img {
    height: 175px;
    width: auto;
}
.height245 img {
    height: 245px;
    width: auto;
}

/********** STYLES DONT L'UTILISATION DOIT ÊTRE PRÉCISÉE *********/

/* terme défini */
dfn {
  font-style: normal;
  font-weight: bold;
}
i dfn {
  font-style: italic;
}

.maxwidth250px img {
    max-width: 250px;
    height: auto;
}

.maxwidth300px img {
    max-width: 300px;
    height: auto;
}

.miniature-type-2 {
    max-height:30px;
    max-width:60px;
    height:auto;
    width:auto;
    min-width:30px;
}

.type img {
    width: 80px;
    height: auto;
}
.catégorie img {
    width: 40px;
    height: auto;
}

.miniature img,
.miniature_PDMDX img,
.miniature_Q img,
.miniature_DEPS img,
.miniature_LPA img,
.miniature_EV img,
.miniature_LPZA img,
.miniature_HOME img,
.miniature_Sleep img {
    max-height: 52px;
    width: auto;
}

.miniature_objet img,
.miniature_objet_EB img,
.miniature_objet_DEPS img,
.miniature_objet_LPA img,
.miniature_objet_EV img,
.miniature_objet_LPZA img {
    max-height: 32px;
    width: auto;
}

.miniature_objet_RB img,
.miniature_objet_J img,
.miniature_objet_OA img,
.miniature_objet_C img,
.miniature_objet_RS img,
.miniature_objet_RFVF img,
.miniature_objet_E img,
.miniature_objet_DP img,
.miniature_objet_Pt img,
.miniature_objet_HGSS img,
.miniature_objet_NB img,
.miniature_objet_N2B2 img,
.miniature_objet_XY img,
.miniature_objet_ROSA img {
    height: 32px;
    width: auto;
    object-position: center center;
    object-fit: none;
}

.fit24px img {
    max-height: 24px;
    width: auto;
    object-position: center center;
    object-fit: none;
}

.fit28px img {
    max-height: 28px;
    width: auto;
    object-position: center center;
    object-fit: none;
}

.redimensionner_35px img {
    max-width: 35px;
    max-height: 35px;
    width: auto;
    height: auto;
}

.upscale_64px img {
	height: 64px;
	width: auto;
	image-rendering: pixelated
}

.explain {
  text-decoration: underline dotted;
  cursor: help;
}

.premiere-maj a {
    display: inline-block;
    vertical-align: baseline;
}
.premiere-maj a::first-letter {
    text-transform: uppercase;
}

/* essai : affichage différent sur mobile et sur version bureau */
tr.masquerbureau, th.masquerbureau {
    display: none;
}

/* Bugfix de vector2022 et affichage des tables en pleine page pour les petits écrans */
/* à mettre à la fin pour override les autres max-width de tableaustandard */

@media all and (max-width: 639px) {
	
	.mw-parser-output table {
	    display: table;
	    overflow: auto;
	    max-width: 100%
	}
	
	.mw-parser-output .noresize table {
	    display: table
	}
	
	table.ficheinfo, .bandeau {
		width:100% !important;
	}
	
	.vector-dropdown-label-text {
		display:none;
	}
}

/* groumph */
#mw-indicator-smw-entity-examiner, .mw-indicator {
  display:none;
}