From f595af581ac15572f984366b9197688b65b72ead Mon Sep 17 00:00:00 2001
From: IliesAllali <97601122+IliesAllali@users.noreply.github.com>
Date: Thu, 29 Oct 2026 14:35:38 +0100
Subject: [PATCH] =?UTF-8?q?T=C3=A9l=C3=A9phone=20:=20plus=20de=20r=C3=A9gl?=
 =?UTF-8?q?ette=20de=20zoom,=20la=20loupe=20seule=20reste=20(on=20zoome=20?=
 =?UTF-8?q?=C3=A0=20deux=20doigts)=20(#199)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

La notification n'a plus à se décaler pour l'éviter.

Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
---
 frontend/src/components/SettingsPanels.css |  5 -----
 frontend/src/components/ZoomControl.css    | 12 ------------
 frontend/src/components/ZoomControl.jsx    |  5 +++--
 3 files changed, 3 insertions(+), 19 deletions(-)

diff --git a/frontend/src/components/SettingsPanels.css b/frontend/src/components/SettingsPanels.css
index d35635f..7afe13b 100644
--- a/frontend/src/components/SettingsPanels.css
+++ b/frontend/src/components/SettingsPanels.css
@@ -293,11 +293,6 @@
 .undo-toast-btn:hover { background: color-mix(in srgb, var(--pz-bg) 26%, transparent); }
 .undo-toast-btn:focus-visible { outline: 2px solid var(--pz-bg); outline-offset: 2px; }
 @media (max-width: 768px) { .contrib-success-toast { bottom: 78px; padding: 11px 16px; border-radius: 16px; font-size: 13px; } }
-/* Sous 768 px, la réglette de zoom reste ouverte en bas à gauche (ZoomControl.css, de 8 à 60 px du bord) :
-   tant qu'elle se voit (ni panneau ni fiche par-dessus), la notification commence après elle au lieu de passer dessus */
-@media (max-width: 768px) {
-  body:not(:has(.pz-overlay, .person-card)) .contrib-success-toast { left: 72px; right: 12px; width: auto; max-width: none; transform: none; }
-}
 
 @media (max-width: 560px) {
   .contrib-invite-link { flex-wrap: wrap; border-radius: var(--pz-r-m); padding: 10px; }
diff --git a/frontend/src/components/ZoomControl.css b/frontend/src/components/ZoomControl.css
index 8d03433..f136884 100644
--- a/frontend/src/components/ZoomControl.css
+++ b/frontend/src/components/ZoomControl.css
@@ -185,16 +185,4 @@
     width: 44px;
     height: 44px;
   }
-
-  /* Slider toujours visible sur mobile */
-  .zoom-slider-panel.visible {
-    max-height: 240px;
-    opacity: 1;
-    transform: translateX(-50%) translateY(0) scale(1);
-    pointer-events: auto;
-  }
-
-  .zoom-slider-track {
-    cursor: pointer;
-  }
 }
diff --git a/frontend/src/components/ZoomControl.jsx b/frontend/src/components/ZoomControl.jsx
index ad81326..9ffb449 100644
--- a/frontend/src/components/ZoomControl.jsx
+++ b/frontend/src/components/ZoomControl.jsx
@@ -104,7 +104,8 @@ export default function ZoomControl({ zoomApiRef }) {
     document.addEventListener('pointerup', onUp)
   }, [zoomApiRef])
 
-  const panelVisible = isHovered || isMobile
+  // Sur téléphone, on zoome à deux doigts : la réglette n'apparaît jamais, la loupe seule reste
+  const panelVisible = isHovered && !isMobile
 
   return (
     <div
@@ -112,7 +113,7 @@ export default function ZoomControl({ zoomApiRef }) {
       onMouseEnter={showSlider}
       onMouseLeave={hideSlider}
     >
-      {/* Panel slider — hover sur desktop, toujours visible sur mobile */}
+      {/* Panel slider — au survol sur ordinateur, jamais sur téléphone */}
       <div
         className={`zoom-slider-panel ${panelVisible ? 'visible' : ''}`}
         onMouseEnter={showSlider}