From 403c581e57f397edf20bb2f4dfed8b26766c235e Mon Sep 17 00:00:00 2001
From: Thomas Reitz <T.Reitz@xinion.de>
Date: Fri, 13 Mar 2026 12:32:38 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20Agenda-Breite=20im=20Home-Sidebar=20f?=
 =?UTF-8?q?=C3=BCllt=20volle=20300px?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- DayAgenda: fullWidth-Prop ergänzt (setzt .agendaFull → width: 100%)
- Im Kalender-Tab bleibt die Agenda bei 260px (flex-shrink: 0)
- HomeSidebar übergibt fullWidth, sodass die Agenda den Sidebar
  lückenlos ausfüllt

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 packages/frontend/src/shell/DashboardCalendarTab.module.css | 5 +++++
 packages/frontend/src/shell/DashboardCalendarTab.tsx        | 4 +++-
 packages/frontend/src/shell/DashboardPage.tsx               | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/shell/DashboardCalendarTab.module.css b/packages/frontend/src/shell/DashboardCalendarTab.module.css
index b73cfb9..14322ad 100644
--- a/packages/frontend/src/shell/DashboardCalendarTab.module.css
+++ b/packages/frontend/src/shell/DashboardCalendarTab.module.css
@@ -518,6 +518,11 @@
   overflow: hidden;
 }
 
+/* Im Home-Sidebar: Agenda füllt volle Breite des Containers */
+.agendaFull {
+  width: 100%;
+}
+
 .agendaHeader {
   display: flex;
   flex-direction: column;
diff --git a/packages/frontend/src/shell/DashboardCalendarTab.tsx b/packages/frontend/src/shell/DashboardCalendarTab.tsx
index 749021c..08bfcc5 100644
--- a/packages/frontend/src/shell/DashboardCalendarTab.tsx
+++ b/packages/frontend/src/shell/DashboardCalendarTab.tsx
@@ -75,14 +75,16 @@ function eventColor(id: string): string {
 export function DayAgenda({
   day,
   events,
+  fullWidth = false,
 }: {
   day: Date;
   events: M365CalendarEvent[];
+  fullWidth?: boolean;
 }) {
   const dayEvents = getEventsForDay(events, day);
 
   return (
-    <aside className={styles.agenda}>
+    <aside className={`${styles.agenda}${fullWidth ? ` ${styles.agendaFull}` : ''}`}>
       <div className={styles.agendaHeader}>
         <span className={styles.agendaWeekday}>
           {day.toLocaleDateString('de-DE', { weekday: 'long' })}
diff --git a/packages/frontend/src/shell/DashboardPage.tsx b/packages/frontend/src/shell/DashboardPage.tsx
index 0171d46..2d76239 100644
--- a/packages/frontend/src/shell/DashboardPage.tsx
+++ b/packages/frontend/src/shell/DashboardPage.tsx
@@ -217,7 +217,7 @@ function HomeSidebar() {
           ? <p style={{ fontSize: '0.875rem', color: 'var(--color-text-muted)', marginTop: '0.5rem' }}>
               Kalender wird geladen…
             </p>
-          : <DayAgenda day={today} events={events} />
+          : <DayAgenda day={today} events={events} fullWidth />
       )}
     </div>
   );