fix: hide full header toolbar when left rail is active; fix user menu in left rail

- Right header section now also gets display:none when useLeftRail is true,
  so neither the left nor right header controls are visible in left-rail mode
- Replaced UserMenu (which positions from the right edge) with an inline
  dropdown in the left rail that opens to the right of the rail at left:52px,
  correctly positioned and functional
- Added LogOut icon to lucide imports

v1.106.3

package.json

@@ -1,6 +1,6 @@
 {
   "name": "my-weekly-todo-list",
-  "version": "1.106.2",
+  "version": "1.106.3",
   "description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
   "main": "index.js",
   "scripts": {

src/components/WeeklyView.tsx

@@ -92,6 +92,7 @@ import {
     Bot,
     Printer,
     Star,
+    LogOut,
 } from "lucide-react";
 
 const stripHtml = (html: string) => html.replace(/<[^>]*>/g, '').trim();
@@ -1253,6 +1254,7 @@ export default function WeeklyView() {
     const [showQuickSettings, setShowQuickSettings] = useState(false);
     const [leftRailExpanded, setLeftRailExpanded] = useState(false);
     const [flyoutSection, setFlyoutSection] = useState<string | null>(null);
+    const [showRailUserMenu, setShowRailUserMenu] = useState(false);
     const [flyoutY, setFlyoutY] = useState(0);
     const flyoutTimerRef = useRef<NodeJS.Timeout | null>(null);
     const [showProjectsSidebar, setShowProjectsSidebar] = useState(false);
@@ -5935,12 +5937,33 @@ export default function WeeklyView() {
                             {railSep}
                             {/* Settings (cogwheel) + User menu at bottom */}
                             <button onClick={() => setShowSettings(true)} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Einstellungen" : "Settings"}><Settings size={15} /></button>
-                            <UserMenu
+                            <div style={{ position: "relative" }}>
-                                userEmail={session?.user?.email}
+                                <button onClick={() => setShowRailUserMenu(!showRailUserMenu)} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Benutzerprofil" : "User profile"}><User size={15} /></button>
-                                onOpenSettings={() => setShowSettings(true)}
+                                {showRailUserMenu && (
-                                language={profile.language}
+                                    <>
-                                trigger={<button style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Benutzerprofil" : "User profile"}><User size={15} /></button>}
+                                        <div style={{ position: "fixed", inset: 0, zIndex: 998 }} onClick={() => setShowRailUserMenu(false)} />
-                            />
+                                        <div style={{ position: "fixed", left: "52px", bottom: "60px", width: "200px", background: darkMode ? "#1f2937" : "#ffffff", border: "1px solid var(--line)", borderRadius: "10px", boxShadow: "2px 4px 16px rgba(0,0,0,0.15)", zIndex: 999, overflow: "hidden" }}>
+                                            <div style={{ padding: "10px 14px", borderBottom: "1px solid var(--line)" }}>
+                                                <p style={{ fontSize: "0.8rem", fontWeight: 600, color: darkMode ? "#e5e7eb" : "#374151", margin: 0 }}>{profile.language === "de" ? "Angemeldet als" : "Signed in as"}</p>
+                                                <p style={{ fontSize: "0.75rem", color: darkMode ? "#9ca3af" : "#6b7280", margin: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }}>{session?.user?.email || "User"}</p>
+                                            </div>
+                                            <button onClick={() => { setShowSettings(true); setShowRailUserMenu(false); }} style={{ width: "100%", textAlign: "left", padding: "8px 14px", fontSize: "0.85rem", color: darkMode ? "#e5e7eb" : "#374151", background: "none", border: "none", cursor: "pointer", display: "flex", alignItems: "center", gap: "8px" }}
+                                                onMouseEnter={(e) => (e.currentTarget.style.background = darkMode ? "#374151" : "#f3f4f6")}
+                                                onMouseLeave={(e) => (e.currentTarget.style.background = "none")}>
+                                                <Settings size={15} style={{ opacity: 0.5 }} />
+                                                {profile.language === "de" ? "Einstellungen" : "Settings"}
+                                            </button>
+                                            <div style={{ borderTop: "1px solid var(--line)", margin: "2px 0" }} />
+                                            <button onClick={() => signOut()} style={{ width: "100%", textAlign: "left", padding: "8px 14px", fontSize: "0.85rem", color: "#ef4444", background: "none", border: "none", cursor: "pointer", display: "flex", alignItems: "center", gap: "8px" }}
+                                                onMouseEnter={(e) => (e.currentTarget.style.background = "rgba(239,68,68,0.08)")}
+                                                onMouseLeave={(e) => (e.currentTarget.style.background = "none")}>
+                                                <LogOut size={15} style={{ opacity: 0.7 }} />
+                                                {profile.language === "de" ? "Abmelden" : "Sign Out"}
+                                            </button>
+                                        </div>
+                                    </>
+                                )}
+                            </div>
                         </div>
                     )}
                 </div>
@@ -6344,7 +6367,7 @@ export default function WeeklyView() {
                 </div>
 
                 {/* RIGHT SECTION: Navigation & Tools */}
-                <div className="weekly-header-controls flex-shrink-0 flex items-center gap-1.5 sm:gap-2 transition-opacity duration-700 opacity-0 group-hover:opacity-100" style={{ zIndex: 10, ...(showIntroHints ? { opacity: 1 } : {}) }}>
+                <div className="weekly-header-controls flex-shrink-0 flex items-center gap-1.5 sm:gap-2 transition-opacity duration-700 opacity-0 group-hover:opacity-100" style={{ zIndex: 10, display: useLeftRail ? "none" : undefined, ...(showIntroHints ? { opacity: 1 } : {}) }}>
                     {/* Secondary actions — hidden on tablet, visible on desktop */}
                     <div className="header-desktop-only flex items-center gap-1.5">
                         <button onClick={handleUndo} disabled={undoCount === 0} className="weekly-btn-icon disabled:opacity-30 disabled:cursor-default" title="Undo (Ctrl+Z)">