task-17075__opdate-blog #1
No files matched your search
@@ -2886,6 +2886,11 @@ h4 {
|
||||
.articles--page {
|
||||
margin-top: clamp(40px, 15.1381px + 6.6298vw, 100px);
|
||||
}
|
||||
.articles--slider{
|
||||
width: 100%;
|
||||
|
||||
overflow: hidden;
|
||||
}
|
||||
.articles-title--sm {
|
||||
margin-bottom: 40px;
|
||||
font-size: var(--fs-h3-lg);
|
||||
@@ -2938,6 +2943,9 @@ h4 {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
column-gap: 20px;
|
||||
}
|
||||
.related-slider__container.swiper {
|
||||
overflow: visible;
|
||||
}
|
||||
.articles-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
|
||||
@@ -544,6 +544,22 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
}, sizeLG);
|
||||
|
||||
|
||||
// Похожие статьи: слайдер на всех экранах
|
||||
document.querySelectorAll('.related-slider').forEach(slider => {
|
||||
new ResponsiveSwiper(slider.querySelector('.related-slider__container'), {
|
||||
slidesPerView: 1.25,
|
||||
spaceBetween: 15,
|
||||
watchOverflow: true,
|
||||
grabCursor: true,
|
||||
breakpoints: {
|
||||
576: { slidesPerView: 1.25, spaceBetween: 20 },
|
||||
768: { slidesPerView: 2.25, spaceBetween: 20 },
|
||||
1024: { slidesPerView: 3, spaceBetween: 20 }
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Слайдер блога
|
||||
const blogSlider = new ResponsiveSwiper('.blog-slider__container', {
|
||||
loop: true,
|
||||
|
||||
@@ -23,16 +23,20 @@
|
||||
if ($related_query->have_posts()) :
|
||||
$title = $post_type === 'news' ? 'Другие новости' : 'Вам также может понравиться';
|
||||
?>
|
||||
<section class="articles articles--block">
|
||||
<section class="articles articles--block articles--slider">
|
||||
<div class="container">
|
||||
<h2 class="articles-title articles-title--lg"><?php echo $title; ?></h2>
|
||||
<div class="articles-grid">
|
||||
<?php
|
||||
while ($related_query->have_posts()) {
|
||||
$related_query->the_post();
|
||||
get_template_part('template-parts/articles-item');
|
||||
} wp_reset_postdata();
|
||||
?>
|
||||
<div class="related-slider">
|
||||
<div class="related-slider__container swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<?php
|
||||
while ($related_query->have_posts()) {
|
||||
$related_query->the_post();
|
||||
get_template_part('template-parts/articles-item', null, ['class' => 'swiper-slide']);
|
||||
} wp_reset_postdata();
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in new issue
Block a user