diff --git a/public/themes/dist_static/static/css/solution2.css b/public/themes/dist_static/static/css/solution2.css index 1098320..82956d0 100644 --- a/public/themes/dist_static/static/css/solution2.css +++ b/public/themes/dist_static/static/css/solution2.css @@ -146,9 +146,7 @@ gap: 1.5rem; margin-bottom: 3.125rem; } -.sl2-core__head .s-arrows { - display: none; -} + .sl2-core__title { margin: 0; color: var(--color-text); @@ -262,7 +260,25 @@ .sl2-core__pagination .swiper-pagination-bullet-active::after { background: var(--color-primary); } - +.sl2-core--dual .sl2-core__head .s-arrows { + display: none; +} +.sl2-core--dual .sl2-core__swiper { + overflow: visible; +} +.sl2-core--dual .swiper-wrapper { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 5rem; +} +.sl2-core--dual .sl2-core__slide { + width: auto; + max-width: 56.25rem; + opacity: 1; +} +.sl2-core--dual .sl2-core__pagination { + display: none; +} .sl2-scene { padding-top: 7.5rem; padding-bottom: 0; @@ -542,6 +558,9 @@ } } @media (max-width: 576px) { + .sl2-core__head .s-arrows { + display: none; + } .sl2-hero__intro { padding-top: calc(var(--header-h) + 5rem); } diff --git a/public/themes/dist_static/static/js/solution2.js b/public/themes/dist_static/static/js/solution2.js index 60ae736..6a55d05 100644 --- a/public/themes/dist_static/static/js/solution2.js +++ b/public/themes/dist_static/static/js/solution2.js @@ -12,6 +12,12 @@ function initCoreSwiper() { const root = document.querySelector(".sl2-core"); const el = root?.querySelector(".sl2-core__swiper"); if (!root || !el || !window.Swiper) return; + + const slideCount = el.querySelectorAll(".swiper-wrapper > .swiper-slide").length; + if (slideCount <= 2) { + root.classList.add("sl2-core--dual"); + return; + } new window.Swiper(el, { slidesPerView: 1, spaceBetween: 80, @@ -25,6 +31,10 @@ function initCoreSwiper() { delay: 3e3, disableOnInteraction: false }, + navigation: { + prevEl: root.querySelector(".sl2-core__head .s-arrows__prev"), + nextEl: root.querySelector(".sl2-core__head .s-arrows__next"), + }, pagination: { el: root.querySelector(".sl2-core__pagination"), clickable: true @@ -61,7 +71,7 @@ function initSceneSwiper() { } }); } -$(function() { +$(function () { setActiveNav(); initCoreSwiper(); initSceneSwiper();