style: Refine date header format to 'Weekday, DD.MMM.' with unified font size

This commit is contained in:
mARTin 2026-02-13 07:20:34 +01:00
parent bccadb34ce
commit 8069df9e07

View File

@ -195,8 +195,7 @@ function getStartOfWeek(date: Date, startDay: number = 0): Date {
} }
function formatDateHeader(date: Date, locale: string = 'en-US'): string { function formatDateHeader(date: Date, locale: string = 'en-US'): string {
const datePart = date.toLocaleDateString(locale, { day: 'numeric', month: 'short' }); // e.g. 12. Feb. return date.toLocaleDateString(locale, { day: 'numeric', month: 'short' }); // e.g. 12. Feb.
return `| ${datePart}`;
} }
function getDayName(date: Date, locale: string = 'en-US'): string { function getDayName(date: Date, locale: string = 'en-US'): string {
@ -1632,11 +1631,10 @@ export default function WeeklyView() {
> >
{/* Day Header */} {/* Day Header */}
<header className="weekly-day-header"> <header className="weekly-day-header">
<div style={{ display: 'flex', flexWrap: 'wrap', alignItems: 'baseline', gap: '8px', rowGap: '0' }}> <div style={{ display: 'flex', alignItems: 'baseline', gap: '4px' }}>
<h3 className={`weekly-day-name ${isSameDay(date, new Date()) ? 'is-today' : ''}`} style={{ marginBottom: 0 }}> <h3 className={`weekly-day-name ${isSameDay(date, new Date()) ? 'is-today' : ''}`} style={{ marginBottom: 0 }}>
{getDayName(date, language)} {getDayName(date, language)}, <span style={{ fontWeight: 400 }}>{formatDateHeader(date, language)}</span>
</h3> </h3>
<div className="weekly-day-date" style={{ fontSize: '10px', fontWeight: 700, opacity: 0.6 }}>{formatDateHeader(date, language)}</div>
</div> </div>
</header> </header>