script.js

'use strict';
const modal = document.querySelector('.modal');
const overlay = document.querySelector('.overlay');
const closeModal = document.querySelector('.close-modal');
const showModal = document.querySelectorAll('.show-modal');

const closingModal = function () {
  modal.classList.add('hidden');
  overlay.classList.add('hidden');
};

const openingModal = function () {
  modal.classList.remove('hidden');
  overlay.classList.remove('hidden');
};

for (let i = 0; i < showModal.length; i++) {
  showModal[i].addEventListener('click', openingModal);
}

closeModal.addEventListener('click', closingModal);

overlay.addEventListener('click', closingModal);

document.addEventListener('keydown', function (e) {
  console.log(e.key);
  if (e.key === 'Escape' && !modal.classList.contains('hidden')) {
    closingModal();
  }
});