Week calendar: Collapse days on mobile (except the current day)

src/pretix/static/pretixpresale/js/ui/main.js

@@ -439,6 +439,14 @@ $(function () {
         }
     });
 
+    // Week calendar
+    // On mobile, auto-collapse all days except today
+    if ($(window).width() < 992) {
+        $(".week-calendar .weekday:not(.today)").each(function () {
+            $(this).prop("open", false);
+        });
+    }
+
     // Lightbox
     lightbox.init();
 });
@@ -480,4 +488,4 @@ function copy_answers(elements, answers) {
         }
     });
     questions_toggle_dependent(true);
-}
+}

src/pretix/static/pretixpresale/scss/_calendar.scss

@@ -80,6 +80,16 @@
   h3 {
     margin-bottom: 5px;
     font-weight: bold;
+    cursor: pointer;
+  }
+  h3 .fa::before {
+    content: $fa-var-caret-right;
+  }
+  details[open] h3 .fa::before {
+    content: $fa-var-caret-down;
+  }
+  .events {
+    overflow: hidden;  /* required for smooth toggle animation */
   }
   .no-events {
     display: none;
@@ -90,6 +100,14 @@
     display: flex;
     flex-direction: row;
 
+    details[open] summary {
+      cursor: default;
+      pointer-events: none;
+      h3 .fa {
+        display: none;
+      }
+    }
+
     .weekday {
       flex: 1;
       margin: 0 5px;
@@ -128,4 +146,4 @@
    .select-calendar-week-short {
      max-width: 50%;
    }
-}
+}