Add escape to close dropdowns

diff --git a/docs/_javascript/main.js b/docs/_javascript/main.js
index b48aed22e4cc6f42a48ad81ed33c43a1b75478fa..9a45848aa1bca5d2b20776dad1719c49e5cbf1b1 100644 (file)
--- a/docs/_javascript/main.js
+++ b/docs/_javascript/main.js
@@ -7,17 +7,19 @@ document.addEventListener('DOMContentLoaded', () => {
   if ($dropdowns.length > 0) {
     $dropdowns.forEach($el => {
       $el.addEventListener('click', event => {
-        console.log('dropdown', event);
         event.stopPropagation();
         $el.classList.toggle('is-active');
       });
     });
 
     document.addEventListener('click', event => {
-      console.log('document', event);
-      $dropdowns.forEach($el => {
-        $el.classList.remove('is-active');
-      });
+      closeDropdowns();
+    });
+  }
+
+  function closeDropdowns() {
+    $dropdowns.forEach($el => {
+      $el.classList.remove('is-active');
     });
   }
 
@@ -57,20 +59,21 @@ document.addEventListener('DOMContentLoaded', () => {
   if ($modalCloses.length > 0) {
     $modalCloses.forEach($el => {
       $el.addEventListener('click', () => {
-        $html.classList.remove('is-clipped');
         closeModals();
       });
     });
   }
 
-  document.addEventListener('keydown', e => {
+  document.addEventListener('keydown', event => {
+    const e = event || window.event;
     if (e.keyCode === 27) {
-      $html.classList.remove('is-clipped');
       closeModals();
+      closeDropdowns();
     }
   });
 
   function closeModals() {
+    $html.classList.remove('is-clipped');
     $modals.forEach($el => {
       $el.classList.remove('is-active');
     });

diff --git a/docs/lib/main.js b/docs/lib/main.js
index 66b584b11b0d45944ce741699394ade62d1abfc5..1b970f77adad9f60de2946b7a9d1ce8cc04a9dfa 100644 (file)
--- a/docs/lib/main.js
+++ b/docs/lib/main.js
@@ -9,17 +9,19 @@ document.addEventListener('DOMContentLoaded', function () {
   if ($dropdowns.length > 0) {
     $dropdowns.forEach(function ($el) {
       $el.addEventListener('click', function (event) {
-        console.log('dropdown', event);
         event.stopPropagation();
         $el.classList.toggle('is-active');
       });
     });
 
     document.addEventListener('click', function (event) {
-      console.log('document', event);
-      $dropdowns.forEach(function ($el) {
-        $el.classList.remove('is-active');
-      });
+      closeDropdowns();
+    });
+  }
+
+  function closeDropdowns() {
+    $dropdowns.forEach(function ($el) {
+      $el.classList.remove('is-active');
     });
   }
 
@@ -59,20 +61,21 @@ document.addEventListener('DOMContentLoaded', function () {
   if ($modalCloses.length > 0) {
     $modalCloses.forEach(function ($el) {
       $el.addEventListener('click', function () {
-        $html.classList.remove('is-clipped');
         closeModals();
       });
     });
   }
 
-  document.addEventListener('keydown', function (e) {
+  document.addEventListener('keydown', function (event) {
+    var e = event || window.event;
     if (e.keyCode === 27) {
-      $html.classList.remove('is-clipped');
       closeModals();
+      closeDropdowns();
     }
   });
 
   function closeModals() {
+    $html.classList.remove('is-clipped');
     $modals.forEach(function ($el) {
       $el.classList.remove('is-active');
     });