сделал swiper-reviews-img
This commit is contained in:
Kirill Pet
@@ -859,6 +859,26 @@
|
|||||||
|
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
.reviews-item__img-block{
|
||||||
|
margin-left: 164px;
|
||||||
|
|
||||||
|
width: 577px;
|
||||||
|
height: 600px;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
object-fit: cover;
|
||||||
|
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.reviews .reviews-item__img-block .swiper-pagination{
|
||||||
|
bottom: 16px;
|
||||||
|
|
||||||
|
padding-right: 0px;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
.reviews .swiper-pagination{
|
.reviews .swiper-pagination{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 32px;
|
right: 32px;
|
||||||
|
|||||||
@@ -665,6 +665,26 @@ main{
|
|||||||
height: 300px;
|
height: 300px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
.reviews-item__img-block{
|
||||||
|
margin-top: 24px;
|
||||||
|
margin-left: 0;
|
||||||
|
|
||||||
|
height: 300px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.swiper-reviews-img{
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.reviews-item__img-block .swiper-slide{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.reviews-item__img-block .swiper-slide img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
.reviews .swiper-pagination{
|
.reviews .swiper-pagination{
|
||||||
bottom: 87px;
|
bottom: 87px;
|
||||||
|
|
||||||
|
|||||||
@@ -40,6 +40,20 @@ const reviewsSwiper = new Swiper('.reviews-swiper', {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
let reviewsSwiperImg = new Swiper(".swiper-reviews-img", {
|
||||||
|
autoplay: {
|
||||||
|
delay: 2500,
|
||||||
|
disableOnInteraction: false,
|
||||||
|
},
|
||||||
|
pagination: {
|
||||||
|
el: ".swiper-pagination",
|
||||||
|
clickable: true,
|
||||||
|
renderBullet: function (index, className) {
|
||||||
|
return '<span class="' + className + '">' + "</span>";
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
const projectsSwiper = new Swiper('.projects-swiper', {
|
const projectsSwiper = new Swiper('.projects-swiper', {
|
||||||
direction: 'horizontal',
|
direction: 'horizontal',
|
||||||
breakpoints: {
|
breakpoints: {
|
||||||
@@ -284,6 +298,8 @@ phoneInputs.forEach(phoneInput => {
|
|||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// masks end
|
||||||
|
|
||||||
// pc menu
|
// pc menu
|
||||||
|
|
||||||
let blocksMenu = document.querySelectorAll('.header-menu-list-next__block');
|
let blocksMenu = document.querySelectorAll('.header-menu-list-next__block');
|
||||||
@@ -332,6 +348,8 @@ blocksMenu.forEach(block =>{
|
|||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// pc menu end
|
||||||
|
|
||||||
// resize
|
// resize
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
let screenWidth = window.screen.width;
|
let screenWidth = window.screen.width;
|
||||||
|
|||||||
252
index.html
252
index.html
@@ -787,127 +787,147 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
<div class="reviews-item__img-block">
|
||||||
|
<div class="swiper swiper-reviews-img">
|
||||||
|
<div class="swiper-wrapper">
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
<div class="reviews__item swiper-slide">
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
<div class="reviews-item__content">
|
|
||||||
<div class="reviews-item-content__header">
|
|
||||||
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
|
||||||
|
|
||||||
<div class="reviews-item-content-header__block">
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-1">Название клуба</p>
|
|
||||||
|
|
||||||
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="reviews-item-content-header__item">
|
<div class="swiper-slide">
|
||||||
<p class="text-2">ФИО</p>
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="swiper-slide">
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews-item-content__text">
|
|
||||||
<p class="text-2">
|
|
||||||
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
|
||||||
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
|
||||||
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews__item swiper-slide">
|
|
||||||
<div class="reviews-item__content">
|
|
||||||
<div class="reviews-item-content__header">
|
|
||||||
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
|
||||||
|
|
||||||
<div class="reviews-item-content-header__block">
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-1">Название клуба</p>
|
|
||||||
|
|
||||||
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
|
||||||
</div>
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-2">ФИО</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews-item-content__text">
|
|
||||||
<p class="text-2">
|
|
||||||
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
|
||||||
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
|
||||||
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews__item swiper-slide">
|
|
||||||
<div class="reviews-item__content">
|
|
||||||
<div class="reviews-item-content__header">
|
|
||||||
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
|
||||||
|
|
||||||
<div class="reviews-item-content-header__block">
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-1">Название клуба</p>
|
|
||||||
|
|
||||||
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
|
||||||
</div>
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-2">ФИО</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews-item-content__text">
|
|
||||||
<p class="text-2">
|
|
||||||
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
|
||||||
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
|
||||||
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews__item swiper-slide">
|
|
||||||
<div class="reviews-item__content">
|
|
||||||
<div class="reviews-item-content__header">
|
|
||||||
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
|
||||||
|
|
||||||
<div class="reviews-item-content-header__block">
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-1">Название клуба</p>
|
|
||||||
|
|
||||||
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
|
||||||
</div>
|
|
||||||
<div class="reviews-item-content-header__item">
|
|
||||||
<p class="text-2">ФИО</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="reviews-item-content__text">
|
|
||||||
<p class="text-2">
|
|
||||||
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
|
||||||
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
|
||||||
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="swiper-pagination"></div>
|
<div class="swiper-pagination"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews__item swiper-slide">
|
||||||
|
<div class="reviews-item__content">
|
||||||
|
<div class="reviews-item-content__header">
|
||||||
|
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
||||||
|
|
||||||
|
<div class="reviews-item-content-header__block">
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-1">Название клуба</p>
|
||||||
|
|
||||||
|
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
||||||
|
</div>
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-2">ФИО</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews-item-content__text">
|
||||||
|
<p class="text-2">
|
||||||
|
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
||||||
|
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
||||||
|
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews__item swiper-slide">
|
||||||
|
<div class="reviews-item__content">
|
||||||
|
<div class="reviews-item-content__header">
|
||||||
|
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
||||||
|
|
||||||
|
<div class="reviews-item-content-header__block">
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-1">Название клуба</p>
|
||||||
|
|
||||||
|
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
||||||
|
</div>
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-2">ФИО</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews-item-content__text">
|
||||||
|
<p class="text-2">
|
||||||
|
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
||||||
|
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
||||||
|
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews__item swiper-slide">
|
||||||
|
<div class="reviews-item__content">
|
||||||
|
<div class="reviews-item-content__header">
|
||||||
|
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
||||||
|
|
||||||
|
<div class="reviews-item-content-header__block">
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-1">Название клуба</p>
|
||||||
|
|
||||||
|
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
||||||
|
</div>
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-2">ФИО</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews-item-content__text">
|
||||||
|
<p class="text-2">
|
||||||
|
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
||||||
|
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
||||||
|
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews__item swiper-slide">
|
||||||
|
<div class="reviews-item__content">
|
||||||
|
<div class="reviews-item-content__header">
|
||||||
|
<img src="/assets/img/photo/reviews-person.png" alt="" class="reviews-item-content-header__img">
|
||||||
|
|
||||||
|
<div class="reviews-item-content-header__block">
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-1">Название клуба</p>
|
||||||
|
|
||||||
|
<p class="reviews-item-content-header__pin text-2">Локация</p>
|
||||||
|
</div>
|
||||||
|
<div class="reviews-item-content-header__item">
|
||||||
|
<p class="text-2">ФИО</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="reviews-item-content__text">
|
||||||
|
<p class="text-2">
|
||||||
|
Недавно я воспользовался услугами этой компании, и остался в полном восторге! Сначала у меня были сомнения, но профессионализм команды моментально развеял все мои опасения. Каждый этап сотрудничества был тщательно продуман, начиная с первичной консультации и заканчивая реализацией проекта.<br><br>
|
||||||
|
Отдельно хочу отметить их внимание к деталям и индивидуальный подход. Каждое предложение звучало обоснованно, и я чувствовал, что мои идеи действительно важны для них. Проект был выполнен в срок и даже превзошел мои ожидания! <br><br>
|
||||||
|
Рекомендую эту компанию всем, кто ищет качественные услуги и надежное сотрудничество. Спасибо вам за отличную работу!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<img src="/assets/img/photo/reviews.png" alt="" class="reviews-item__img">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="reviews__counter">
|
<div class="reviews__counter">
|
||||||
<div class="swiper-button-prev"></div>
|
<div class="swiper-button-prev"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user