Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extend calendar week view to 7 days

Browse source 
Updates DateService to generate 7-day week dates
Enhances CSS grid layouts with minimum column width
Ensures consistent calendar column sizing across components
This commit is contained in:
Janus C. H. Knudsen 2025-12-07 21:08:05 +01:00
parent 542b150888
commit e2c79c067f
2 changed files with 6 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/v2/core/DateService.ts
View file

@ -14,7 +14,7 @@ export class DateService {
getWeekDates(offset = 0): string[] {
const monday = dayjs().startOf('week').add(1, 'day').add(offset, 'week');
return Array.from({ length: 5 }, (_, i) =>
return Array.from({ length: 7 }, (_, i) =>
monday.add(i, 'day').format('YYYY-MM-DD')
);
}

7
wwwroot/css/calendar-v2.css
View file

@ -160,7 +160,8 @@ swp-content-track > swp-scrollable-content {
/* Header */
swp-calendar-header {
display: grid;
grid-template-columns: repeat(var(--grid-columns), 1fr);
grid-template-columns: repeat(var(--grid-columns), minmax(var(--day-column-min-width), 1fr));
min-width: calc(var(--grid-columns) * var(--day-column-min-width));
grid-auto-rows: auto;
background: var(--color-surface);
overflow-y: scroll;
@ -227,6 +228,7 @@ swp-time-grid {
display: block;
position: relative;
min-height: calc((var(--day-end-hour) - var(--day-start-hour)) * var(--hour-height));
min-width: calc(var(--grid-columns) * var(--day-column-min-width));
}
/* Timelinjer via ::after */
@ -274,7 +276,8 @@ swp-day-columns {
position: absolute;
inset: 0;
display: grid;
grid-template-columns: repeat(var(--grid-columns), 1fr);
grid-template-columns: repeat(var(--grid-columns), minmax(var(--day-column-min-width), 1fr));
min-width: calc(var(--grid-columns) * var(--day-column-min-width));
}
swp-day-column {