Spaces:

wuhp
/

testarcbuilder

Running

App Files Files Community

wuhp commited on Dec 15, 2025

Commit

5b8143b

verified ·

1 Parent(s): 7da31e5

Update components/Sidebar.tsx

Browse files

Files changed (1) hide show

components/Sidebar.tsx +8 -8

components/Sidebar.tsx CHANGED Viewed

@@ -155,12 +155,12 @@ const Sidebar: React.FC<SidebarProps> = ({ onOpenAIBuilder, onSelectTemplate, on
                       draggable
                     >
                       <div className="flex items-center gap-3 relative z-10">
-                        <div className={`p-1.5 rounded transition-colors group-hover:bg-slate-900 bg-slate-900/50`}>
                           <Box size={14} className="text-slate-400 group-hover:text-blue-400" />
                         </div>
-                        <div>
-                          <div className="text-sm font-medium text-slate-200 group-hover:text-white">{layer.label}</div>
-                          <div className="text-xs text-slate-500 leading-tight group-hover:text-slate-400 line-clamp-2">{layer.description}</div>
                         </div>
                       </div>
                     </div>
@@ -190,12 +190,12 @@ const Sidebar: React.FC<SidebarProps> = ({ onOpenAIBuilder, onSelectTemplate, on
                           draggable
                         >
                           <div className="flex items-center gap-3 relative z-10">
-                            <div className={`p-1.5 rounded transition-colors group-hover:bg-slate-900 bg-slate-900/50`}>
                               <Box size={14} className="text-slate-400 group-hover:text-blue-400" />
                             </div>
-                            <div>
-                              <div className="text-sm font-medium text-slate-200 group-hover:text-white">{layer.label}</div>
-                              <div className="text-xs text-slate-500 leading-tight group-hover:text-slate-400">{layer.description}</div>
                             </div>
                           </div>
                         </div>

                       draggable
                     >
                       <div className="flex items-center gap-3 relative z-10">
+                        <div className={`p-1.5 rounded transition-colors group-hover:bg-slate-900 bg-slate-900/50 shrink-0`}>
                           <Box size={14} className="text-slate-400 group-hover:text-blue-400" />
                         </div>
+                        <div className="flex-1 min-w-0">
+                          <div className="text-sm font-medium text-slate-200 group-hover:text-white truncate">{layer.label}</div>
+                          <div className="text-xs text-slate-500 leading-tight group-hover:text-slate-400 whitespace-normal mt-0.5">{layer.description}</div>
                         </div>
                       </div>
                     </div>
                           draggable
                         >
                           <div className="flex items-center gap-3 relative z-10">
+                            <div className={`p-1.5 rounded transition-colors group-hover:bg-slate-900 bg-slate-900/50 shrink-0`}>
                               <Box size={14} className="text-slate-400 group-hover:text-blue-400" />
                             </div>
+                            <div className="flex-1 min-w-0">
+                              <div className="text-sm font-medium text-slate-200 group-hover:text-white truncate">{layer.label}</div>
+                              <div className="text-xs text-slate-500 leading-tight group-hover:text-slate-400 whitespace-normal mt-0.5">{layer.description}</div>
                             </div>
                           </div>
                         </div>