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

small steps

Browse source
This commit is contained in:
Janus Knudsen 2025-08-04 23:31:08 +02:00
parent 42901212da
commit e37b3d7004
2 changed files with 13 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/managers/GridManager.ts
View file

@ -255,14 +255,16 @@ export class GridManager {
weekHeader.appendChild(header);
});
// Add orange header sections in row 2
const headerSectionLeft = document.createElement('swp-header-section-left');
headerSectionLeft.textContent = 'Left Section';
weekHeader.appendChild(headerSectionLeft);
// Add all-day events in row 2
const allDayEventLeft = document.createElement('swp-allday-event');
allDayEventLeft.textContent = 'Left Section';
allDayEventLeft.style.gridColumn = '1 / 3'; // Span columns 1-2
weekHeader.appendChild(allDayEventLeft);
const headerSectionRight = document.createElement('swp-header-section-right');
headerSectionRight.textContent = 'Right Section';
weekHeader.appendChild(headerSectionRight);
const allDayEventRight = document.createElement('swp-allday-event');
allDayEventRight.textContent = 'Right Section';
allDayEventRight.style.gridColumn = '3 / 8'; // Span columns 3-7
weekHeader.appendChild(allDayEventRight);
// Update spacer heights based on all-day events
this.updateSpacerHeights();

14
wwwroot/css/calendar-layout-css.css
View file

@ -277,9 +277,8 @@ swp-week-header::after {
z-index: 1;
}
/* Orange header sections in row 2 */
swp-header-section-left {
grid-column: 1 / 3; /* Span columns 1-2 */
/* All-day events in row 2 */
swp-allday-event {
grid-row: 2; /* Row 2 only */
background: #ff9800; /* Orange background */
display: flex;
@ -288,13 +287,8 @@ swp-header-section-left {
border-right: 1px solid rgba(0, 0, 0, 0.1);
}
swp-header-section-right {
grid-column: 3 / 8; /* Span columns 3-7 */
grid-row: 2; /* Row 2 only */
background: #ff9800; /* Orange background */
display: flex;
align-items: center;
justify-content: center;
swp-allday-event:last-child {
border-right: none; /* Remove border from last all-day event */
}
/* Scrollable content */