df
This commit is contained in:
parent
6980c7d058
commit
308e0e33cd
|
|
@ -1413,25 +1413,22 @@ select[class*="selectpicker"],
|
|||
font-family: 'DM Sans', sans-serif; /* Ou votre police SaaS */
|
||||
}
|
||||
|
||||
/* ENTÊTE FIXE "STICKY" */
|
||||
/* --- LE HEADER STICKY (Base Neutral Pro) --- */
|
||||
.header-section {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
/* On descend à 1020 : assez pour survoler la page,
|
||||
mais assez bas pour laisser passer les dropdowns (1050+) */
|
||||
z-index: 1010 !important;
|
||||
background-color: rgba(255, 255, 255, 0.85); /* Un blanc légèrement plus opaque pour la lisibilité */
|
||||
/* On reste à 1000 pour être au-dessus du contenu mais sous les menus système */
|
||||
z-index: 1000 !important;
|
||||
background-color: rgba(255, 255, 255, 0.85);
|
||||
backdrop-filter: blur(10px);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
margin-bottom: 0.15rem !important; /* Un peu plus d'espace pour respirer */
|
||||
border-bottom: 1px solid rgba(0,0,0,0.05); /* Optionnel : une ligne très fine pour marquer la séparation au scroll */
|
||||
padding: 5px 0;
|
||||
margin-bottom: 1rem !important;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.05);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
/* On s'assure que la carte à l'intérieur de la section fixe garde son ombre */
|
||||
.header-section > div {
|
||||
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.08) !important;
|
||||
}
|
||||
|
|
@ -1749,50 +1746,45 @@ select[class*="selectpicker"],
|
|||
}
|
||||
|
||||
/* Force l'alignement de la hauteur du SelectPicker avec les inputs sm */
|
||||
.bootstrap-select .btn.dropdown-toggle {
|
||||
padding-top: 0.25rem !important;
|
||||
padding-bottom: 0.25rem !important;
|
||||
height: 31px !important; /* Hauteur standard du form-control-sm */
|
||||
font-size: 8.5pt !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff !important;
|
||||
border-width: 2px !important;
|
||||
}
|
||||
.bootstrap-select .btn.dropdown-toggle {
|
||||
padding-top: 0.25rem !important;
|
||||
padding-bottom: 0.25rem !important;
|
||||
height: 31px !important; /* Hauteur standard du form-control-sm */
|
||||
font-size: 8.5pt !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff !important;
|
||||
border-width: 2px !important;
|
||||
}
|
||||
|
||||
/* Aligne l'icône de flèche */
|
||||
.bootstrap-select .btn.dropdown-toggle .filter-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
/* Aligne l'icône de flèche */
|
||||
.bootstrap-select .btn.dropdown-toggle .filter-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Corrige la bordure spécifique si vous utilisez border-start-0 */
|
||||
.bootstrap-select.border-2 .btn.dropdown-toggle {
|
||||
border-color: #dee2e6 !important;
|
||||
}
|
||||
/* Corrige la bordure spécifique si vous utilisez border-start-0 */
|
||||
.bootstrap-select.border-2 .btn.dropdown-toggle {
|
||||
border-color: #dee2e6 !important;
|
||||
}
|
||||
|
||||
|
||||
/* On cible le conteneur du calendrier (selon la bibliothèque utilisée) */
|
||||
.datepicker-dropdown,
|
||||
.datepicker.dropdown-menu,
|
||||
.bootstrap-datetimepicker-widget {
|
||||
z-index: 9999 !important; /* On explose le plafond des 1050 */
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
display: block !important; /* Parfois le flou du header cache les éléments en 'absolute' */
|
||||
/* Sécurité supplémentaire : on s'assure que le menu n'est pas coupé */
|
||||
/* --- LE DATEPICKER (Correction Visuelle & Z-Index) --- */
|
||||
.datepicker-dropdown {
|
||||
/* Le secret : un index supérieur au header (1000) */
|
||||
z-index: 2000 !important;
|
||||
position: absolute !important;
|
||||
padding: 10px !important;
|
||||
border: 2px solid #212e53 !important;
|
||||
border-radius: 10px !important;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.datepicker {
|
||||
padding: 10px !important;
|
||||
border: 2px solid #212e53 !important; /* Ta couleur Primary-ghost */
|
||||
border-radius: 10px !important;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
|
||||
}
|
||||
|
||||
/* Style des jours actifs (Couleur de ta charte) */
|
||||
.datepicker table tr td.active {
|
||||
background-color: #212e53 !important; /* Couleur Primary */
|
||||
background-color: #212e53 !important;
|
||||
border-radius: 5px !important;
|
||||
}
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
|
|
@ -57,26 +57,21 @@
|
|||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// On cible l'input de date par son ID
|
||||
var inputDate = document.getElementById('dateEffetBareme');
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
// 1. Initialisation visuelle des SelectPickers
|
||||
actualiserSelectPicker('.selectpicker');
|
||||
|
||||
// 2. Gestion du pré-chargement si le Garant est déjà connu (Session)
|
||||
const codeGarant = $("#codeGcAssureur").val();
|
||||
|
||||
if (inputDate) {
|
||||
// Initialisation (si ton plugin le permet en JS pur)
|
||||
// Sinon, on gère dynamiquement le z-index lors du clic
|
||||
inputDate.addEventListener('focus', function() {
|
||||
// Un court délai pour laisser le plugin créer l'élément DOM du calendrier
|
||||
setTimeout(function() {
|
||||
var picker = document.querySelector('.datepicker-dropdown');
|
||||
if (picker) {
|
||||
// On le déplace à la fin du body pour qu'il ignore le z-index du header
|
||||
document.body.appendChild(picker);
|
||||
picker.style.zIndex = "9999";
|
||||
picker.style.display = "block";
|
||||
picker.style.opacity = "1";
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
if (codeGarant && codeGarant.trim() !== "") {
|
||||
// On déclenche le filtrage des produits immédiatement
|
||||
filtreproduitbareme();
|
||||
|
||||
/** * Optionnel : Si tu veux aussi lancer la recherche des barèmes
|
||||
* automatiquement quand la page s'ouvre avec un garant en session
|
||||
*/
|
||||
setTimeout(() => { afficher_bareme_produit(); }, 500);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
@ -134,14 +134,20 @@
|
|||
<div class="modal fade" id="div_actesgarantiebareme" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false"></div>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
$('.datepicker').datepicker({
|
||||
format: 'dd/mm/yyyy',
|
||||
autoclose: true,
|
||||
container: 'body', // <--- C'est cette ligne qui sauve la mise !
|
||||
orientation: 'bottom auto', // Force l'ouverture vers le bas si possible
|
||||
todayHighlight: true
|
||||
});
|
||||
document.addEventListener('focusin', function (e) {
|
||||
// Si l'élément cliqué est l'input date
|
||||
if (e.target.id === 'dateEffetBareme' || e.target.classList.contains('datepicker')) {
|
||||
setTimeout(function() {
|
||||
var picker = document.querySelector('.datepicker-dropdown');
|
||||
if (picker) {
|
||||
// On déplace le calendrier à la racine du BODY
|
||||
document.body.appendChild(picker);
|
||||
// On s'assure qu'il est visible et au premier plan
|
||||
picker.style.zIndex = "99999";
|
||||
picker.style.display = "block";
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user