From ab8d96a810055dd80548e535157090f111092b25 Mon Sep 17 00:00:00 2001
From: mARTin-B78 <mail@martin-bierschenk.de>
Date: Mon, 11 May 2026 13:41:41 +0200
Subject: [PATCH] fix(mobile): header icon toggles icon rail; remove redundant
 nav arrows from rail
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- PanelLeftOpen in header now toggles the icon rail open/close
- Close button in rail uses same PanelLeftOpen icon for visual consistency
- Removed nav arrows (prev/next day/week, today) from rail — available in Quick Settings
- Removed Printer from rail (rarely used on mobile)
- Added SlidersHorizontal (Quick Settings) to bottom of rail

v1.110.2
---
 package.json                  |  2 +-
 src/components/WeeklyView.tsx | 19 ++++++-------------
 2 files changed, 7 insertions(+), 14 deletions(-)

diff --git a/package.json b/package.json
index 4492700..f1de9f0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "my-weekly-todo-list",
-  "version": "1.110.1",
+  "version": "1.110.2",
   "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": {
diff --git a/src/components/WeeklyView.tsx b/src/components/WeeklyView.tsx
index 7437b6c..751c582 100644
--- a/src/components/WeeklyView.tsx
+++ b/src/components/WeeklyView.tsx
@@ -6066,8 +6066,8 @@ export default function WeeklyView() {
             {/* Mobile Header */}
             {isMobile && (
                 <header className="mobile-header" style={{ background: darkMode ? "#111827" : "#ffffff", borderBottom: `1px solid ${darkMode ? "#374151" : "#e5e7eb"}` }}>
-                    {/* Left: Quick Settings */}
-                    <button className="mobile-header-btn" onClick={() => setShowQuickSettings(true)} title="Quick Settings" style={{ color: darkMode ? "#e5e7eb" : "#6b7280" }}>
+                    {/* Left: Icon rail toggle */}
+                    <button className="mobile-header-btn" onClick={() => { setShowMobileRail(v => !v); setFlyoutSection(null); }} title="Icon Rail" style={{ color: darkMode ? "#e5e7eb" : "#6b7280" }}>
                         <PanelLeftOpen size={22} />
                     </button>
 
@@ -6131,15 +6131,8 @@ export default function WeeklyView() {
                         alignItems: "center", paddingTop: "6px", paddingBottom: "8px", gap: "2px",
                         overflowY: "auto",
                     }}>
-                        {/* Collapse */}
-                        <button className="mobile-rail-btn" onClick={() => { setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title="Close"><PanelLeftClose size={16} /></button>
-                        {railSep}
-                        {/* Navigation */}
-                        <button className="mobile-rail-btn" onClick={() => { goToPrevWeek(); setShowMobileRail(false); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Vorherige Woche" : "Previous Week"}><ChevronsLeft size={15} /></button>
-                        <button className="mobile-rail-btn" onClick={() => { goToPrevDay(); setShowMobileRail(false); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Vorheriger Tag" : "Previous Day"}><ChevronLeft size={15} /></button>
-                        <button className="mobile-rail-btn" onClick={() => { goToToday(); setShowMobileRail(false); }} style={{ ...railIconBtnStyle, fontSize: "0.5rem", fontWeight: 800, letterSpacing: "0.05em" }} title="Today">{profile.language === "de" ? "HEUTE" : "TODAY"}</button>
-                        <button className="mobile-rail-btn" onClick={() => { goToNextDay(); setShowMobileRail(false); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Nächster Tag" : "Next Day"}><ChevronRight size={15} /></button>
-                        <button className="mobile-rail-btn" onClick={() => { goToNextWeek(); setShowMobileRail(false); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Nächste Woche" : "Next Week"}><ChevronsRight size={15} /></button>
+                        {/* Collapse — same icon as header toggle */}
+                        <button className="mobile-rail-btn" onClick={() => { setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title="Close"><PanelLeftOpen size={16} /></button>
                         {railSep}
                         {/* View flyout */}
                         <button className="mobile-rail-btn" style={{ ...railIconBtnStyle, color: "var(--accent)" }} title={profile.language === "de" ? "Ansicht" : "View"} onClick={(e) => { const rect = (e.currentTarget as HTMLElement).getBoundingClientRect(); setFlyoutY(rect.top); setFlyoutSection(flyoutSection === "view" ? null : "view"); }}>
@@ -6168,11 +6161,11 @@ export default function WeeklyView() {
                         <button className="mobile-rail-btn" onClick={handleUndo} disabled={undoCount === 0} style={{ ...railIconBtnStyle, opacity: undoCount === 0 ? 0.3 : 1 }} title="Undo"><Undo2 size={15} /></button>
                         <button className="mobile-rail-btn" onClick={handleRedo} disabled={redoCount === 0} style={{ ...railIconBtnStyle, opacity: redoCount === 0 ? 0.3 : 1 }} title="Redo"><Redo2 size={15} /></button>
                         <button className="mobile-rail-btn" onClick={() => { fetchCalendarEvents(true); fetchTasks(); setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title="Refresh"><RefreshCcw size={15} /></button>
-                        <button className="mobile-rail-btn" onClick={() => { setShowWeekPrintModal(true); setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Drucken" : "Print"}><Printer size={15} /></button>
                         <button className="mobile-rail-btn" onClick={() => setDarkMode(!darkMode)} style={{ ...railIconBtnStyle }} title={darkMode ? "Light Mode" : "Dark Mode"}>{darkMode ? <Sun size={15} /> : <Moon size={15} />}</button>
                         <div style={{ flex: 1 }} />
                         {railSep}
-                        {/* Settings + User/logout */}
+                        {/* Quick Settings + full Settings + User/logout */}
+                        <button className="mobile-rail-btn" onClick={() => { setShowQuickSettings(true); setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title="Quick Settings"><SlidersHorizontal size={15} /></button>
                         <button className="mobile-rail-btn" onClick={() => { setShowSettings(true); setShowMobileRail(false); setFlyoutSection(null); }} style={{ ...railIconBtnStyle }} title={profile.language === "de" ? "Einstellungen" : "Settings"}><Settings size={15} /></button>
                         <button className="mobile-rail-btn" onClick={() => signOut()} style={{ ...railIconBtnStyle, color: "#ef4444" }} title={profile.language === "de" ? "Abmelden" : "Sign out"}><LogOut size={15} /></button>
                     </div>