add responsiveness to calendar

Tubo · Jun 20, 2024 · 46d2b60 · 46d2b60
1 parent f2176c5
commit 46d2b60
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/radscheduler/static/js/calendar.js b/radscheduler/static/js/calendar.js
@@ -9,6 +9,14 @@ const calendarEl = document.getElementById('calendar');
 let calendar = new Calendar(calendarEl, {
     plugins: [dayGridPlugin, listPlugin, bootstrap5Plugin],
     initialView: window.innerWidth > 768 ? 'dayGridMonth' : 'listWeek',
+    windowResize: function (view) {
+        // If the window is resized to a width greater than 768px, change the view to dayGridMonth
+        if (window.innerWidth > 768) {
+            calendar.changeView('dayGridMonth');
+        } else {
+            calendar.changeView('listWeek');
+        }
+    },
     themeSystem: 'bootstrap5',
     events: "/api/calendar/events/",
     locale: nzLocale,