some edits

KristinaHranovska · Feb 12, 2024 · a72841e · a72841e
1 parent 06538bd
commit a72841e
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 0 deletions.
diff --git a/src/css/modal-window.css b/src/css/modal-window.css
@@ -226,4 +226,8 @@
     .modal-window {
         width: 732px;
     }
+
+    .exer-item {
+        gap: 30px;
+    }
 }
diff --git a/src/js/modal-window.js b/src/js/modal-window.js
@@ -27,6 +27,8 @@ closeIcon.addEventListener('click', closeModal)
 function closeModal() {
     backdrop.classList.add('is-open');
     document.body.style.overflow = '';
+
+    clearModalContent();
 }
 
 // Завантаження сторінки
@@ -73,4 +75,37 @@ function getExercisesObject(id) {
 
         })
         .catch((err) => console.error(err));
+}
+
+// Очіщюємо вміст модалки після закриття
+
+function clearModalContent() {
+    const refs = {
+        img: document.querySelector(".js-img"),
+        title: document.querySelector('.js-title'),
+        raiting: document.querySelector('.js-raiting'),
+        targetValue: document.querySelector('.js-target'),
+        bodyPartValue: document.querySelector('.js-body-part'),
+        equipmentValue: document.querySelector('.js-equipment'),
+        popularValue: document.querySelector('.js-popular'),
+        caloriesValue: document.querySelector('.js-calories'),
+        descriptionValue: document.querySelector('.js-description'),
+    };
+
+    // Встановлюємо пусті значення для всіх елементів модального вікна
+    refs.img.setAttribute('src', '');
+    refs.title.textContent = '';
+    refs.raiting.textContent = '';
+    refs.targetValue.textContent = '';
+    refs.bodyPartValue.textContent = '';
+    refs.equipmentValue.textContent = '';
+    refs.popularValue.textContent = '';
+    refs.caloriesValue.textContent = '';
+    refs.descriptionValue.textContent = '';
+
+    // Очищаємо класи зірок рейтингу
+    const stars = document.querySelectorAll('.raiting-item .icon-star');
+    stars.forEach(star => {
+        star.classList.add('non-activ');
+    });
 }