сделал js search
This commit is contained in:
Kirill Pet
@@ -115,8 +115,106 @@
|
|||||||
background-position: center right;
|
background-position: center right;
|
||||||
}
|
}
|
||||||
.header-menu__search{
|
.header-menu__search{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.header-menu-search__open{
|
||||||
width: 32px;
|
width: 32px;
|
||||||
aspect-ratio: 1;
|
aspect-ratio: 1;
|
||||||
|
|
||||||
|
background: none;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.header-menu__search.active .header-menu-search__open img:first-child{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.header-menu-search__block{
|
||||||
|
position: absolute;
|
||||||
|
top: 58px;
|
||||||
|
right: 0;
|
||||||
|
|
||||||
|
width: 400px;
|
||||||
|
|
||||||
|
transition: all .3s;
|
||||||
|
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
.header-menu__search.active .header-menu-search__block{
|
||||||
|
pointer-events: auto;
|
||||||
|
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.header-menu-search__input{
|
||||||
|
padding: 14px 64px 14px 24px;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--text-white);
|
||||||
|
|
||||||
|
border: 1px solid var(--text-white);
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
background-color: var(--background-grey-hover);
|
||||||
|
}
|
||||||
|
.header-menu-search__input::placeholder{
|
||||||
|
color: var(--link);
|
||||||
|
}
|
||||||
|
.header-menu-search__btn{
|
||||||
|
position: absolute;
|
||||||
|
top: 8px;
|
||||||
|
right: 24px;
|
||||||
|
|
||||||
|
width: 32px;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
background-image: url(/assets/img/icon/search.svg);
|
||||||
|
/* background-image: url(/assets/img/icon/close.svg); */
|
||||||
|
}
|
||||||
|
.header-menu-search__found{
|
||||||
|
margin-top: 24px;
|
||||||
|
|
||||||
|
padding: 24px;
|
||||||
|
|
||||||
|
background-color: var(--background-grey-hover);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
.header-menu-search__error{}
|
||||||
|
.header-menu-search__item{
|
||||||
|
margin-top: 24px;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.header-menu-search__item:first-child{
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.header-menu-search-item__img{
|
||||||
|
width: 72px;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
.header-menu-search-item__content{
|
||||||
|
margin-left: 16px;
|
||||||
|
}
|
||||||
|
.header-menu-search-item__art{
|
||||||
|
margin-top: 8px;
|
||||||
|
|
||||||
|
color: var(--link);
|
||||||
|
}
|
||||||
|
.phone-search{
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
/* header */
|
/* header */
|
||||||
|
|
||||||
|
|||||||
@@ -130,10 +130,17 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
transition: all .3s;
|
transition: all .3s;
|
||||||
|
|
||||||
|
height: 100vh;
|
||||||
|
|
||||||
background-color: var(--background-main);
|
background-color: var(--background-main);
|
||||||
}
|
}
|
||||||
.phone-menu__sub.active{
|
.phone-menu__sub.active{
|
||||||
left: 0;
|
left: 0;
|
||||||
|
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.phone-menu__sub .title-1{
|
||||||
|
margin-bottom: 32px;
|
||||||
}
|
}
|
||||||
.phone-menu-content__close{
|
.phone-menu-content__close{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -217,6 +224,108 @@
|
|||||||
.phone-menu{
|
.phone-menu{
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
.phone-search{
|
||||||
|
position: absolute;
|
||||||
|
top: 112px;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
height: 0;
|
||||||
|
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
transition: all .3s;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.phone-search.active{
|
||||||
|
height: 79px;
|
||||||
|
}
|
||||||
|
.phone-search.hidden{
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
.phone-search__content{
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
background-color: var(--background-grey-hover);
|
||||||
|
}
|
||||||
|
.phone-search__input{
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
padding: 14.5px 23px;
|
||||||
|
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: var(--text-white);
|
||||||
|
|
||||||
|
border: 1px solid var(--text-white);
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
background-color: rgba(0, 0, 0, 0);
|
||||||
|
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
.phone-search__input::placeholder{
|
||||||
|
color: var(--link);
|
||||||
|
}
|
||||||
|
.phone-search__found{
|
||||||
|
position: absolute;
|
||||||
|
top: 95px;
|
||||||
|
left: 16px;
|
||||||
|
right: 16px;
|
||||||
|
|
||||||
|
max-height: 256px;
|
||||||
|
width: calc(100% - 32px);
|
||||||
|
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
background-color: var(--background-grey-hover);
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
overflow-y: auto;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.phone-search__found.active{
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.phone-search__item{
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone-search__item{
|
||||||
|
margin-top: 24px;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.phone-search__item:first-child{
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.phone-search-item__img{
|
||||||
|
width: 64px;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
.phone-search-item__content{
|
||||||
|
margin-left: 16px;
|
||||||
|
}
|
||||||
|
.phone-search-item__art{
|
||||||
|
margin-top: 8px;
|
||||||
|
|
||||||
|
color: var(--link);
|
||||||
|
}
|
||||||
|
.phone__open-search{
|
||||||
|
width: 32px;
|
||||||
|
aspect-ratio: 1;
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
background-color: rgba(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
.phone__open-search.active img:first-child{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
/* header */
|
/* header */
|
||||||
|
|
||||||
/* footer */
|
/* footer */
|
||||||
|
|||||||
BIN
assets/img/photo/header-menu-search.png
Normal file
BIN
assets/img/photo/header-menu-search.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
@@ -152,9 +152,22 @@ btnOpenMenu.onclick = function () {
|
|||||||
newHeigh = content.offsetHeight + 'px';
|
newHeigh = content.offsetHeight + 'px';
|
||||||
|
|
||||||
phoneMenu.classList.add('active');
|
phoneMenu.classList.add('active');
|
||||||
|
// block.classList.add('active');
|
||||||
block.style.height = newHeigh;
|
block.style.height = newHeigh;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let closeMainMenu = document.querySelector('.phone-menu-content__close.main');
|
||||||
|
|
||||||
|
closeMainMenu.onclick = function () {
|
||||||
|
let phoneMenu = document.querySelector('.phone-menu'),
|
||||||
|
block = document.querySelector('.phone-menu__block-content.main'),
|
||||||
|
content = document.querySelector('.phone-menu__content.main');
|
||||||
|
|
||||||
|
phoneMenu.classList.remove('active');
|
||||||
|
block.style.height = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
let nextPhoneMenu = document.querySelectorAll('.phone-menu--next');
|
let nextPhoneMenu = document.querySelectorAll('.phone-menu--next');
|
||||||
|
|
||||||
nextPhoneMenu.forEach(next => {
|
nextPhoneMenu.forEach(next => {
|
||||||
@@ -165,8 +178,43 @@ nextPhoneMenu.forEach(next => {
|
|||||||
blockSub.classList.add('active');
|
blockSub.classList.add('active');
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// phone menu
|
|
||||||
|
|
||||||
|
let subPhone = document.querySelectorAll('.phone-menu__sub');
|
||||||
|
|
||||||
|
subPhone.forEach(menu => {
|
||||||
|
let close = menu.querySelector('.phone-menu-content__close');
|
||||||
|
|
||||||
|
close.onclick = function () {
|
||||||
|
menu.classList.remove('active');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// phone menu end
|
||||||
|
|
||||||
|
// search
|
||||||
|
let openBtnSearch = document.querySelector('.header-menu-search__open'),
|
||||||
|
blockSearchPc = document.querySelector('.header-menu__search');
|
||||||
|
|
||||||
|
openBtnSearch.onclick = function () {
|
||||||
|
blockSearchPc.classList.toggle('active');
|
||||||
|
}
|
||||||
|
|
||||||
|
let btnOpenSearchPhone = document.querySelector('.phone__open-search'),
|
||||||
|
searchPhone = document.querySelector('.phone-search');
|
||||||
|
|
||||||
|
btnOpenSearchPhone.onclick = function () {
|
||||||
|
if (!searchPhone.classList.contains('hidden')) {
|
||||||
|
setTimeout(() => {
|
||||||
|
searchPhone.classList.add('hidden');
|
||||||
|
}, 300);
|
||||||
|
}else{
|
||||||
|
searchPhone.classList.remove('hidden');
|
||||||
|
}
|
||||||
|
|
||||||
|
btnOpenSearchPhone.classList.toggle('active');
|
||||||
|
searchPhone.classList.toggle('active');
|
||||||
|
}
|
||||||
|
|
||||||
|
// search end
|
||||||
|
|
||||||
// resize
|
// resize
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
|
|||||||
222
index.html
222
index.html
@@ -91,7 +91,10 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="header-phone__item">
|
<div class="header-phone__item">
|
||||||
<img src="/assets/img/icon/search.svg" alt="search">
|
<button class="phone__open-search">
|
||||||
|
<img src="/assets/img/icon/search.svg" alt="search">
|
||||||
|
<img src="/assets/img/icon/close.svg" alt="search">
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="header-phone__item">
|
<div class="header-phone__item">
|
||||||
@@ -128,16 +131,49 @@
|
|||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<img src="/assets/img/icon/search.svg" alt="" class="header-menu__search">
|
<div class="header-menu__search">
|
||||||
|
<button class="header-menu-search__open">
|
||||||
|
<img src="/assets/img/icon/search.svg" alt="" >
|
||||||
|
<img src="/assets/img/icon/close.svg" alt="" >
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="header-menu-search__block">
|
||||||
|
<button class="header-menu-search__btn"></button>
|
||||||
|
<input type="text" class="header-menu-search__input" placeholder="Поиск">
|
||||||
|
|
||||||
|
<div class="header-menu-search__found">
|
||||||
|
<div class="header-menu-search__item">
|
||||||
|
<img src="/assets/img/photo/header-menu-search.png" alt="" class="header-menu-search-item__img">
|
||||||
|
|
||||||
|
<div class="header-menu-search-item__content">
|
||||||
|
<p class="text-2">Беговая дорожка механическая DRAXFIT+</p>
|
||||||
|
<p class="header-menu-search-item__art text-2">Артикул: STP1000C</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="header-menu-search__item">
|
||||||
|
<img src="/assets/img/photo/header-menu-search.png" alt="" class="header-menu-search-item__img">
|
||||||
|
|
||||||
|
<div class="header-menu-search-item__content">
|
||||||
|
<p class="text-2">Беговая дорожка механическая DRAXFIT+</p>
|
||||||
|
<p class="header-menu-search-item__art text-2">Артикул: STP1000C</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- <p class="header-menu-search__error text-2">
|
||||||
|
К сожалению, по вашему запросу ничего не найдено
|
||||||
|
</p> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="phone-menu">
|
<div class="phone-menu">
|
||||||
<div class="phone-menu__block-content main">
|
<div class="phone-menu__block-content main">
|
||||||
<div class="phone-menu__content main">
|
<div class="phone-menu__content main">
|
||||||
<button class="phone-menu-content__close"></button>
|
<button class="phone-menu-content__close main"></button>
|
||||||
|
|
||||||
<ul class="phone-menu__list">
|
<ul class="phone-menu__list">
|
||||||
<li>
|
<li>
|
||||||
@@ -189,99 +225,33 @@
|
|||||||
<div class="phone-menu__content">
|
<div class="phone-menu__content">
|
||||||
<button class="phone-menu-content__close"></button>
|
<button class="phone-menu-content__close"></button>
|
||||||
|
|
||||||
<ul class="phone-menu__list">
|
<p class="title-1">
|
||||||
<li>
|
Каталог
|
||||||
<a href="#">спецификация</a>
|
</p>
|
||||||
</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">
|
<ul class="phone-menu__list">
|
||||||
<li>
|
<li>
|
||||||
<a href="#">спецификация</a>
|
<a href="#" class="phone-menu--next" data-menu="cardio">Кардио</a>
|
||||||
</li>
|
|
||||||
<li>О компании</li>
|
|
||||||
<li>
|
|
||||||
<a href="#" class="phone-menu--next" data-menu="cardio">каталог</a>
|
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<a href="#" class="phone-menu--next">бренды</a>
|
<a href="#" class="phone-menu--next">механическое кардио</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" class="phone-menu--next">силовые тренажеры</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" class="phone-menu--next">скамьи</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#" class="phone-menu--next">свободные веса</a>
|
||||||
|
</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>контакты</li>
|
|
||||||
</ul>
|
</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>
|
</div>
|
||||||
|
|
||||||
@@ -289,53 +259,41 @@
|
|||||||
<div class="phone-menu__content">
|
<div class="phone-menu__content">
|
||||||
<button class="phone-menu-content__close"></button>
|
<button class="phone-menu-content__close"></button>
|
||||||
|
|
||||||
|
<p class="title-1">
|
||||||
|
Кардио
|
||||||
|
</p>
|
||||||
|
|
||||||
<ul class="phone-menu__list">
|
<ul class="phone-menu__list">
|
||||||
<li>
|
<li>Беговые дорожки</li>
|
||||||
<a href="#">спецификация</a>
|
<li>Беговые дорожки</li>
|
||||||
</li>
|
<li>Беговые дорожки</li>
|
||||||
<li>О компании</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>
|
</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>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="phone-search">
|
||||||
|
<div class="phone-search__content">
|
||||||
|
<input type="text" class="phone-search__input" placeholder="Поиск">
|
||||||
|
|
||||||
|
<div class="phone-search__found">
|
||||||
|
<!-- <p class="text-1">
|
||||||
|
К сожалению, по вашему запросу ничего не найдено
|
||||||
|
</p> -->
|
||||||
|
|
||||||
|
<div class="phone-search__item">
|
||||||
|
<img src="/assets/img/photo/header-menu-search.png" alt="" class="phone-search-item__img">
|
||||||
|
|
||||||
|
<div class="phone-search-item__content">
|
||||||
|
<p class="text-2">Беговая дорожка механическая DRAXFIT+</p>
|
||||||
|
<p class="phone-search-item__art text-2">Артикул: STP1000C</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main class="wrapper">
|
<main class="wrapper">
|
||||||
|
|||||||
Reference in New Issue
Block a user