program calendar - disable empty sections

assets/css/src/generic.css

@@ -26,6 +26,10 @@
   cursor: progress !important;
 } */
 
+.unvisible {
+  opacity: 0 !important;
+}
+
 .grid {
   --column-gap: calc(var(--space-m) * 1.1);
   --row-gap: calc(var(--space-m) / 2);
@@ -112,7 +116,8 @@
 .arrow-right {
   font-size: 2rem;
   transform: rotate(0deg);
-  transition: transform 0.3s var(--curve-quick);
+  opacity: 1;
+  transition: all 0.3s var(--curve-quick);
 }
 
 .arrow-right.open {

assets/dist/style.css

@@ -233,6 +233,10 @@ input {
   cursor: progress !important;
 } */
 
+.unvisible {
+  opacity: 0 !important;
+}
+
 .grid {
   --column-gap: calc(var(--space-m) * 1.1);
   --row-gap: calc(var(--space-m) / 2);
@@ -319,7 +323,8 @@ input {
 .arrow-right {
   font-size: 2rem;
   transform: rotate(0deg);
-  transition: transform 0.3s var(--curve-quick);
+  opacity: 1;
+  transition: all 0.3s var(--curve-quick);
 }
 
 .arrow-right.open {

site/templates/program.php

@@ -8,6 +8,25 @@
       const urlParams = new URLSearchParams(queryString);
       const tab = urlParams.get('tab');
       return tab;
+    },
+    disableEmptySections() {
+      setTimeout(() => {
+        const sections = document.querySelectorAll('.collapsable')
+        sections.forEach(section => {
+          const sessions = section.querySelector('.sessions li')
+          const toggleBtn = section.querySelector('.toggle')
+
+          if (sessions) {
+            toggleBtn.removeAttribute('disabled')
+            toggleBtn.setAttribute('title', '')
+            toggleBtn.querySelector('.arrow-right').classList.remove('unvisible')
+          } else {
+            toggleBtn.setAttribute('disabled', true)
+            toggleBtn.setAttribute('title', 'aucune séance')
+            toggleBtn.querySelector('.arrow-right').classList.add('unvisible')
+          }
+        })
+      })
     }
   }"
 >
@@ -16,6 +35,12 @@
       tab: setInitialTab(),
       filter: null
     }"
+    x-init="
+      disableEmptySections()
+      $watch('tab', value => {
+        disableEmptySections()
+      })
+    "
   >