Basculer le menu
Changer de menu des préférences
Basculer le menu personnel
Non connecté(e)
Votre adresse IP sera visible au public si vous faites des modifications.

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

De Nefald
Agrado (discussion | contributions)
Annulation des modifications 4243 de Agrado (discussion)
Balises : Annulation Révoqué
Agrado (discussion | contributions)
Aucun résumé des modifications
Balise : Révoqué
Ligne 1 : Ligne 1 :
/* =========================================================
/* =========================================================
   MiniCardv2/styles.css — version compatible TemplateStyles
   MiniCardv2/styles.css — 1 seule ligne (no wrap) + scroll
   - Grille harmonisée responsive
  - Toujours sur UNE ligne, quel que soit le nombre de tuiles
   - Hauteur uniforme réglable
  - Pleine largeur
   - Scroll horizontal si ça dépasse
   - Compatible TemplateStyles
   ========================================================= */
   ========================================================= */


/* Conteneur : grille responsive */
.minicardv2-container{
.minicardv2-container{
   display:grid;
   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;


   /* Colonnes harmonisées, responsive */
   overflow-x:auto;            /* ✅ scroll si trop de tuiles */
   grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
   overflow-y:hidden;
  align-items:stretch;


   background:transparent;
   background:transparent;
Ligne 22 : Ligne 24 :
}
}


/* ✅ Réglage hauteur : modifie ici */
/* Chaque bouton ButtonLink */
.minicardv2-container > .button-link{
.minicardv2-container > .button-link{
   width:100% !important;
   flex:1 0 170px;             /* base 170px, ne wrap pas */
 
   width:auto;
  height:56px !important;       /* <- change 56 -> 72 / 80 */
   box-sizing:border-box;
   min-height:56px !important;
 
   box-sizing:border-box !important;
}
}


/* Le lien interne remplit la tuile et se centre */
/* Le lien interne remplit le bouton */
.minicardv2-container > .button-link > .button-link__link{
.minicardv2-container > .button-link > .button-link__link{
   height:100% !important;
   height:100%;
  min-height:100% !important;
   display:flex;
 
   align-items:center;
   display:flex !important;
   justify-content:center;
   align-items:center !important;
   box-sizing:border-box;
   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 */
/* Icônes : évite qu'une icône trop grande force la mise en page */
.minicardv2-container > .button-link > .button-link__link img{
.minicardv2-container img{
   max-height:70% !important;
   max-height:70%;
   width:auto !important;
   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;
}
Les témoins (''cookies'') nous aident à fournir nos services. En utilisant nos services, vous acceptez notre utilisation de témoins.