diff --git a/modules/rsocials/components/folk-campaign-workflow.ts b/modules/rsocials/components/folk-campaign-workflow.ts index 85da827..69b26a1 100644 --- a/modules/rsocials/components/folk-campaign-workflow.ts +++ b/modules/rsocials/components/folk-campaign-workflow.ts @@ -766,12 +766,20 @@ class FolkCampaignWorkflow extends HTMLElement { }); this.shadow.getElementById('zoom-fit')?.addEventListener('click', () => this.fitView()); - // Canvas mouse wheel + // Canvas wheel: two-finger trackpad = pan, Ctrl+wheel / pinch = zoom canvas.addEventListener('wheel', (e: WheelEvent) => { e.preventDefault(); - const rect = svg.getBoundingClientRect(); - const factor = e.deltaY < 0 ? 1.1 : 0.9; - this.zoomAt(e.clientX - rect.left, e.clientY - rect.top, factor); + if (e.ctrlKey || e.metaKey) { + // Pinch-to-zoom or Ctrl+scroll + const rect = svg.getBoundingClientRect(); + const factor = e.deltaY < 0 ? 1.1 : 0.9; + this.zoomAt(e.clientX - rect.left, e.clientY - rect.top, factor); + } else { + // Two-finger swipe = pan + this.canvasPanX -= e.deltaX; + this.canvasPanY -= e.deltaY; + this.updateCanvasTransform(); + } }, { passive: false }); // Palette drag