сделал js для открытия меню

This commit is contained in:
Kirill Pet
2024-12-19 15:57:28 +03:00
parent ce39d4028e
commit f32e1eb3fb
5 changed files with 385 additions and 26 deletions

View File

@@ -97,7 +97,6 @@
<div class="header-phone__item">
<div class="button-menu">
<img src="/assets/img/icon/menu-hamburger.svg" class="button-menu__open" alt="open">
<img src="/assets/img/icon/close.svg" class="button-menu__close" alt="close">
</div>
</div>
</div>
@@ -136,18 +135,20 @@
<div class="phone-menu">
<div class="phone-menu__block-content">
<div class="phone-menu__content">
<div class="phone-menu__block-content main">
<div class="phone-menu__content main">
<button class="phone-menu-content__close"></button>
<ul class="phone-menu__list">
<li>
<a href="#">спецификация</a>
</li>
<li>О компании</li>
<li>
<a href="#" class="phone-menu--next">каталог</a>
<a href="#" class="phone-menu--next" data-menu="catalog">каталог</a>
</li>
<li>
<a href="#" class="phone-menu--next">бренды</a>
<a href="#" class="phone-menu--next" data-menu="brand">бренды</a>
</li>
<li>зонирование</li>
<li>проекты</li>
@@ -183,6 +184,157 @@
</div>
</div>
</div>
<div class="phone-menu__sub catalog">
<div class="phone-menu__content">
<button class="phone-menu-content__close"></button>
<ul class="phone-menu__list">
<li>
<a href="#">спецификация</a>
</li>
<li>О компании</li>
<li>
<a href="#" class="phone-menu--next" data-menu="cardio">каталог</a>
</li>
<li>
<a href="#" class="phone-menu--next">бренды</a>
</li>
<li>зонирование</li>
<li>проекты</li>
<li>интересное</li>
<li>контакты</li>
</ul>
<div class="phone-menu__block">
<p class="phone-menu__text">
Работаем с гос.заказчиками по<br>
<a href="">44-ФЗ/223-ФЗ</a>
</p>
<a class="phone-menu__text phone-menu__text--no-line" href="tel:+74957988081">+7 (495) 798-80-81</a>
<a class="phone-menu__text phone-menu__text--no-line" href="mailto:sales@bestinfitness.ru">sales@bestinfitness.ru</a>
<div class="phone-social">
<a href="#" class="btn-social">
<img src="/assets/img/social/telegram.svg" alt="">
</a>
<a href="#" class="btn-social">
<img src="/assets/img/social/whatsapp.svg" alt="">
</a>
</div>
</div>
<div class="phone-menu__block">
<a href="#" class="btn-big btn-big--border btn-big--border--blood">
Заказать звонок
</a>
</div>
</div>
</div>
<div class="phone-menu__sub brand">
<div class="phone-menu__content">
<button class="phone-menu-content__close"></button>
<ul class="phone-menu__list">
<li>
<a href="#">спецификация</a>
</li>
<li>О компании</li>
<li>
<a href="#" class="phone-menu--next" data-menu="cardio">каталог</a>
</li>
<li>
<a href="#" class="phone-menu--next">бренды</a>
</li>
<li>зонирование</li>
<li>проекты</li>
<li>интересное</li>
<li>контакты</li>
</ul>
<div class="phone-menu__block">
<p class="phone-menu__text">
Работаем с гос.заказчиками по<br>
<a href="">44-ФЗ/223-ФЗ</a>
</p>
<a class="phone-menu__text phone-menu__text--no-line" href="tel:+74957988081">+7 (495) 798-80-81</a>
<a class="phone-menu__text phone-menu__text--no-line" href="mailto:sales@bestinfitness.ru">sales@bestinfitness.ru</a>
<div class="phone-social">
<a href="#" class="btn-social">
<img src="/assets/img/social/telegram.svg" alt="">
</a>
<a href="#" class="btn-social">
<img src="/assets/img/social/whatsapp.svg" alt="">
</a>
</div>
</div>
<div class="phone-menu__block">
<a href="#" class="btn-big btn-big--border btn-big--border--blood">
Заказать звонок
</a>
</div>
</div>
</div>
<div class="phone-menu__sub cardio">
<div class="phone-menu__content">
<button class="phone-menu-content__close"></button>
<ul class="phone-menu__list">
<li>
<a href="#">спецификация</a>
</li>
<li>О компании</li>
<li>
<a href="#" class="phone-menu--next">каталог</a>
</li>
<li>
<a href="#" class="phone-menu--next">бренды</a>
</li>
<li>зонирование</li>
<li>проекты</li>
<li>интересное</li>
<li>контакты</li>
</ul>
<div class="phone-menu__block">
<p class="phone-menu__text">
Работаем с гос.заказчиками по<br>
<a href="">44-ФЗ/223-ФЗ</a>
</p>
<a class="phone-menu__text phone-menu__text--no-line" href="tel:+74957988081">+7 (495) 798-80-81</a>
<a class="phone-menu__text phone-menu__text--no-line" href="mailto:sales@bestinfitness.ru">sales@bestinfitness.ru</a>
<div class="phone-social">
<a href="#" class="btn-social">
<img src="/assets/img/social/telegram.svg" alt="">
</a>
<a href="#" class="btn-social">
<img src="/assets/img/social/whatsapp.svg" alt="">
</a>
</div>
</div>
<div class="phone-menu__block">
<a href="#" class="btn-big btn-big--border btn-big--border--blood">
Заказать звонок
</a>
</div>
</div>
</div>
</div>
</header>
@@ -981,6 +1133,109 @@
</div>
</footer>
<div class="modal">
<div class="modal__item">
<p class="title-1">
Получи проект бесплатно
</p>
<form class="form" method="post" action="/send-telegram.php">
<div class="form__item">
<div class="input__block">
<input class="input__field" type="text" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">Имя</label>
<span class="input__error">Имя введено не верно</span>
</div>
</div>
<div class="form__item form__item--two">
<div class="input__block">
<input class="input__field" type="phone" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">Телефон</label>
<span class="input__error">Телефон введен не верно</span>
</div>
<div class="input__block">
<input class="input__field" type="email" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">E-mail</label>
<span class="input__error">E-mail введен не верно</span>
</div>
</div>
<div class="form__additional">
<input type="file" id="free__file">
<label for="free__file" class="form__file">
<button href="#" class="btn-social form__mini-btn">
<img src="/assets/img/icon/paper-clip.svg" alt="">
</button>
<p class="form-additional__text text-3">Загрузить свой проект на просчет</p>
</label>
</div>
<div class="form__additional">
<label for="free__agreement" class="form__checkbox-block">
<input type="checkbox" id="free__agreement" class="form__checkbox" required="">
<div class="form-checkbox__square"></div>
<p class="form-additional__text text-3">
Я принимаю
<a href="#" class="text--bo-line form__link">Политику конфиденциальности</a>
</p>
</label>
</div>
<input class="btn-big btn-big--blood" type="submit" value="оставить заявку">
</form>
</div>
<div class="modal__item">
<p class="title-1">
Обратный звонок
</p>
<p class="text-1">
Если у вас возникли вопросы, или вам нужна консультация, обращайтесь
</p>
<form class="form" method="post" action="/send-telegram.php">
<div class="form__item">
<div class="input__block">
<input class="input__field" type="text" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">Имя</label>
<span class="input__error">Имя введено не верно</span>
</div>
</div>
<div class="form__item form__item--two">
<div class="input__block">
<input class="input__field" type="phone" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">Телефон</label>
<span class="input__error">Телефон введен не верно</span>
</div>
<div class="input__block">
<input class="input__field" type="email" name="Имя" minlength="2" placeholder="" required="">
<label class="input__label">E-mail</label>
<span class="input__error">E-mail введен не верно</span>
</div>
</div>
<div class="form__additional">
<label for="free__agreement" class="form__checkbox-block">
<input type="checkbox" id="free__agreement" class="form__checkbox" required="">
<div class="form-checkbox__square"></div>
<p class="form-additional__text text-3">
Я принимаю
<a href="#" class="text--bo-line form__link">Политику конфиденциальности</a>
</p>
</label>
</div>
<input class="btn-big btn-big--blood" type="submit" value="оставить заявку">
</form>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<script src="/assets/js/main.js"></script>
</body>