|
|
| (22 versions intermédiaires par le même utilisateur non affichées) |
| Ligne 1 : |
Ligne 1 : |
| /* Conteneur : en ligne, responsive */
| | .ButtonGrid-container{ |
| .minicardv2-container{ | | display:grid; |
| display:flex; | | gap:.9rem; |
| align-items:center; | | |
| gap:.6rem; | | width:100%; |
| padding:.4rem 0; | | padding:.4rem 0; |
| | box-sizing:border-box; |
|
| |
|
| /* OPTION A (recommandée) : 1 seule ligne + scroll horizontal si trop long */ | | /* Colonnes harmonisées, responsive */ |
| flex-wrap:nowrap; | | grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); |
| overflow-x:auto;
| | align-items:stretch; |
| | |
| /* OPTION B (alternative) : autoriser le retour à la ligne sur petits écrans */
| |
| /* flex-wrap:wrap; */
| |
| /* overflow-x:visible; */
| |
| }
| |
| | |
| /* Important : certains skins mettent les liens externes en block/100%,
| |
| on force le comportement "tuile" */
| |
| .minicardv2-container a.external{
| |
| display:inline-flex !important;
| |
| align-items:center;
| |
| gap:.5rem;
| |
| | |
| width:auto !important;
| |
| max-width:100%;
| |
| | |
| padding:.55rem .8rem;
| |
| border-radius:12px;
| |
| | |
| font-weight:600;
| |
| text-decoration:none;
| |
| white-space:nowrap;
| |
| | |
| background:#111;
| |
| color:#fff;
| |
| | |
| transition:transform .08s ease, filter .08s ease;
| |
| }
| |
| | |
| .minicardv2-container a.external:hover{
| |
| transform:translateY(-1px);
| |
| filter:brightness(1.05); | |
| }
| |
| | |
| .minicardv2-container a.external:active{
| |
| transform:translateY(0);
| |
| } | | } |
|
| |
|
| /* Icône */ | | /* Chaque bouton remplit sa cellule */ |
| .minicardv2-container a.external img{ | | .ButtonGrid-container > .button-link{ |
| width:18px; | | width:100%; |
| height:18px;
| |
| } | | } |
|
| |
|
| /* Optionnel : enlever l’icône "lien externe" ajoutée par MediaWiki (la petite flèche) */ | | /* Le lien interne remplit la hauteur du bouton */ |
| .minicardv2-container a.external::after{ | | .ButtonGrid-container > .button-link .button-link__link{ |
| display:none !important; | | height:100%; |
| } | | } |
