Take the last scrollbar off the calendar
Some checks failed
CI / backend (push) Failing after 8s
CI / naming (push) Successful in 2s
CI / frontend (push) Successful in 9s
CI / migrations-mysql (push) Failing after 7s

An audit of every scrollable element on the page, rather than the document
alone, found what the previous two attempts kept missing: FullCalendar's
day-grid scroller sits 16px short of its own content at every window size.

It is phantom. The table inside measures exactly the scroller's height, the
last week sits flush with the bottom, and the horizontal axis is clean - there
is nothing to scroll to, but the browser paints a bar for the gap. Shrinking
the calendar to close it does not work either: the gap stays 16px however small
the grid gets, so the previous pass had started shrinking the month for
nothing. That correction is reverted to page overflow only.

The grid is sized to fit its six rows, so the scroller has nothing to reveal;
hiding it is safe and is what the earlier arithmetic was failing to buy.

Audited with 60 events across 12 days at 1920x1080, 1600x900, 1366x768,
1280x720 and 1920x1200: no scrollable element left in the calendar, six weeks
visible, last week fully in view, badges shown with a '+N more' where a short
row cannot hold them all.

The nav sidebar still scrolls on a short window - 100vh of viewport against
about 1384px of menu - but that is every page, not this one.
This commit is contained in:
cproudlock
2026-08-08 15:26:11 -04:00
parent 686966b3b1
commit a4a862b42a

View File

@@ -294,6 +294,16 @@ function formatDate(dateStr) {
min-height: 460px;
}
/* FullCalendar's day-grid scroller reports 16px more scrollHeight than the
table inside it - the last week sits flush with the bottom and nothing is
hidden, but the browser still paints a scrollbar for the phantom 16px. The
calendar is sized to fit its six rows (fitHeight), so there is nothing for
this scroller to reveal; hide the bar rather than shrinking the grid to
chase a gap that never closes. */
:deep(.fc-scroller-liquid-absolute) {
overflow-y: hidden !important;
}
/* Compact chips: the row height decides how many events a day can show before
they roll into a '+N more', so every pixel saved here is one more visible. */
:deep(.fc-daygrid-event) {