diff --git a/src/css/modal-team.css b/src/css/modal-team.css index 0ce4c30..f1c9995 100644 --- a/src/css/modal-team.css +++ b/src/css/modal-team.css @@ -30,6 +30,7 @@ color: var(--primary-white-color); padding: 40px 20px; transition: transform 0.4s ease; + overflow: auto; } .team-wrapper { @@ -86,6 +87,7 @@ border: 1px solid var(--primary-white-color); border-radius: 30px; padding: 20px; + padding-left: 0; text-align: center; cursor: pointer; transition: 0.4s; @@ -120,7 +122,7 @@ background-color: rgb(8, 8, 8); } */ .active-devel { - background-color: rgba(4, 4, 4, 0.4); + background-color: var(--primary-black-color); } .team-soc-list { display: flex; @@ -181,6 +183,9 @@ max-width: 350px; margin-top: 32px; } + .team-name { + font-size: 20px; + } } /* */ diff --git a/src/js/modal-team.js b/src/js/modal-team.js index 54daa8c..7b4296f 100644 --- a/src/js/modal-team.js +++ b/src/js/modal-team.js @@ -13,16 +13,19 @@ backdrop.addEventListener('click', onBackdropClick); teamList.insertAdjacentHTML('beforeend', createDevMarkup(developers)); const devSocials = [...teamList.children]; +console.log(devSocials); // ! функції відкриття-закриття модалки і скидання стилів девів function onOpenClick() { backdrop.classList.remove('is-hidden'); window.addEventListener('keydown', onEscKeyPress); + document.body.style.overflow = 'hidden'; } function onCloseClick() { backdrop.classList.add('is-hidden'); window.removeEventListener('keydown', onEscKeyPress); + document.body.style.overflow = 'auto'; returnHidden(); } @@ -87,6 +90,7 @@ function onDevClick(e) { const currentMoreArrow = document.querySelector('.arrow-up'); const currentActiveDeveloper = document.querySelector('.active-devel'); + console.log(devClick.firstElementChild); if (currentActiveDeveloper) { currentActiveDeveloper.classList.remove('active-devel'); // devClick.classList.add('active-devel'); @@ -95,10 +99,9 @@ function onDevClick(e) { moreIcon.classList.add('arrow-up'); devClick.classList.add('active-devel'); - // console.log(devClick); if (activeSoc.style.maxHeight) { activeSoc.style.maxHeight = null; - currentMoreArrow.classList.remove('arrow-up'); + devClick.firstElementChild.classList.remove('arrow-up'); } else { activeSoc.style.maxHeight = activeSoc.scrollHeight + 'px'; moreIcon.classList.add('arrow-up');