feat: Allow the modal to close when we click outside the modal content

elixir-lang · May 1, 2024 · c9f9ff2 · c9f9ff2
1 parent f8075a3
commit c9f9ff2
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/assets/js/modal.js b/assets/js/modal.js
@@ -34,6 +34,15 @@ function renderModal () {
   qs(MODAL_CLOSE_BUTTON_SELECTOR).addEventListener('click', event => {
     closeModal()
   })
+
+  qs(MODAL_SELECTOR).addEventListener('click', event => {
+    const classList = event.target.classList
+    // if we clicked on the modal overlay/parent but not the modal content
+    if (classList.contains('modal') && classList.contains('shown') && classList.length === 2) {
+      closeModal()
+    }
+  })
+
 }
 
 /**