fix: Improve modal event binding and close button functionality

- Remove inline onclick attribute from close button
- Add ID-based event listener binding in DOMContentLoaded
- Add preventDefault and stopPropagation to close handler
- Add console logging for debugging
- Add null checks for modal elements

static/js/detail-modal.js

@@ -207,22 +207,37 @@ function closeDetailModal() {
     modal.classList.remove('active');
 }
 
-// Close modal when clicking outside
+// Initialize modal event listeners
 document.addEventListener('DOMContentLoaded', () => {
     const modal = document.getElementById('detail-modal');
+    const closeBtn = document.getElementById('modal-close-btn');
 
-    modal.addEventListener('click', (e) => {
-        if (e.target === modal) {
+    // Close button click
+    if (closeBtn) {
+        closeBtn.addEventListener('click', (e) => {
+            e.preventDefault();
+            e.stopPropagation();
             closeDetailModal();
-        }
-    });
+        });
+    }
 
-    // Close on escape key
+    // Click outside modal
+    if (modal) {
+        modal.addEventListener('click', (e) => {
+            if (e.target === modal) {
+                closeDetailModal();
+            }
+        });
+    }
+
+    // Escape key
     document.addEventListener('keydown', (e) => {
-        if (e.key === 'Escape' && modal.classList.contains('active')) {
+        if (e.key === 'Escape' && modal && modal.classList.contains('active')) {
             closeDetailModal();
         }
     });
+
+    console.log('Detail modal initialized');
 });
 
 // Export for use in other modules