From 32498d51d1c60031b8f3cea0cb644545ea459eb1 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julien.calixte@theodo.com>
Date: Sat, 20 Jun 2026 10:13:21 +0200
Subject: [PATCH] fix(editor): render the palette above the loop-badge overlay

---
 src/components/Editor.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/Editor.vue b/src/components/Editor.vue
index ae1b20e..2d6ef3f 100644
--- a/src/components/Editor.vue
+++ b/src/components/Editor.vue
@@ -20,7 +20,6 @@ import {
   ErrorCode,
   isErrorOfType,
   type OnConnectStartParams,
-  Panel,
   useVueFlow,
   VueFlow,
   type XYPosition,
@@ -341,10 +340,6 @@ onBeforeUnmount(() => window.removeEventListener("keydown", onKeydown))
         <Background :gap="20" pattern-color="#d1d5db" />
         <Controls position="bottom-left" :show-interactive="false" />
 
-        <Panel position="top-left">
-          <Palette @add="addNode" />
-        </Panel>
-
         <template #node-stock="nodeProps">
           <StockNode v-bind="nodeProps" />
         </template>
@@ -363,6 +358,10 @@ onBeforeUnmount(() => window.removeEventListener("keydown", onKeydown))
         </template>
       </VueFlow>
 
+      <!-- Chrome lives at this level, above the badge overlay: Vue Flow's pane is a
+           z-index:0 stacking context, so a Panel inside it would be painted under
+           the screen-space R/B badges (which sit on the canvas, over loop centres). -->
+      <Palette class="absolute top-3 left-3 z-20" @add="addNode" />
       <LoopOverlay />
       <GlossPanel />
     </div>