Add files via upload

frontend/src/App.jsx

@@ -20,7 +20,6 @@ export default function App() {
       .catch(() => setLoading(false))
   }, [])
 
-  // Global keyboard shortcuts
   useEffect(() => {
     const handler = (e) => {
       if (['INPUT','TEXTAREA','SELECT'].includes(e.target.tagName)) return
@@ -41,10 +40,34 @@ export default function App() {
         <ProjectList onRegisterNewProject={fn => { newProjectFn.current = fn }} />
       </aside>
 
-      {/* Sidebar toggle tab */}
-      <button onClick={toggleSidebar} title={`${sidebarOpen ? 'Collapse' : 'Expand'} sidebar  [B]`}
-        className={`absolute top-4 z-30 bg-surface-elevated border border-surface-border hover:border-gold/50 text-text-muted hover:text-gold rounded-r-lg px-1 py-3 transition-all duration-300 text-xs ${sidebarOpen ? 'left-72' : 'left-0'}`}>
-        {sidebarOpen ? '◀' : '▶'}
+      {/* Sidebar toggle — arrow when open, mini logo when collapsed */}
+      <button
+        onClick={toggleSidebar}
+        title={`${sidebarOpen ? 'Collapse' : 'Expand'} sidebar  [B]`}
+        className={`absolute top-0 z-30 flex flex-col items-center justify-center
+          border-r border-b border-surface-border bg-surface-raised
+          hover:border-gold/40 transition-all duration-300
+          ${sidebarOpen
+            ? 'w-6 h-10 top-4 rounded-r-lg border-l-0 hover:bg-surface-elevated'
+            : 'w-14 h-14 top-0 rounded-br-xl border-l-0 hover:bg-surface-elevated/80'
+          }`}
+        style={{ left: sidebarOpen ? 'calc(var(--sidebar-w, 18rem))' : 0 }}
+      >
+        {sidebarOpen ? (
+          <span className="text-text-muted hover:text-gold text-xs leading-none">◀</span>
+        ) : (
+          <div className="flex flex-col items-center gap-0.5">
+            <img
+              src="/logo.png"
+              alt="FabDash"
+              className="w-8 h-8 object-contain rounded"
+              onError={e => { e.target.style.display='none'; e.target.nextSibling.style.display='block' }}
+            />
+            {/* Fallback if logo not yet placed */}
+            <span className="text-gold text-[10px] font-black tracking-widest hidden">FD</span>
+            <span className="text-text-muted/50 text-[8px] mt-0.5">▶</span>
+          </div>
+        )}
       </button>
 
       {/* Main content */}