Fix all-day events: validation and proper header positioning
Backend fixes: - Fix all-day event creation validation error - Allow same start/end date for all-day events (single-day events) - Maintain strict validation for timed events (end must be after start) Frontend improvements: - Move all-day events from time grid to day headers - Add dedicated all-day events container that stacks vertically - Filter all-day events out of main time-based events area - Add proper CSS styling for all-day event display and interaction - Maintain event click handling and color themes All-day events now appear in the correct location at the top of each day column and properly stack when multiple events exist. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -650,11 +650,14 @@ body {
|
||||
}
|
||||
|
||||
.week-day-header {
|
||||
padding: 1rem;
|
||||
padding: 0.5rem;
|
||||
text-align: center;
|
||||
border-right: 1px solid var(--time-label-border, #e9ecef);
|
||||
background: var(--weekday-header-bg, #f8f9fa);
|
||||
color: var(--weekday-header-text, inherit);
|
||||
min-height: 70px; /* Ensure space for all-day events */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.week-day-header.today {
|
||||
@@ -680,6 +683,45 @@ body {
|
||||
color: var(--calendar-today-text, #1976d2);
|
||||
}
|
||||
|
||||
/* All-day events in header */
|
||||
.day-header-content {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.all-day-events {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
margin-top: 0.5rem;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.all-day-event {
|
||||
background: #3B82F6;
|
||||
color: white;
|
||||
border-radius: 4px;
|
||||
padding: 2px 6px;
|
||||
font-size: 0.75rem;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
border: 1px solid rgba(255,255,255,0.2);
|
||||
min-height: 18px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.all-day-event:hover {
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
|
||||
.all-day-event-title {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* Week Content */
|
||||
.week-content {
|
||||
flex: 1;
|
||||
|
||||
Reference in New Issue
Block a user