TOGGLE CARD

NASA-IMPACT · Dec 30, 2024 · 61882e4 · 61882e4
1 parent 3736f7b
commit 61882e4
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 0 deletions.
diff --git a/_tabs/Assessment.md b/_tabs/Assessment.md
@@ -681,8 +681,26 @@ order: 3
 </div>
 
 <script>
+/**
+ * Toggles the expanded/collapsed state of a card
+ * @param {HTMLElement} header - The header element that was clicked
+ */
 function toggleCard(header) {
+    // Toggle active class on header
     header.classList.toggle('active');
+
+    // Toggle active class on content section
+    const content = header.nextElementSibling;
+    content.classList.toggle('active');
+
+    // Close other open cards
+    const allHeaders = document.querySelectorAll('.card-header');
+    allHeaders.forEach(otherHeader => {
+        if (otherHeader !== header && otherHeader.classList.contains('active')) {
+            otherHeader.classList.remove('active');
+            otherHeader.nextElementSibling.classList.remove('active');
+        }
+    });
 }
 
 function showTab(tabName) {

diff --git a/_tabs/SEP.md b/_tabs/SEP.md
@@ -263,6 +263,30 @@ function showTab(tabName) {
 </script>
 
 <style>
+<!-- JavaScript for card toggling -->
+<script>
+/**
+ * Toggles the expanded/collapsed state of a card
+ * @param {HTMLElement} header - The header element that was clicked
+ */
+function toggleCard(header) {
+    // Toggle active class on header
+    header.classList.toggle('active');
+
+    // Toggle active class on content section
+    const content = header.nextElementSibling;
+    content.classList.toggle('active');
+
+    // Close other open cards
+    const allHeaders = document.querySelectorAll('.card-header');
+    allHeaders.forEach(otherHeader => {
+        if (otherHeader !== header && otherHeader.classList.contains('active')) {
+            otherHeader.classList.remove('active');
+            otherHeader.nextElementSibling.classList.remove('active');
+        }
+    });
+}
+
     /* Base styles from Overview page */
 body {
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;