This commit is contained in:
2026-02-26 15:17:21 +00:00
parent 71f51f2554
commit 93f5cbf1db
2 changed files with 35 additions and 46 deletions

View File

@@ -1229,25 +1229,25 @@ h6 a:hover {
.bg-primary-ghost { background: rgba(33, 46, 83, 0.05); }
/* ============================================================
FIX BOOTSTRAP-SELECT (SELECTPICKER) - VERSION SÉCURISÉE
BOOTSTRAP-SELECT : CORRECTIF FINAL SANS LARGEUR FORCÉE
============================================================ */
/* 1. DISPARITION RADICALE DU SELECT NATIF (Empêche le doublon)
On cible toutes les variantes possibles pour être sûr */
/* 1. DISPARITION TOTALE DU SELECT NATIF
On utilise opacity et position pour le rendre invisible sans casser
le fonctionnement du plugin, tout en évitant le doublon visuel. */
select.selectpicker,
select[class*="selectpicker"],
.bootstrap-select > select.bs-select-hidden,
select.bs-select-hidden {
.bootstrap-select > select.bs-select-hidden {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
height: 0 !important;
width: 0 !important;
position: absolute !important;
pointer-events: none !important;
z-index: -1 !important;
}
/* 2. STYLE DU BOUTON (Apparence form-control) */
/* 2. STYLE DU BOUTON (L'interface visible)
On retire le "width: 100%" pour laisser le bouton s'adapter à son contenu
ou à sa colonne parente naturelle. */
.btn-form-select {
background-color: #ffffff !important;
border: 1px solid #e2e8f0 !important;
@@ -1255,40 +1255,37 @@ select.bs-select-hidden {
font-size: 0.82rem !important;
padding: 0.5rem 0.75rem !important;
border-radius: var(--radius-sm) !important;
width: 100% !important;
display: flex !important;
display: inline-flex !important; /* Permet au bouton de ne pas prendre toute la largeur */
align-items: center;
justify-content: space-between;
min-width: 200px; /* Optionnel : définit une largeur minimale raisonnable */
}
/* 3. LE MENU DÉROULANT (Correction largeur) */
.bootstrap-select.dropdown {
width: 100% !important;
display: block !important;
/* 3. NETTOYAGE DE L'ÉLÉMENT INTERNE (Ce que vous avez vu à l'image)
On s'assure qu'il n'y a pas de background ou de bordure parasite */
.bootstrap-select .filter-option {
display: flex;
align-items: center;
}
.filter-option-inner-inner {
background-color: transparent !important;
padding: 0 !important;
color: inherit !important;
}
/* 4. LE MENU DÉROULANT
On le laisse s'adapter à la largeur du bouton parent */
.bootstrap-select .dropdown-menu {
min-width: 100% !important;
max-width: 100% !important;
border: 1px solid #e2e8f0;
box-shadow: var(--shadow-lg);
z-index: 9999 !important;
}
/* 4. ZONE DE RECHERCHE */
.bootstrap-select .bs-searchbox {
padding: 8px 10px !important;
background-color: #f8f9fa;
border-radius: var(--radius-md);
font-size: 0.82rem;
}
/* 5. ZONE DE RECHERCHE */
.bootstrap-select .bs-searchbox .form-control {
border: 1px solid #ced4da !important;
font-size: 0.8rem !important;
width: 100% !important;
}
/* 5. ÉVITER LE CONFLIT BOOTSTRAP 5 (Le secret est ici) */
/* On annule les styles de form-select si jamais la classe a été ajoutée par erreur */
select.selectpicker.form-select {
background-image: none !important;
background-color: #fff !important;
}