Merge pull request #211 from piotrmaciejbednarski/fix/file-tree-header-209

Fix overflow issues in File Tree Header on narrow screen widths

Author: devkokooo

src/components/layout/main-sidebar.tsx

@@ -125,16 +125,16 @@ export const MainSidebar = () => {
 
       {/* File Tree Header */}
       {showFileTreeHeader && (
-        <div className="flex items-center justify-between bg-secondary-bg px-2 py-1.5">
+        <div className="flex flex-wrap items-center justify-between bg-secondary-bg px-2 py-1.5">
           <h3
-            className="cursor-pointer rounded px-2 py-1 font-medium font-mono text-text text-xs tracking-wide hover:bg-hover"
+            className="min-w-0 flex-shrink cursor-pointer truncate rounded px-2 py-1 font-medium font-mono text-text text-xs tracking-wide hover:bg-hover"
             onClick={onProjectNameMenuOpen}
             onContextMenu={onProjectNameMenuOpen}
             title="Click for workspace options"
           >
             {projectName}
           </h3>
-          <div className="flex items-center gap-0.5">
+          <div className="flex flex-shrink-0 items-center gap-0.5">
             <Button
               onClick={handleOpenFolder}
               variant="ghost"