From 35bc236ce5b32a875522ff14546fe4067fac2595 Mon Sep 17 00:00:00 2001
From: Mic <m@micz.it>
Date: Fri, 17 Apr 2026 01:59:00 +0200
Subject: [PATCH] added a border to editable icons. see #680 #184

---
 pages/menu_order/mzta-menu-order.css | 8 ++++++++
 pages/menu_order/mzta-menu-order.js  | 2 +-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/pages/menu_order/mzta-menu-order.css b/pages/menu_order/mzta-menu-order.css
index 2fb990f5..fbb64a68 100644
--- a/pages/menu_order/mzta-menu-order.css
+++ b/pages/menu_order/mzta-menu-order.css
@@ -193,6 +193,10 @@
     background: transparent;
 }
 
+.item_icon_preview_editable {
+    border-color: #b0c4de;
+}
+
 .item_icon_preview_special {
     cursor: default;
 }
@@ -348,6 +352,10 @@
         color: #ffb74d;
     }
 
+    .item_icon_preview_editable {
+        border-color: #556;
+    }
+
     .item_icon_preview:hover {
         background: #3a3a44;
         border-color: #409df3;
diff --git a/pages/menu_order/mzta-menu-order.js b/pages/menu_order/mzta-menu-order.js
index 9e02d7dc..fa8b89b3 100644
--- a/pages/menu_order/mzta-menu-order.js
+++ b/pages/menu_order/mzta-menu-order.js
@@ -304,7 +304,7 @@ function buildSpecialIconDisplay(prompt) {
 
 function buildIconPicker(prompt) {
     const preview = document.createElement('img');
-    preview.classList.add('item_icon_preview');
+    preview.classList.add('item_icon_preview', 'item_icon_preview_editable');
     preview.alt = '';
     preview.title = browser.i18n.getMessage('menu_order_icon_label');
     applyIconToPreview(preview, prompt.custom_icon || '');