From 988788b7c0f404c45289bae3888d883422bfa0af Mon Sep 17 00:00:00 2001 From: johnnyq Date: Thu, 27 Aug 2026 23:50:19 -0400 Subject: [PATCH] Add height placeholder to calendar to reduce jankiness on load --- css/itflow_custom.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/css/itflow_custom.css b/css/itflow_custom.css index 5e72ada8a..927992f21 100644 --- a/css/itflow_custom.css +++ b/css/itflow_custom.css @@ -1184,6 +1184,22 @@ select.select2[multiple]:not(.tomselected) { matches in BOTH modes rather than being a near-black (#030712) panel next to a #212529 page, and so events and the toolbar follow the theme accent. */ #calendar { + /* Reserve the calendar's final height before it exists. + + agent/calendar.php renders an empty
and + FullCalendar only fills it on DOMContentLoaded - which cannot happen + until every parser-blocking script has run, including the 777KB + fullcalendar.global.js that loads after the footer. Until then the div + is zero pixels tall, so the page paints with no calendar and then snaps + to full height, shoving everything below it down. That jump is the + flash. + + 90vh is not a guess: it is the exact `height: '90vh'` the calendar is + configured with in calendar.php, set outside the mobile branch so it + applies on both. Matching it here means the box is the right size from + first paint and nothing moves when the widget arrives. */ + min-height: 90vh; + --fc-classic-background: var(--bs-body-bg); --fc-classic-foreground: var(--bs-body-color); --fc-classic-muted-foreground: var(--bs-secondary-color);