From 35f9a3d8cd18139d703d87aa5e963b6d5271f7a1 Mon Sep 17 00:00:00 2001
From: Jin Yi <jin12cc@gmail.com>
Date: Tue, 19 Aug 2025 20:43:37 +0900
Subject: [PATCH] fix: resolve breadcrumb and workflow tabs layout conflict
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix flex properties to prevent excessive shrinking of breadcrumb
- Use explicit flex: 1 1 auto instead of flex: auto for clarity
- Add z-index to ensure proper layering
- Remove extreme flex-shrink value (10000) that caused layout instability
- Ensure consistent layout on initial load and after refresh

This fixes the issue where workflow tabs appeared under the breadcrumb
on initial load and only positioned correctly after page refresh.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/components/breadcrumb/SubgraphBreadcrumb.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/components/breadcrumb/SubgraphBreadcrumb.vue b/src/components/breadcrumb/SubgraphBreadcrumb.vue
index cd34babab9..72c6f9b3a5 100644
--- a/src/components/breadcrumb/SubgraphBreadcrumb.vue
+++ b/src/components/breadcrumb/SubgraphBreadcrumb.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="subgraph-breadcrumb w-auto"
+    class="subgraph-breadcrumb w-auto relative z-10"
     :class="{
       'subgraph-breadcrumb-collapse': collapseTabs,
       'subgraph-breadcrumb-overflow': overflowingTabs
@@ -157,8 +157,7 @@ onUpdated(() => {
 
 <style scoped>
 .subgraph-breadcrumb:not(:empty) {
-  flex: auto;
-  flex-shrink: 10000;
+  flex: 1 1 auto;
   min-width: 120px;
 }