« Modèle:ButtonGrid/styles.css » : différence entre les versions
De Nefald
Autres actions
Annulation des modifications 4243 de Agrado (discussion) Balises : Annulation Révoqué |
Aucun résumé des modifications Balise : Révoqué |
||
| Ligne 1 : | Ligne 1 : | ||
/* ========================================================= | /* ========================================================= | ||
MiniCardv2/styles.css — | MiniCardv2/styles.css — 1 seule ligne (no wrap) + scroll | ||
- | - Toujours sur UNE ligne, quel que soit le nombre de tuiles | ||
- | - Pleine largeur | ||
- Scroll horizontal si ça dépasse | |||
- Compatible TemplateStyles | |||
========================================================= */ | ========================================================= */ | ||
.minicardv2-container{ | .minicardv2-container{ | ||
display: | display:flex; | ||
flex-wrap:nowrap; /* ✅ interdit le retour à la ligne */ | |||
align-items:stretch; | |||
gap:.9rem; | gap:.9rem; | ||
| Ligne 14 : | Ligne 17 : | ||
box-sizing:border-box; | box-sizing:border-box; | ||
/* | overflow-x:auto; /* ✅ scroll si trop de tuiles */ | ||
overflow-y:hidden; | |||
background:transparent; | background:transparent; | ||
| Ligne 22 : | Ligne 24 : | ||
} | } | ||
/* | /* Chaque bouton ButtonLink */ | ||
.minicardv2-container > .button-link{ | .minicardv2-container > .button-link{ | ||
flex:1 0 170px; /* base 170px, ne wrap pas */ | |||
width:auto; | |||
box-sizing:border-box; | |||
box-sizing:border-box | |||
} | } | ||
/* Le lien interne remplit | /* Le lien interne remplit le bouton */ | ||
.minicardv2-container > .button-link > .button-link__link{ | .minicardv2-container > .button-link > .button-link__link{ | ||
height:100% | height:100%; | ||
display:flex; | |||
align-items:center; | |||
display:flex | justify-content:center; | ||
align-items:center | box-sizing:border-box; | ||
justify-content:center | |||
box-sizing:border-box | |||
} | } | ||
/* | /* Icônes : évite qu'une icône trop grande force la mise en page */ | ||
.minicardv2-container | .minicardv2-container img{ | ||
max-height:70% | max-height:70%; | ||
width:auto | width:auto; | ||
} | } | ||
Version du 4 février 2026 à 20:19
/* =========================================================
MiniCardv2/styles.css — 1 seule ligne (no wrap) + scroll
- Toujours sur UNE ligne, quel que soit le nombre de tuiles
- Pleine largeur
- Scroll horizontal si ça dépasse
- Compatible TemplateStyles
========================================================= */
.minicardv2-container{
display:flex;
flex-wrap:nowrap; /* ✅ interdit le retour à la ligne */
align-items:stretch;
gap:.9rem;
width:100%;
padding:.4rem 0;
box-sizing:border-box;
overflow-x:auto; /* ✅ scroll si trop de tuiles */
overflow-y:hidden;
background:transparent;
border:0;
}
/* Chaque bouton ButtonLink */
.minicardv2-container > .button-link{
flex:1 0 170px; /* base 170px, ne wrap pas */
width:auto;
box-sizing:border-box;
}
/* Le lien interne remplit le bouton */
.minicardv2-container > .button-link > .button-link__link{
height:100%;
display:flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
}
/* Icônes : évite qu'une icône trop grande force la mise en page */
.minicardv2-container img{
max-height:70%;
width:auto;
}