Andrei | поместил скрипты относящиеся к модалкам в файл модуль popup, удалил дублирущийся js вызова модалок
parent
7825f00ae6
commit
cca90266dc
@ -1,166 +0,0 @@ |
|||||||
// 'use strict';
|
|
||||||
|
|
||||||
// // Глобальные переменные для управления состоянием
|
|
||||||
// let currentModalContent = null;
|
|
||||||
|
|
||||||
// function modalOpen(buttonElement, contentElement) {
|
|
||||||
// const modal = document.querySelector('.modal');
|
|
||||||
// const aside = document.querySelector('.modal__aside');
|
|
||||||
// const elements = document.querySelectorAll(buttonElement);
|
|
||||||
// const device = window.screen.width;
|
|
||||||
|
|
||||||
// // Обработчик закрытия по клику на оверлей
|
|
||||||
// modal.addEventListener('click', function(e) {
|
|
||||||
// if (e.target === modal && currentModalContent) {
|
|
||||||
// closeModal(currentModalContent);
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// // Обработчик закрытия по Escape
|
|
||||||
// document.addEventListener('keydown', function(e) {
|
|
||||||
// if (e.key === 'Escape' && currentModalContent) {
|
|
||||||
// closeModal(currentModalContent);
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// e.addEventListener('click', function() {
|
|
||||||
// const content = document.querySelector(contentElement);
|
|
||||||
// currentModalContent = content;
|
|
||||||
|
|
||||||
// // Сброс стилей перед открытием
|
|
||||||
// resetModalStyles();
|
|
||||||
|
|
||||||
// modal.classList.add('active');
|
|
||||||
// content.classList.add('active');
|
|
||||||
|
|
||||||
// const width = content.clientWidth;
|
|
||||||
|
|
||||||
// setTimeout(() => {
|
|
||||||
// if (device <= 720) {
|
|
||||||
// aside.style.width = `${device}px`;
|
|
||||||
// } else {
|
|
||||||
// aside.style.width = `${width}px`;
|
|
||||||
// }
|
|
||||||
// content.style.opacity = '1';
|
|
||||||
// content.style.filter = 'blur(0)';
|
|
||||||
// }, 10);
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function modalClose(buttonElement) {
|
|
||||||
// const elements = document.querySelectorAll(buttonElement);
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// e.addEventListener('click', function() {
|
|
||||||
// if (currentModalContent) {
|
|
||||||
// closeModal(currentModalContent);
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function closeModal(contentElement) {
|
|
||||||
// const modal = document.querySelector('.modal');
|
|
||||||
// const aside = document.querySelector('.modal__aside');
|
|
||||||
|
|
||||||
// aside.style.width = '0';
|
|
||||||
// contentElement.style.opacity = '0';
|
|
||||||
// contentElement.style.filter = 'blur(10px)';
|
|
||||||
|
|
||||||
// setTimeout(() => {
|
|
||||||
// contentElement.classList.remove('active');
|
|
||||||
// modal.classList.remove('active');
|
|
||||||
// currentModalContent = null;
|
|
||||||
// }, 300);
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function resetModalStyles() {
|
|
||||||
// const allModals = document.querySelectorAll('.modal__item');
|
|
||||||
|
|
||||||
// allModals.forEach(modal => {
|
|
||||||
// modal.style.opacity = '';
|
|
||||||
// modal.style.filter = '';
|
|
||||||
// modal.classList.remove('active');
|
|
||||||
// });
|
|
||||||
|
|
||||||
// document.querySelector('.modal__aside').style.width = '';
|
|
||||||
// }
|
|
||||||
// function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) {
|
|
||||||
// let elements = document.querySelectorAll(mainElement);
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// let thisMainElement = e,
|
|
||||||
// thisButtonElement = e.querySelector(buttonElement),
|
|
||||||
// thisHeightElement = e.querySelector(heightElement),
|
|
||||||
// thisContentElement = e.querySelector(contentElement);
|
|
||||||
|
|
||||||
// thisButtonElement.onclick = function (e) {
|
|
||||||
// let height = thisHeightElement.clientHeight;
|
|
||||||
|
|
||||||
// if (close == true && !thisMainElement.classList.contains('active')) {
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// if (e.classList.contains('active')) {
|
|
||||||
// e.classList.remove('active');
|
|
||||||
// e.querySelector(contentElement).style.height = null
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (!thisMainElement.classList.contains('active')) {
|
|
||||||
// thisContentElement.style.height = `${height}px`;
|
|
||||||
// thisMainElement.classList.add('active');
|
|
||||||
// }else{
|
|
||||||
// thisContentElement.style.height = null;
|
|
||||||
// thisMainElement.classList.remove('active');
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function toggleHeader(button, content, blockheight, removeBlock, removeClass) {
|
|
||||||
// let thisButton = document.querySelector(button),
|
|
||||||
// thisContent = document.querySelector(content),
|
|
||||||
// thisRemoveBlock = document.querySelector(removeBlock) || '',
|
|
||||||
// thisBlockheight = document.querySelector(blockheight);
|
|
||||||
|
|
||||||
// thisButton.onclick = function () {
|
|
||||||
// let height = thisBlockheight.clientHeight;
|
|
||||||
|
|
||||||
// if (!thisContent.classList .contains('open')) {
|
|
||||||
// thisContent.style.height = `${height}px`;
|
|
||||||
// thisContent.classList .add('open');
|
|
||||||
|
|
||||||
// if (removeBlock) {
|
|
||||||
// thisRemoveBlock.classList.remove(removeClass);
|
|
||||||
// }
|
|
||||||
// }else{
|
|
||||||
// thisContent.style.height = null;
|
|
||||||
// thisContent.classList .remove('open');
|
|
||||||
|
|
||||||
// if (removeBlock) {
|
|
||||||
// if (window.scrollY <= 25) {
|
|
||||||
// thisRemoveBlock.classList.add(removeClass);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function modalFormOpen(formOrNotification) {
|
|
||||||
// let buttons = document.querySelectorAll(formOrNotification),
|
|
||||||
// modal = document.querySelector('.modal');
|
|
||||||
|
|
||||||
// buttons.forEach(button => {
|
|
||||||
// button.onclick = function (eventButton) {
|
|
||||||
// let classOpenForm = button.dataset.form,
|
|
||||||
// form = modal.querySelector(`.${classOpenForm}`);
|
|
||||||
|
|
||||||
// form.classList.add('active');
|
|
||||||
// modal.classList.add('active');
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
// // function
|
|
||||||
@ -1,154 +0,0 @@ |
|||||||
/* Footer */ |
|
||||||
.footer { |
|
||||||
background: var(--main_black); |
|
||||||
padding: 40px 0 38px; |
|
||||||
color: var(--main_white); |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top { |
|
||||||
display: flex; |
|
||||||
align-items: stretch; |
|
||||||
justify-content: space-between; |
|
||||||
gap: 48px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top .logo { |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
gap: 10px; |
|
||||||
font-size: 20px; |
|
||||||
font-weight: 500; |
|
||||||
text-transform: uppercase; |
|
||||||
background: var(--accent-1); |
|
||||||
color: transparent; |
|
||||||
-webkit-background-clip: text; |
|
||||||
background-clip: text; |
|
||||||
margin-bottom: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content__address { |
|
||||||
font-size: 24px; |
|
||||||
font-weight: 500; |
|
||||||
line-height: 32px; |
|
||||||
margin-bottom: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content { |
|
||||||
width: 100%; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul { |
|
||||||
display: flex; |
|
||||||
flex-direction: column; |
|
||||||
gap: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul li { |
|
||||||
display: flex; |
|
||||||
flex-direction: column; |
|
||||||
gap: 4px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul p { |
|
||||||
font-size: 16px; |
|
||||||
font-weight: bold; |
|
||||||
line-height: 20px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul a { |
|
||||||
font-size: 24px; |
|
||||||
font-weight: 500; |
|
||||||
line-height: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content__wrap { |
|
||||||
display: flex; |
|
||||||
align-items: flex-end; |
|
||||||
justify-content: space-between; |
|
||||||
width: 100%; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top__link { |
|
||||||
display: flex; |
|
||||||
flex-direction: column; |
|
||||||
gap: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top__link .link-black { |
|
||||||
padding: 7px 15px; |
|
||||||
color: var(--main_white); |
|
||||||
font-size: 24px; |
|
||||||
line-height: 32px; |
|
||||||
font-weight: 500; |
|
||||||
white-space: nowrap; |
|
||||||
border: 1px solid var(--main_white); |
|
||||||
border-radius: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top__link .link-white { |
|
||||||
width: 100%; |
|
||||||
text-align: center; |
|
||||||
background: var(--main_white); |
|
||||||
color: var(--main_black); |
|
||||||
font-size: 20px; |
|
||||||
font-weight: 600; |
|
||||||
line-height: 24px; |
|
||||||
padding: 12px; |
|
||||||
border-radius: 20px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-contact { |
|
||||||
width: 364px; |
|
||||||
flex-shrink: 0; |
|
||||||
background: var(--accent-1); |
|
||||||
border-radius: 24px; |
|
||||||
padding: 24px; |
|
||||||
display: flex; |
|
||||||
flex-direction: column; |
|
||||||
gap: 16px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-contact__title { |
|
||||||
color: var(--main_black); |
|
||||||
font-size: 24px; |
|
||||||
font-weight: 500; |
|
||||||
line-height: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-contact__submit { |
|
||||||
width: 100%; |
|
||||||
text-align: center; |
|
||||||
height: 48px; |
|
||||||
border-radius: 16px; |
|
||||||
background: var(--main_black); |
|
||||||
font-size: 20px; |
|
||||||
font-weight: 600; |
|
||||||
line-height: 24px; |
|
||||||
color: var(--main_white); |
|
||||||
} |
|
||||||
|
|
||||||
.footer-bottom { |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
justify-content: space-between; |
|
||||||
padding-top: 17px; |
|
||||||
margin-top: 19px; |
|
||||||
border-top: 1px solid var(--main_white); |
|
||||||
} |
|
||||||
|
|
||||||
.footer-network { |
|
||||||
display: flex; |
|
||||||
align-items: center; |
|
||||||
gap: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-bottom a { |
|
||||||
font-size: 16px; |
|
||||||
line-height: 20px; |
|
||||||
font-weight: 500; |
|
||||||
color: var(--main_white); |
|
||||||
opacity: 0.6; |
|
||||||
text-decoration: underline; |
|
||||||
} |
|
||||||
/* Footer end */ |
|
||||||
|
|
||||||
@ -1,68 +0,0 @@ |
|||||||
/* Стили для мобильных устройств */ |
|
||||||
@media only screen and (max-width: 576px) { |
|
||||||
.footer { |
|
||||||
padding: 24px 0 58px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top { |
|
||||||
align-items: flex-start; |
|
||||||
text-align: left; |
|
||||||
gap: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content__wrap { |
|
||||||
align-items: flex-start; |
|
||||||
gap: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content { |
|
||||||
align-items: flex-start; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content .logo { |
|
||||||
font-size: 20px; |
|
||||||
margin-bottom: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content__address { |
|
||||||
font-size: 18px; |
|
||||||
line-height: 24px; |
|
||||||
margin-bottom: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul { |
|
||||||
gap: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul p { |
|
||||||
font-size: 16px; |
|
||||||
line-height: 20px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-content ul a { |
|
||||||
font-size: 24px; |
|
||||||
line-height: 32px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-top__link .link-white { |
|
||||||
display: none; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-contact { |
|
||||||
width: 100%; |
|
||||||
padding: 16px; |
|
||||||
border-radius: 24px; |
|
||||||
} |
|
||||||
|
|
||||||
.footer-contact__title { |
|
||||||
color: var(--main_white); |
|
||||||
} |
|
||||||
|
|
||||||
.footer-bottom { |
|
||||||
margin-top: 0; |
|
||||||
padding-top: 24px; |
|
||||||
border: 0; |
|
||||||
align-items: flex-start; |
|
||||||
gap: 17px; |
|
||||||
} |
|
||||||
} |
|
||||||
@ -1,4 +0,0 @@ |
|||||||
/* Стили для планшетов */ |
|
||||||
@media only screen and (max-width: 992px) { |
|
||||||
|
|
||||||
} |
|
||||||
@ -0,0 +1,116 @@ |
|||||||
|
// modal
|
||||||
|
modalOpen('.button--filter', '.modal__filter'); |
||||||
|
modalOpen('.basket-open', '.modal__basket'); |
||||||
|
modalOpen('.open-to-know', '.modal__to-know'); |
||||||
|
modalOpen('.login-open', '.modal__login'); |
||||||
|
modalClose('.modal__close'); |
||||||
|
|
||||||
|
let modal = document.querySelector('.modal'); |
||||||
|
|
||||||
|
modal.onclick = function (event) { |
||||||
|
let target = event.target; |
||||||
|
if (target.classList.contains('modal')) { |
||||||
|
closeAllModals(); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// function
|
||||||
|
function modalOpen(buttonElement, contentElement){ |
||||||
|
let modal = document.querySelector('.modal'), |
||||||
|
aside = document.querySelector('.modal__aside'), |
||||||
|
elements = document.querySelectorAll(buttonElement), |
||||||
|
device = window.screen.width, |
||||||
|
body = document.querySelector('body'); |
||||||
|
|
||||||
|
elements.forEach(e => { |
||||||
|
let thisContentElement = document.querySelector(contentElement); |
||||||
|
|
||||||
|
e.onclick = function () { |
||||||
|
body.classList.add('overflow-hidden'); |
||||||
|
modal.classList.add('active'); |
||||||
|
thisContentElement.classList.add('active'); |
||||||
|
|
||||||
|
let width = thisContentElement.clientWidth; |
||||||
|
if (width < 400){ |
||||||
|
width = 400 |
||||||
|
} |
||||||
|
setTimeout(() => { |
||||||
|
if (device <= 720) { |
||||||
|
aside.style.width = `${device}px`; |
||||||
|
thisContentElement.style.opacity = 1; |
||||||
|
thisContentElement.style.filter = 'blur(0px)'; |
||||||
|
}else{ |
||||||
|
|
||||||
|
aside.style.width = `${width}px`; |
||||||
|
thisContentElement.style.opacity = 1; |
||||||
|
thisContentElement.style.filter = 'blur(0px)'; |
||||||
|
} |
||||||
|
}, 10); |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
function closeAllModals() { |
||||||
|
let modal = document.querySelector('.modal'), |
||||||
|
aside = document.querySelector('.modal__aside'), |
||||||
|
asideItems = document.querySelectorAll('.modal__item'), |
||||||
|
body = document.querySelector('body'); |
||||||
|
|
||||||
|
aside.style.width = '0px'; |
||||||
|
body.classList.remove('overflow-hidden'); |
||||||
|
|
||||||
|
asideItems.forEach(item => { |
||||||
|
if (item.classList.contains('active')) { |
||||||
|
item.style.opacity = 0; |
||||||
|
item.style.filter = 'blur(10px)'; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
setTimeout(() => { |
||||||
|
asideItems.forEach(item => { |
||||||
|
item.classList.remove('active'); |
||||||
|
}); |
||||||
|
modal.classList.remove('active'); |
||||||
|
}, 300); |
||||||
|
} |
||||||
|
|
||||||
|
function modalClose(buttonElement) { |
||||||
|
let elements = document.querySelectorAll(buttonElement); |
||||||
|
elements.forEach(e => { |
||||||
|
e.onclick = closeAllModals; |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
// resize
|
||||||
|
window.addEventListener('resize', (e) => { |
||||||
|
let width = window.screen.width; |
||||||
|
|
||||||
|
// media
|
||||||
|
modalOpen('.button--filter', '.modal__filter'); |
||||||
|
modalOpen('.basket-open', '.modal__basket'); |
||||||
|
modalOpen('.open-to-know', '.modal__to-know'); |
||||||
|
modalOpen('.login-open', '.modal__login'); |
||||||
|
modalClose('.modal__close'); |
||||||
|
|
||||||
|
let modalItem = document.querySelectorAll('.modal__item'); |
||||||
|
|
||||||
|
// if (width <= 720) {
|
||||||
|
modalItem.forEach(modal => { |
||||||
|
if (modal.classList.contains('active')) { |
||||||
|
let aside = document.querySelector('.modal__aside'); |
||||||
|
|
||||||
|
if (width <= 720) { |
||||||
|
aside.style.width = `${width}px` |
||||||
|
}else{ |
||||||
|
let openAside = document.querySelector('.modal__item.active'), |
||||||
|
newWidth = openAside.clientWidth; |
||||||
|
if (newWidth < 400){ |
||||||
|
newWidth = 400 |
||||||
|
} |
||||||
|
aside.style.width = `${newWidth}px` |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
// }
|
||||||
|
}); |
||||||
|
// resize
|
||||||
@ -1,156 +0,0 @@ |
|||||||
// 'use strict';
|
|
||||||
|
|
||||||
// // function
|
|
||||||
// function modalOpen(buttonElement, contentElement){
|
|
||||||
// let modal = document.querySelector('.modal'),
|
|
||||||
// aside = document.querySelector('.modal__aside'),
|
|
||||||
// elements = document.querySelectorAll(buttonElement),
|
|
||||||
// device = window.screen.width;
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// let thisContentElement = document.querySelector(contentElement);
|
|
||||||
|
|
||||||
// e.onclick = function () {
|
|
||||||
// modal.classList.add('active');
|
|
||||||
// thisContentElement.classList.add('active');
|
|
||||||
|
|
||||||
// let width = thisContentElement.clientWidth;
|
|
||||||
|
|
||||||
// setTimeout(() => {
|
|
||||||
// if (device <= 720) {
|
|
||||||
// aside.style.width = `${device}px`;
|
|
||||||
// thisContentElement.style.opacity = 1;
|
|
||||||
// thisContentElement.style.filter = 'blur(0px)';
|
|
||||||
// }else{
|
|
||||||
// aside.style.width = `${width}px`;
|
|
||||||
// thisContentElement.style.opacity = 1;
|
|
||||||
// thisContentElement.style.filter = 'blur(0px)';
|
|
||||||
// }
|
|
||||||
// }, 10);
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function modalClose(buttonElement) {
|
|
||||||
// let modal = document.querySelector('.modal'),
|
|
||||||
// aside = document.querySelector('.modal__aside'),
|
|
||||||
// asideItems = document.querySelectorAll('.modal__item'),
|
|
||||||
// elements = document.querySelectorAll(buttonElement);
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// e.onclick = function () {
|
|
||||||
// aside.style.width = '0px';
|
|
||||||
|
|
||||||
// asideItems.forEach(e => {
|
|
||||||
// if (e.classList.contains('active')) {
|
|
||||||
// e.style.filter = 'blur(10px)';
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// setTimeout(() => {
|
|
||||||
// asideItems.forEach(e => {
|
|
||||||
// if (e.classList.contains('active')) {
|
|
||||||
// e.classList.remove('active');
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// modal.classList.remove('active');
|
|
||||||
// }, 300);
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function closeModalForm(close){
|
|
||||||
// let buttons = document.querySelectorAll(close),
|
|
||||||
// modal = document.querySelector('.modal');
|
|
||||||
|
|
||||||
// buttons.forEach(button => {
|
|
||||||
// button.onclick = function (buttonEvent) {
|
|
||||||
// modal.classList.remove('active');
|
|
||||||
|
|
||||||
// if (!modal.querySelector('.modal-map.active')) {
|
|
||||||
// modal.querySelector('.modal-form.active').classList.remove('active');
|
|
||||||
// }else{
|
|
||||||
// modal.querySelector('.modal-map.active').classList.remove('active');
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function toggleOpenX(mainElement, buttonElement ,heightElement, contentElement, close) {
|
|
||||||
// let elements = document.querySelectorAll(mainElement);
|
|
||||||
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// let thisMainElement = e,
|
|
||||||
// thisButtonElement = e.querySelector(buttonElement),
|
|
||||||
// thisHeightElement = e.querySelector(heightElement),
|
|
||||||
// thisContentElement = e.querySelector(contentElement);
|
|
||||||
|
|
||||||
// thisButtonElement.onclick = function (e) {
|
|
||||||
// let height = thisHeightElement.clientHeight;
|
|
||||||
|
|
||||||
// if (close == true && !thisMainElement.classList.contains('active')) {
|
|
||||||
// elements.forEach(e => {
|
|
||||||
// if (e.classList.contains('active')) {
|
|
||||||
// e.classList.remove('active');
|
|
||||||
// e.querySelector(contentElement).style.height = null
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (!thisMainElement.classList.contains('active')) {
|
|
||||||
// thisContentElement.style.height = `${height}px`;
|
|
||||||
// thisMainElement.classList.add('active');
|
|
||||||
// }else{
|
|
||||||
// thisContentElement.style.height = null;
|
|
||||||
// thisMainElement.classList.remove('active');
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function toggleHeader(button, content, blockheight, removeBlock, removeClass) {
|
|
||||||
// let thisButton = document.querySelector(button),
|
|
||||||
// thisContent = document.querySelector(content),
|
|
||||||
// thisRemoveBlock = document.querySelector(removeBlock) || '',
|
|
||||||
// thisBlockheight = document.querySelector(blockheight);
|
|
||||||
|
|
||||||
// thisButton.onclick = function () {
|
|
||||||
// let height = thisBlockheight.clientHeight;
|
|
||||||
|
|
||||||
// if (!thisContent.classList .contains('open')) {
|
|
||||||
// thisContent.style.height = `${height}px`;
|
|
||||||
// thisContent.classList .add('open');
|
|
||||||
|
|
||||||
// if (removeBlock) {
|
|
||||||
// thisRemoveBlock.classList.remove(removeClass);
|
|
||||||
// }
|
|
||||||
// }else{
|
|
||||||
// thisContent.style.height = null;
|
|
||||||
// thisContent.classList .remove('open');
|
|
||||||
|
|
||||||
// if (removeBlock) {
|
|
||||||
// if (window.scrollY <= 25) {
|
|
||||||
// thisRemoveBlock.classList.add(removeClass);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function modalFormOpen(formOrNotification) {
|
|
||||||
// let buttons = document.querySelectorAll(formOrNotification),
|
|
||||||
// modal = document.querySelector('.modal');
|
|
||||||
|
|
||||||
// buttons.forEach(button => {
|
|
||||||
// button.onclick = function (eventButton) {
|
|
||||||
// let classOpenForm = button.dataset.form,
|
|
||||||
// form = modal.querySelector(`.${classOpenForm}`);
|
|
||||||
|
|
||||||
// form.classList.add('active');
|
|
||||||
// modal.classList.add('active');
|
|
||||||
// }
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
// // function
|
|
||||||
Loading…
Reference in new issue