Implements all-day event row collapsing

Adds functionality to collapse the all-day event rows when the number of rows exceeds a limit.

This improves the layout by preventing the all-day section from taking up too much space. A chevron button is added to allow users to expand/collapse the section.
This commit is contained in:
Janus C. H. Knudsen 2025-09-30 00:34:27 +02:00
parent 5417a2b6b1
commit c705869c9e
2 changed files with 100 additions and 1 deletions

View file

@ -58,6 +58,42 @@ swp-header-spacer {
position: relative;
}
/* All-day chevron button */
.allday-chevron {
position: absolute;
bottom: 2px;
left: 50%;
transform: translateX(-50%);
background: none;
border: none;
cursor: pointer;
padding: 4px 8px;
color: #666;
transition: transform 0.3s ease, color 0.2s ease;
border-radius: 4px;
}
.allday-chevron:hover {
color: #000;
background-color: rgba(0, 0, 0, 0.05);
}
/* Chevron points down when collapsed (can expand) */
.allday-chevron.collapsed {
transform: translateX(-50%) rotate(0deg);
}
/* Chevron points up when expanded (can collapse) */
.allday-chevron.expanded {
transform: translateX(-50%) rotate(180deg);
}
.allday-chevron svg {
display: block;
width: 12px;
height: 8px;
}
/* Week container for sliding */