From d97b9528565324fd877425fd5edf51f3466ecae5 Mon Sep 17 00:00:00 2001
From: mlogclub <mlog1@qq.com>
Date: Sun, 28 Jun 2026 19:37:04 +0800
Subject: [PATCH] feat: enhance WorkflowConfigPanel layout and styling for
 improved user experience

---
 .../_components/workflow-config-sidebar.tsx   | 29 +++++++++----------
 1 file changed, 13 insertions(+), 16 deletions(-)

diff --git a/web/app/dashboard/ai-workflows/_components/workflow-config-sidebar.tsx b/web/app/dashboard/ai-workflows/_components/workflow-config-sidebar.tsx
index b3c83ee..01dc18d 100644
--- a/web/app/dashboard/ai-workflows/_components/workflow-config-sidebar.tsx
+++ b/web/app/dashboard/ai-workflows/_components/workflow-config-sidebar.tsx
@@ -95,21 +95,21 @@ export function WorkflowConfigPanel({
           <div className="overflow-hidden rounded-lg border border-slate-200 bg-white">
             <div className="px-3 py-3">
               <div className="flex items-center justify-between gap-3">
-                <div className="flex min-w-0 items-center gap-2.5">
-                <WorkflowNodeIcon
-                  icon={panelIcon}
-                  size="sm"
-                  className="rounded-md bg-slate-100 text-slate-600 shadow-none"
-                />
-                <div className="min-w-0">
-                  <Input
-                    value={panelTitle}
-                    placeholder={selectedBranchItem ? selectedBranchItem.id : selectedNodeSpec?.title || selectedNode.type}
-                    className="h-6 border-transparent bg-transparent px-0 text-sm font-semibold leading-5 text-slate-900 shadow-none hover:border-transparent focus-visible:ring-0"
-                    onChange={(event) => updatePanelTitle(event.target.value)}
+                <div className="flex min-w-0 flex-1 items-center gap-2.5">
+                  <WorkflowNodeIcon
+                    icon={panelIcon}
+                    size="sm"
+                    className="rounded-md bg-slate-100 text-slate-600 shadow-none"
                   />
+                  <div className="min-w-0 flex-1">
+                    <Input
+                      value={panelTitle}
+                      placeholder={selectedBranchItem ? selectedBranchItem.id : selectedNodeSpec?.title || selectedNode.type}
+                      className="h-7 w-full rounded-md border-slate-200 bg-slate-50 px-2 text-sm font-semibold leading-5 text-slate-900 shadow-none transition-colors hover:border-slate-300 hover:bg-white focus-visible:border-blue-300 focus-visible:bg-white focus-visible:ring-2 focus-visible:ring-blue-100"
+                      onChange={(event) => updatePanelTitle(event.target.value)}
+                    />
+                  </div>
                 </div>
-              </div>
                 <Button
                   type="button"
                   variant="ghost"
@@ -133,9 +133,6 @@ export function WorkflowConfigPanel({
                   <span className="inline-flex h-6 items-center rounded-full border border-slate-200 bg-slate-50 px-2 font-mono text-[11px] text-slate-600">
                     {panelMeta}
                   </span>
-                  <span className="inline-flex h-6 items-center rounded-full border border-blue-100 bg-blue-50 px-2 text-[11px] text-blue-700">
-                    可配置
-                  </span>
                 </div>
               </div>
             ) : null}