« Modèle:ButtonGrid/styles.css » : différence entre les versions

Navigation interactive dans l’historique

Dernière version du 4 février 2026 à 21:10

.ButtonGrid-container{
  display:grid;
  gap:.9rem;

  width:100%;
  padding:.4rem 0;
  box-sizing:border-box;

  /* Colonnes harmonisées, responsive */
  grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
  align-items:stretch;
}

/* Chaque bouton remplit sa cellule */
.ButtonGrid-container > .button-link{
  width:100%;
}

/* Le lien interne remplit la hauteur du bouton */
.ButtonGrid-container > .button-link .button-link__link{
  height:100%;
}

@@ Ligne 1 : / Ligne 1 : @@
-/* =========================================================
+.ButtonGrid-container{
-   MiniCardv2/styles.css — version compatible TemplateStyles
-   - Grille harmonisée responsive
-   - Hauteur uniforme réglable
-   ========================================================= */
-/* Conteneur : grille responsive */
-.minicardv2-container{
    display:grid;
    gap:.9rem;
@@ Ligne 15 : / Ligne 8 : @@
    /* Colonnes harmonisées, responsive */
-   grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
+   grid-template-columns:repeat(auto-fit, minmax(190px, 1fr));
    align-items:stretch;
-  background:transparent;
-  border:0;
 }
-/* ✅ Réglage hauteur : modifie ici */
+/* Chaque bouton remplit sa cellule */
-.minicardv2-container > .button-link{
+.ButtonGrid-container > .button-link{
-   width:100% !important;
+   width:100%;
-  height:56px !important;        /* <- change 56 -> 72 / 80 */
-  min-height:56px !important;
-  box-sizing:border-box !important;
-}
-/* Le lien interne remplit la tuile et se centre */
-.minicardv2-container > .button-link > .button-link__link{
-  height:100% !important;
-  min-height:100% !important;
-  display:flex !important;
-  align-items:center !important;
-  justify-content:center !important;
-  /* Si ButtonLink ajoute du padding, ça empêche de réduire la hauteur */
-  padding-top:0 !important;
-  padding-bottom:0 !important;
-  box-sizing:border-box !important;
-}
-/* Texte : évite que line-height/marges forcent la hauteur */
-.minicardv2-container > .button-link > .button-link__link .button-link__text{
-  margin:0 !important;
-  line-height:1.1 !important;
 }
-/* Icône : évite qu’une image trop grande force la hauteur */
+/* Le lien interne remplit la hauteur du bouton */
-.minicardv2-container > .button-link > .button-link__link img{
+.ButtonGrid-container > .button-link .button-link__link{
-   max-height:70% !important;
+   height:100%;
-  width:auto !important;
 }