From 319cbc1dcb70523ad5d73fa4d148e2abffd95557 Mon Sep 17 00:00:00 2001
From: Dariusz L <dl122@wp.pl>
Date: Sat, 28 Jun 2025 02:33:25 +0200
Subject: [PATCH] Refactor blend mode menu handling in CanvasLayers

Replaces direct DOM removal with a dedicated closeBlendModeMenu method for consistency. Increases menu z-index for better stacking, and appends the menu to the canvas container if available instead of always using document.body.
---
 js/CanvasLayers.js | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/js/CanvasLayers.js b/js/CanvasLayers.js
index 072394c..497304b 100644
--- a/js/CanvasLayers.js
+++ b/js/CanvasLayers.js
@@ -454,10 +454,7 @@ export class CanvasLayers {
     }
 
     showBlendModeMenu(x, y) {
-        const existingMenu = document.getElementById('blend-mode-menu');
-        if (existingMenu) {
-            document.body.removeChild(existingMenu);
-        }
+        this.closeBlendModeMenu();
 
         const menu = document.createElement('div');
         menu.id = 'blend-mode-menu';
@@ -469,7 +466,7 @@ export class CanvasLayers {
             border: 1px solid #3a3a3a;
             border-radius: 4px;
             padding: 5px;
-            z-index: 1000;
+            z-index: 10000;
             box-shadow: 0 2px 10px rgba(0,0,0,0.3);
         `;
 
@@ -556,11 +553,12 @@ export class CanvasLayers {
             menu.appendChild(container);
         });
 
-        document.body.appendChild(menu);
+        const container = this.canvasLayers.canvas.parentElement || document.body;
+        container.appendChild(menu);
 
         const closeMenu = (e) => {
             if (!menu.contains(e.target)) {
-                document.body.removeChild(menu);
+                this.closeBlendModeMenu();
                 document.removeEventListener('mousedown', closeMenu);
             }
         };
@@ -571,8 +569,8 @@ export class CanvasLayers {
 
     closeBlendModeMenu() {
         const menu = document.getElementById('blend-mode-menu');
-        if (menu) {
-            document.body.removeChild(menu);
+        if (menu && menu.parentNode) {
+            menu.parentNode.removeChild(menu);
         }
     }