fix: Agenda-Breite im Home-Sidebar füllt volle 300px

- 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>
This commit is contained in:
Thomas Reitz 2026-03-13 12:32:38 +01:00
parent 653464c89b
commit 403c581e57
3 changed files with 9 additions and 2 deletions

View file

@ -518,6 +518,11 @@
overflow: hidden; overflow: hidden;
} }
/* Im Home-Sidebar: Agenda füllt volle Breite des Containers */
.agendaFull {
width: 100%;
}
.agendaHeader { .agendaHeader {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View file

@ -75,14 +75,16 @@ function eventColor(id: string): string {
export function DayAgenda({ export function DayAgenda({
day, day,
events, events,
fullWidth = false,
}: { }: {
day: Date; day: Date;
events: M365CalendarEvent[]; events: M365CalendarEvent[];
fullWidth?: boolean;
}) { }) {
const dayEvents = getEventsForDay(events, day); const dayEvents = getEventsForDay(events, day);
return ( return (
<aside className={styles.agenda}> <aside className={`${styles.agenda}${fullWidth ? ` ${styles.agendaFull}` : ''}`}>
<div className={styles.agendaHeader}> <div className={styles.agendaHeader}>
<span className={styles.agendaWeekday}> <span className={styles.agendaWeekday}>
{day.toLocaleDateString('de-DE', { weekday: 'long' })} {day.toLocaleDateString('de-DE', { weekday: 'long' })}

View file

@ -217,7 +217,7 @@ function HomeSidebar() {
? <p style={{ fontSize: '0.875rem', color: 'var(--color-text-muted)', marginTop: '0.5rem' }}> ? <p style={{ fontSize: '0.875rem', color: 'var(--color-text-muted)', marginTop: '0.5rem' }}>
Kalender wird geladen Kalender wird geladen
</p> </p>
: <DayAgenda day={today} events={events} /> : <DayAgenda day={today} events={events} fullWidth />
)} )}
</div> </div>
); );