From 19d323868065274059625568e182e60fceee48a4 Mon Sep 17 00:00:00 2001
From: Dariusz L <dl122@wp.pl>
Date: Sat, 9 Aug 2025 17:07:13 +0200
Subject: [PATCH] Fix mismatch between preview and actual mask

Corrected the overlay alignment issue on the canvas so that the preview mask now matches the actual mask positioning. This ensures consistent visual accuracy during editing.
---
 js/CanvasRenderer.js  | 4 ++--
 src/CanvasRenderer.ts | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/js/CanvasRenderer.js b/js/CanvasRenderer.js
index 1bebc6f..38938e4 100644
--- a/js/CanvasRenderer.js
+++ b/js/CanvasRenderer.js
@@ -652,8 +652,8 @@ export class CanvasRenderer {
         this.updateStrokeOverlaySize();
         // Position above main canvas but below cursor overlay
         this.strokeOverlayCanvas.style.position = 'absolute';
-        this.strokeOverlayCanvas.style.left = '0px';
-        this.strokeOverlayCanvas.style.top = '0px';
+        this.strokeOverlayCanvas.style.left = '1px';
+        this.strokeOverlayCanvas.style.top = '1px';
         this.strokeOverlayCanvas.style.pointerEvents = 'none';
         this.strokeOverlayCanvas.style.zIndex = '19'; // Below cursor overlay (20)
         // Opacity is now controlled by MaskTool.previewOpacity
diff --git a/src/CanvasRenderer.ts b/src/CanvasRenderer.ts
index 59b2af2..0c6a368 100644
--- a/src/CanvasRenderer.ts
+++ b/src/CanvasRenderer.ts
@@ -796,8 +796,8 @@ export class CanvasRenderer {
 
         // Position above main canvas but below cursor overlay
         this.strokeOverlayCanvas.style.position = 'absolute';
-        this.strokeOverlayCanvas.style.left = '0px';
-        this.strokeOverlayCanvas.style.top = '0px';
+        this.strokeOverlayCanvas.style.left = '1px';
+        this.strokeOverlayCanvas.style.top = '1px';
         this.strokeOverlayCanvas.style.pointerEvents = 'none';
         this.strokeOverlayCanvas.style.zIndex = '19'; // Below cursor overlay (20)
         // Opacity is now controlled by MaskTool.previewOpacity