From 687e1e1d0803ca82c64c2d765df0b41a1db3da64 Mon Sep 17 00:00:00 2001
From: mARTin <mail@martin-bierschenk.de>
Date: Tue, 31 Mar 2026 01:01:46 +0200
Subject: [PATCH] fix: show day + date in mobile portrait header instead of KW
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

In portrait mode on mobile, the header center now displays the full
date with weekday (e.g. "Mo. 30. März 2026") using the user's language
locale. Falls back to today if today is in the visible week, otherwise
uses the week's reference date. Landscape mobile keeps existing behavior.

v1.80.2
---
 package.json                  |  2 +-
 src/components/WeeklyView.tsx | 21 ++++++++++++++++++---
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index cda204d..33bd394 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "my-weekly-todo-list",
-  "version": "1.80.1",
+  "version": "1.80.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 a2664b2..1cab1f0 100644
--- a/src/components/WeeklyView.tsx
+++ b/src/components/WeeklyView.tsx
@@ -780,6 +780,7 @@ export default function WeeklyView() {
 
     // Mobile detection
     const [isMobile, setIsMobile] = useState(false);
+    const [isPortrait, setIsPortrait] = useState(false);
 
     const [showMobileFabSheet, setShowMobileFabSheet] = useState(false);
     const [showMobileFabMenu, setShowMobileFabMenu] = useState(false);
@@ -1207,9 +1208,12 @@ export default function WeeklyView() {
         }
     }, []);
 
-    // Mobile detection — track viewport width
+    // Mobile detection — track viewport width and orientation
     useEffect(() => {
-        const check = () => setIsMobile(window.innerWidth <= 768);
+        const check = () => {
+            setIsMobile(window.innerWidth <= 768);
+            setIsPortrait(window.innerHeight > window.innerWidth);
+        };
         check();
         window.addEventListener("resize", check);
         return () => window.removeEventListener("resize", check);
@@ -5599,7 +5603,18 @@ export default function WeeklyView() {
                         )}
                         {syncError && <AlertCircle size={14} className="text-red-500" />}
                         <span>
-                            {profile.headerDisplay === "none" ? "" :
+                            {isPortrait ? (() => {
+                                const today = new Date();
+                                const visibleDays = getVisibleDays();
+                                const isTodayInWeek = visibleDays.some(d =>
+                                    d.getDate() === today.getDate() &&
+                                    d.getMonth() === today.getMonth() &&
+                                    d.getFullYear() === today.getFullYear()
+                                );
+                                const refDate = isTodayInWeek ? today : getCWReferenceDate(visibleDays);
+                                return refDate.toLocaleDateString(profile.language || "de-DE", { weekday: "short", day: "2-digit", month: "long", year: "numeric" });
+                            })() :
+                            profile.headerDisplay === "none" ? "" :
                             profile.headerDisplay === "date" ? (() => {
                                 const today = new Date();
                                 const isTodayInWeek = getVisibleDays().some(d =>