mirror of
http://172.20.10.11:3000/gitadmin/INSIGHT-MVP.git
synced 2026-06-25 00:16:41 +02:00
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:
parent
653464c89b
commit
403c581e57
3 changed files with 9 additions and 2 deletions
|
|
@ -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;
|
||||||
|
|
|
||||||
|
|
@ -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' })}
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue