diff --git a/web/modules/custom/q2d_mod/assets/css/carte-interactive-qdd.scss b/web/modules/custom/q2d_mod/assets/css/carte-interactive-qdd.scss index fe8f272..ac722cf 100644 --- a/web/modules/custom/q2d_mod/assets/css/carte-interactive-qdd.scss +++ b/web/modules/custom/q2d_mod/assets/css/carte-interactive-qdd.scss @@ -16,14 +16,11 @@ /* Changer la couleur au survol (hover) */ #sites-map-container .site-link:hover{ cursor: pointer; - fill: #f7002b!important; - } -// #sites-map-container circle:hover { -// cursor: pointer; -// fill: #f7002b!important; -// } +#sites-map-container circle.circle { + fill: #f7002b!important; +} /* Styles du popup (caché par défaut) */ #sites-map-container #popup { diff --git a/web/modules/custom/q2d_mod/assets/js/carte-interactive-qdd.js b/web/modules/custom/q2d_mod/assets/js/carte-interactive-qdd.js index 550fe3d..968481a 100644 --- a/web/modules/custom/q2d_mod/assets/js/carte-interactive-qdd.js +++ b/web/modules/custom/q2d_mod/assets/js/carte-interactive-qdd.js @@ -23,21 +23,17 @@ function showPopup(content, x, y, isLeftHalf) { if (isLeftHalf) { console.log('Le point est dans la moitié gauche'); // Si le point est dans la moitié gauche, aligner le côté droit du popup avec le point - popupX = rect.left + x - popupWidth - 10; // Décalage à gauche + popupX = rect.left + x - popupWidth - 20; // Décalage à gauche popupContent.style.textAlign = 'right'; // Alignement du texte à droite } else { console.log('Le point est dans la moitié droite'); // Si le point est dans la moitié droite, afficher le popup à droite du point - popupX = rect.left + x + 10; // Décalage à droite + popupX = rect.left + x + 100; // Décalage à droite popupContent.style.textAlign = 'left'; // Alignement du texte à gauche } - // Centrer verticalement le popup par rapport au point - popupY = rect.top + y - (popupHeight / 2); // Centrage vertical - - // Ajustement pour éviter que le popup soit trop bas - // On peut ajouter un décalage supplémentaire vers le haut pour compenser - popupY -= 300; // Ajuster vers le haut si nécessaire + // Calculer la position Y (décalée légèrement en hauteur) + popupY = rect.top + y - 0; // Ajustement vertical avec un léger offset // Empêcher le popup de dépasser les bords gauche et droite de l'écran const viewportWidth = window.innerWidth; @@ -77,10 +73,6 @@ function showPopup(content, x, y, isLeftHalf) { } - - - - // Recalculer la position du popup lors du redimensionnement de la fenêtre window.addEventListener('resize', function() { if (popup.style.display === 'block') { diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css index 47f4271..2e99cca 100644 --- a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css +++ b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css @@ -3075,6 +3075,9 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h /* Changer la couleur au survol (hover) */ #sites-map-container .site-link:hover { cursor: pointer; +} + +#sites-map-container circle.circle { fill: #f7002b !important; }