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 8152cf5..22f94a0 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 @@ -12,24 +12,15 @@ stroke: white; stroke-width: 0.7; } */ +#sites-map-container circle.circle:hover{ + // fill: #f7002b!important; +} /* Changer la couleur au survol (hover) */ #sites-map-container .site-link:hover{ cursor: pointer; } -#sites-map-container circle.circle { - fill: black !important; - &:hover{ - fill: #f7002b!important; - } - -} -#sites-map-container circle.circle:hover{ - 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 dc1e373..4ed7271 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 @@ -108,6 +108,16 @@ svgElement.addEventListener('mouseover', function(event) { // Afficher le popup avec la position et l'alignement adaptés showPopup(content, circleX, circleY, isLeftHalf); } + + const isCircle = event.target.tagName === 'circle'; + console.log(isCircle); + + if (isCircle === true) { + // Change la couleur en rouge + event.target.setAttribute('fill', 'red'); + } + + // circle.style.fill = 'red'; }); // Fermer le popup lorsque la souris quitte le cercle @@ -115,4 +125,11 @@ svgElement.addEventListener('mouseout', function(event) { if (event.target.classList.contains('site-link')) { closePopup(); } + const isCircle = event.target.tagName === 'circle'; + console.log(isCircle); + + if (isCircle === true) { + // Change la couleur en rouge + event.target.setAttribute('fill', 'black'); + } }); diff --git a/web/modules/custom/q2d_mod/src/Plugin/Block/SitesMap.php b/web/modules/custom/q2d_mod/src/Plugin/Block/SitesMap.php index 92fb071..9f8fc66 100644 --- a/web/modules/custom/q2d_mod/src/Plugin/Block/SitesMap.php +++ b/web/modules/custom/q2d_mod/src/Plugin/Block/SitesMap.php @@ -63,10 +63,11 @@ class SitesMap extends BlockBase { id="site-$index" transform=" translate($x,$y)"> - + style="fill-opacity:1;fill-rule:nonzero;" /> - + SVGSITEPATH; } 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 371cd03..b610818 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 @@ -3077,17 +3077,6 @@ header #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-h cursor: pointer; } -#sites-map-container circle.circle { - fill: black !important; -} -#sites-map-container circle.circle:hover { - fill: #f7002b !important; -} - -#sites-map-container circle.circle:hover { - fill: #f7002b !important; -} - /* Styles du popup (caché par défaut) */ #sites-map-container #popup { font-family: "gilroy-semibold";