From bf509171db80a81e2d892e7d7990e36e1511f27a Mon Sep 17 00:00:00 2001
From: DDD1542 <puget159@naver.com>
Date: Sun, 15 Mar 2026 16:38:00 +0900
Subject: [PATCH] [agent-pipeline] pipe-20260315072335-zb1m round-4

---
 .../components/screen/ScreenGroupTreeView.tsx | 44 +++++++++----------
 1 file changed, 22 insertions(+), 22 deletions(-)

diff --git a/frontend/components/screen/ScreenGroupTreeView.tsx b/frontend/components/screen/ScreenGroupTreeView.tsx
index 6b120501..65375419 100644
--- a/frontend/components/screen/ScreenGroupTreeView.tsx
+++ b/frontend/components/screen/ScreenGroupTreeView.tsx
@@ -1120,12 +1120,12 @@ export function ScreenGroupTreeView({
                   <ChevronRight className="h-4 w-4 shrink-0 text-muted-foreground" />
                 )}
                 {isExpanded ? (
-                  <FolderOpen className="h-4 w-4 shrink-0 text-warning" />
+                  <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-warning/15"><FolderOpen className="h-3.5 w-3.5 text-warning" /></span>
                 ) : (
-                  <Folder className="h-4 w-4 shrink-0 text-warning" />
+                  <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-warning/15"><Folder className="h-3.5 w-3.5 text-warning" /></span>
                 )}
                 <span className={cn("truncate flex-1", isMatching && "font-medium text-primary/80")}>{group.group_name}</span>
-                <Badge variant="secondary" className="text-xs">
+                <Badge variant="secondary" className="text-xs font-mono">
                   {groupScreens.length}
                 </Badge>
                 {/* 그룹 메뉴 버튼 */}
@@ -1186,12 +1186,12 @@ export function ScreenGroupTreeView({
                             <ChevronRight className="h-3 w-3 shrink-0 text-muted-foreground" />
                           )}
                           {isChildExpanded ? (
-                            <FolderOpen className="h-3 w-3 shrink-0 text-primary" />
+                            <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-primary/15"><FolderOpen className="h-3.5 w-3.5 text-primary" /></span>
                           ) : (
-                            <Folder className="h-3 w-3 shrink-0 text-primary" />
+                            <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-primary/15"><Folder className="h-3.5 w-3.5 text-primary" /></span>
                           )}
                           <span className={cn("truncate flex-1", isChildMatching && "font-medium text-primary/80")}>{childGroup.group_name}</span>
-                          <Badge variant="secondary" className="text-[10px] h-4">
+                          <Badge variant="secondary" className="text-[10px] h-4 font-mono">
                             {childScreens.length}
                           </Badge>
                           <DropdownMenu>
@@ -1248,12 +1248,12 @@ export function ScreenGroupTreeView({
                                       <ChevronRight className="h-3 w-3 shrink-0 text-muted-foreground" />
                                     )}
                                     {isGrandExpanded ? (
-                                      <FolderOpen className="h-3 w-3 shrink-0 text-success" />
+                                      <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-success/15"><FolderOpen className="h-3.5 w-3.5 text-success" /></span>
                                     ) : (
-                                      <Folder className="h-3 w-3 shrink-0 text-success" />
+                                      <span className="flex h-5 w-5 shrink-0 items-center justify-center rounded-md bg-success/15"><Folder className="h-3.5 w-3.5 text-success" /></span>
                                     )}
                                     <span className={cn("truncate flex-1", isGrandMatching && "font-medium text-primary/80")}>{grandChild.group_name}</span>
-                                    <Badge variant="outline" className="text-[10px] h-4">
+                                    <Badge variant="outline" className="text-[10px] h-4 font-mono">
                                       {grandScreens.length}
                                     </Badge>
                                     <DropdownMenu>
@@ -1295,9 +1295,9 @@ export function ScreenGroupTreeView({
                                           <div
                                             key={screen.screenId}
                                             className={cn(
-                                              "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors",
-                                              "text-xs hover:bg-accent",
-                                              selectedScreen?.screenId === screen.screenId && "bg-accent"
+                                              "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors duration-150",
+                                              "text-xs hover:bg-muted/60",
+                                              selectedScreen?.screenId === screen.screenId && "bg-accent shadow-sm"
                                             )}
                                             onClick={() => handleScreenClickInGroup(screen, grandChild)}
                                             onDoubleClick={() => handleScreenDoubleClick(screen)}
@@ -1331,9 +1331,9 @@ export function ScreenGroupTreeView({
                                 <div
                                   key={screen.screenId}
                                   className={cn(
-                                    "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors",
-                                    "text-xs hover:bg-accent",
-                                    selectedScreen?.screenId === screen.screenId && "bg-accent"
+                                    "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors duration-150",
+                                    "text-xs hover:bg-muted/60",
+                                    selectedScreen?.screenId === screen.screenId && "bg-accent shadow-sm"
                                   )}
                                   onClick={() => handleScreenClickInGroup(screen, childGroup)}
                                   onDoubleClick={() => handleScreenDoubleClick(screen)}
@@ -1367,9 +1367,9 @@ export function ScreenGroupTreeView({
                       <div
                         key={screen.screenId}
                         className={cn(
-                          "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors",
-                          "text-sm hover:bg-accent group/screen",
-                          selectedScreen?.screenId === screen.screenId && "bg-accent"
+                          "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors duration-150",
+                          "text-sm hover:bg-muted/60 group/screen",
+                          selectedScreen?.screenId === screen.screenId && "bg-accent shadow-sm"
                         )}
                         onClick={() => handleScreenClickInGroup(screen, group)}
                         onDoubleClick={() => handleScreenDoubleClick(screen)}
@@ -1406,7 +1406,7 @@ export function ScreenGroupTreeView({
               )}
               <Folder className="h-4 w-4 shrink-0" />
               <span className="truncate flex-1">미분류</span>
-              <Badge variant="outline" className="text-xs">
+              <Badge variant="outline" className="text-xs font-mono">
                 {ungroupedScreens.length}
               </Badge>
             </div>
@@ -1417,9 +1417,9 @@ export function ScreenGroupTreeView({
                   <div
                     key={screen.screenId}
                     className={cn(
-                      "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors",
-                      "text-sm hover:bg-accent",
-                      selectedScreen?.screenId === screen.screenId && "bg-accent"
+                      "flex items-center gap-2 rounded-md px-2 py-1.5 cursor-pointer transition-colors duration-150",
+                      "text-sm hover:bg-muted/60",
+                      selectedScreen?.screenId === screen.screenId && "bg-accent shadow-sm"
                     )}
                     onClick={() => handleScreenClick(screen)}
                     onDoubleClick={() => handleScreenDoubleClick(screen)}