j1-template 2024.3.19 → 2024.3.20

data/assets/theme/j1/modules/swiperjs/css/modules/layoutBase.css

@@ -0,0 +1,16 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutBase.css
+ # CSS styles of the J1 module for SwiperJS v11 (layout)
+ # -----------------------------------------------------------------------------
+ #
+ # Product/Info:
+ # http://jekyll.one
+ #
+ # Copyright (C) 2025 Juergen Adams
+ #
+ # J1 Theme is licensed under MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
+ # -----------------------------------------------------------------------------
+*/
+

data/assets/theme/j1/modules/swiperjs/css/modules/layoutBase.min.css

@@ -0,0 +1,16 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutBase.css
+ # CSS styles of the J1 module for SwiperJS v11 (layout)
+ # -----------------------------------------------------------------------------
+ #
+ # Product/Info:
+ # http://jekyll.one
+ #
+ # Copyright (C) 2025 Juergen Adams
+ #
+ # J1 Theme is licensed under MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
+ # -----------------------------------------------------------------------------
+*/
+

data/assets/theme/j1/modules/swiperjs/css/modules/layoutExpanding.css

@@ -33,8 +33,8 @@
 }
   
 .swiper-slide {
-/*  background: var(--md-gray-50); */
-    background: var(--md-gray);
+    background: var(--md-gray-50);
+/*  background: var(--md-gray); */
 }
 
 .expanding-slide {
@@ -54,26 +54,26 @@
 }
 
 .expanding-slide .slide-cover-title {
+    position: absolute;
+    left: 0;
+    top: 0px;
+    width: 100%;    
     box-sizing: border-box;
     padding: 8px 16px;
     font-size: 24px;
     color: #fff;
-    position: absolute;
-    left: 0;
-    top: 0px;
-    width: 100%;
     text-align: center;
-    z-index: 10;
     font-weight: 600;
+    z-index: 10;
 }
 
 .expanding-slide .slide-cover-coords {
-    padding: 8px 16px;
-    width: 100%;
-    box-sizing: border-box;
     position: absolute;
     left: 0;
     bottom: 0;
+    padding: 8px 16px;
+    width: 100%;
+    box-sizing: border-box;
     display: flex;
     justify-content: space-between;
     z-index: 10;
@@ -124,11 +124,11 @@
 }
 
 .expanding-slide {
-    overflow: hidden;
     position: relative;
-    box-sizing: border-box;
     width: 100%;
-    margin: 0 auto;
+    margin: 0 auto;    
+    overflow: hidden;
+    box-sizing: border-box;
 }
 
 .expanding-slide .swiper {
@@ -148,9 +148,9 @@ max-width: calc(100% - 32px - 32px);
 
 /* jadams, DISABLED width */
 .expanding-slide .swiper-slide {
+    display: flex;
     justify-content: center;
     align-items: center;
-    display: flex;
 /*  width: calc(100% - 32px); */
 }
 
@@ -167,8 +167,8 @@ max-width: calc(100% - 32px - 32px);
 
 /* jadams, changed width */
 .expanding-slide-container {
-/*  max-width: calc(100% - 32px); */
     width: 90%;
+/*  max-width: calc(100% - 32px); */    
     max-width: 640px;
     position: relative;
     margin-bottom: 1.5rem;
@@ -180,25 +180,25 @@ max-width: calc(100% - 32px - 32px);
 }
 
 .expanding-slide-cover img {
-    width: 100%;
-    border-radius: var(--expanding-slide-cover-border-radius);
+    position: relative;
     display: block;
+    width: 100%;
     margin: 0;
-    position: relative;
+    border-radius: var(--expanding-slide-cover-border-radius);   
     z-index: 2;
 }
 
 .expanding-slide-cover::before {
-    content: "";
     position: absolute;
+    content: "";
     width: 100%;
     height: 90%;
     left: 0;
     bottom: 0;
-    border-radius: var(--expanding-slide-cover-border-radius);
-    z-index: 1;
+    border-radius: var(--expanding-slide-cover-border-radius);    
     transform-origin: center bottom;
     box-shadow: var(--expanding-slide-cover-box-shadow);
+    z-index: 1;
 }
 
 .swiper-slide.swiper-slide-active .expanding-slide-cover {
@@ -218,15 +218,15 @@ max-width: calc(100% - 32px - 32px);
 .expanding-slide-content {
     position: absolute;
     box-sizing: border-box;
+    top: 0;
     left: calc(-1 * var(--expanding-slide-content-horizontal-offset));
     right: calc(-1 * var(--expanding-slide-content-horizontal-offset));
-    top: 0;
-    z-index: 0;
     padding-top: calc(var(--expanding-slide-cover-height) - var(--expanding-slide-content-vertical-offset));
     border-radius: var(--expanding-slide-content-border-radius);
     transform: scaleX(var(--expanding-slide-scale-x)) scaleY(var(--expanding-slide-scale-y));
     transform-origin: center top;
     background: var(--expanding-slide-content-bg-color);
+    z-index: 0;
 }
 
 .expanding-slide-content-inner {
@@ -246,7 +246,7 @@ max-width: calc(100% - 32px - 32px);
 */
 
 .expanding-slide-opened .expanding-slide-content {
-    transform: scale(1) translateY(calc(var(--expanding-slide-opened-translate-y) + var(--expanding-slide-content-vertical-offset)));
     opacity: 1;
+    transform: scale(1) translateY(calc(var(--expanding-slide-opened-translate-y) + var(--expanding-slide-content-vertical-offset)));
     background-color: antiquewhite;
 }

data/assets/theme/j1/modules/swiperjs/css/modules/layoutExpanding.min.css

@@ -14,238 +14,4 @@
  # -----------------------------------------------------------------------------
 */
 
-/* slide styles
--------------------------------------------------------------------------------- */
-
-:root {
-    --expanding-slide-content-bg-color: #fff;
-    --expanding-slide-content-vertical-offset: 32px;
-    --expanding-slide-content-horizontal-offset: 16px;
-    --expanding-slide-content-padding: 16px;
-    --expanding-slide-content-border-radius: 0px;
-    --expanding-slide-cover-border-radius: 0px;
-    --expanding-slide-inactive-cover-opacity: 0.5;
-    --expanding-slide-opened-translate-y: -64px;
-    --expanding-slide-cover-box-shadow: 0px 8px 16px rgba(0, 0, 0, 0);
-  /*
-    --expanding-slide-opened-cover-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
-  */
-  }
-  
-.swiper-slide {
-/*  background: var(--md-gray-50); */
-    background: var(--md-gray);
-}
-.expanding-slide {
-    width: 100%;
-    height: 100%;
-}
-
-.expanding-slide-cover {
-color: #fff;
-}
-
-@media (orientation: portrait) {
-    .expanding-slide-cover img {
-        height: 40vh;
-        object-fit: cover;
-    }
-}
-
-.expanding-slide .slide-cover-title {
-    box-sizing: border-box;
-    padding: 8px 16px;
-    font-size: 24px;
-    color: #fff;
-    position: absolute;
-    left: 0;
-    top: 0px;
-    width: 100%;
-    text-align: center;
-    z-index: 10;
-    font-weight: 600;
-}
-
-.expanding-slide .slide-cover-coords {
-    padding: 8px 16px;
-    width: 100%;
-    box-sizing: border-box;
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    display: flex;
-    justify-content: space-between;
-    z-index: 10;
-    text-transform: uppercase;
-    font-size: 12px;
-    font-weight: 500;
-}
-
-.expanding-slide .slide-content {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    align-content: center;
-    flex-wrap: wrap;
-}
-
-.expanding-slide .slide-content-title {
-    text-align: center;
-    font-size: 16px;
-    margin-bottom: 8px;
-    font-weight: 600;
-    width: 100%;
-}
-
-.expanding-slide .slide-content-avatars {
-    display: flex;
-}
-
-.expanding-slide .slide-content-avatars img {
-    border-radius: 50%;
-    width: 32px;
-    height: 32px;
-    border: 4px solid #fff;
-}
-
-.expanding-slide .slide-content-avatars img + img {
-    margin-left: -16px;
-}
-
-.expanding-slide .slide-content-rating {
-    display: flex;
-}
-
-/* jadams */
-.expanding-slide .slide-content-rating img {
-    width: 80px;
-    height: 16px;
-}
-
-.expanding-slide {
-    overflow: hidden;
-    position: relative;
-    box-sizing: border-box;
-    width: 100%;
-    margin: 0 auto;
-}
-
-.expanding-slide .swiper {
-    width: 100%;
-    height: 100%;
-    transform-style: preserve-3d;
-    transform: translate3d(0, 0, 0);
-}
-
-/* jadams, 2025-02-20: */
-/*
-.expanding-slide .swiper-slide {
-width: 600px;
-max-width: calc(100% - 32px - 32px);
-}
-*/
-
-/* jadams, DISABLED width */
-.expanding-slide .swiper-slide {
-    justify-content: center;
-    align-items: center;
-    display: flex;
-/*  width: calc(100% - 32px); */
-}
-
-.expanding-slide-initialized .expanding-slide-content,
-.expanding-slide-initialized .expanding-slide-cover,
-.expanding-slide-initialized .expanding-slide-cover::before {
-    transition-duration: 300ms;
-}
-
-.expanding-slide-container, .expanding-slide-cover {
-    -webkit-touch-callout: none;
-    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
-
-/* jadams, changed width */
-.expanding-slide-container {
-/*  max-width: calc(100% - 32px); */
-    width: 90%;
-    max-width: 640px;
-    position: relative;
-    margin-bottom: 1.5rem;
-}
-
-.expanding-slide-cover {
-    opacity: var(--expanding-slide-inactive-cover-opacity);
-    position: relative;
-}
-
-.expanding-slide-cover img {
-    width: 100%;
-    border-radius: var(--expanding-slide-cover-border-radius);
-    display: block;
-    margin: 0;
-    position: relative;
-    z-index: 2;
-}
-
-.expanding-slide-cover::before {
-    content: "";
-    position: absolute;
-    width: 100%;
-    height: 90%;
-    left: 0;
-    bottom: 0;
-    border-radius: var(--expanding-slide-cover-border-radius);
-    z-index: 1;
-    transform-origin: center bottom;
-    box-shadow: var(--expanding-slide-cover-box-shadow);
-}
-
-.swiper-slide.swiper-slide-active .expanding-slide-cover {
-    opacity: 1;
-    cursor: pointer;
-}
-
-.swiper-slide:not(.swiper-slide-active) .expanding-slide-cover::before {
-    box-shadow: none;
-}
-
-.swiper-slide:not(.swiper-slide-active) .expanding-slide-content {
-    opacity: 0;
-}
-
-/* jadams */
-.expanding-slide-content {
-    position: absolute;
-    box-sizing: border-box;
-    left: calc(-1 * var(--expanding-slide-content-horizontal-offset));
-    right: calc(-1 * var(--expanding-slide-content-horizontal-offset));
-    top: 0;
-    z-index: 0;
-    padding-top: calc(var(--expanding-slide-cover-height) - var(--expanding-slide-content-vertical-offset));
-    border-radius: var(--expanding-slide-content-border-radius);
-    transform: scaleX(var(--expanding-slide-scale-x)) scaleY(var(--expanding-slide-scale-y));
-    transform-origin: center top;
-    background: var(--expanding-slide-content-bg-color);
-}
-
-.expanding-slide-content-inner {
-    padding: var(--expanding-slide-content-padding);
-    box-sizing: border-box;
-}
-
-.expanding-slide-opened .expanding-slide-cover {
-    transform: translateY(var(--expanding-slide-opened-translate-y));
-}
-
-/* jadams */
-/*
-.expanding-slide-opened .expanding-slide-cover::before {
-    box-shadow: var(--expanding-slide-opened-cover-box-shadow);
-}
-*/
-
-.expanding-slide-opened .expanding-slide-content {
-    transform: scale(1) translateY(calc(var(--expanding-slide-opened-translate-y) + var(--expanding-slide-content-vertical-offset)));
-    opacity: 1;
-    background-color: antiquewhite;
-}
+:root{--expanding-slide-content-bg-color:#fff;--expanding-slide-content-vertical-offset:32px;--expanding-slide-content-horizontal-offset:16px;--expanding-slide-content-padding:16px;--expanding-slide-content-border-radius:0;--expanding-slide-cover-border-radius:0;--expanding-slide-inactive-cover-opacity:.5;--expanding-slide-opened-translate-y:-64px;--expanding-slide-cover-box-shadow:0 8px 16px rgba(0,0,0,0)}.swiper-slide{background:var(--md-gray)}.expanding-slide{width:100%;height:100%}.expanding-slide-cover{color:#fff}@media(orientation:portrait){.expanding-slide-cover img{height:40vh;object-fit:cover}}.expanding-slide .slide-cover-title{box-sizing:border-box;padding:8px 16px;font-size:24px;color:#fff;position:absolute;left:0;top:0;width:100%;text-align:center;z-index:10;font-weight:600}.expanding-slide .slide-cover-coords{padding:8px 16px;width:100%;box-sizing:border-box;position:absolute;left:0;bottom:0;display:flex;justify-content:space-between;z-index:10;text-transform:uppercase;font-size:12px;font-weight:500}.expanding-slide .slide-content{display:flex;justify-content:space-between;align-items:center;align-content:center;flex-wrap:wrap}.expanding-slide .slide-content-title{text-align:center;font-size:16px;margin-bottom:8px;font-weight:600;width:100%}.expanding-slide .slide-content-avatars{display:flex}.expanding-slide .slide-content-avatars img{border-radius:50%;width:32px;height:32px;border:4px solid #fff}.expanding-slide .slide-content-avatars img+img{margin-left:-16px}.expanding-slide .slide-content-rating{display:flex}.expanding-slide .slide-content-rating img{width:80px;height:16px}.expanding-slide{overflow:hidden;position:relative;box-sizing:border-box;width:100%;margin:0 auto}.expanding-slide .swiper{width:100%;height:100%;transform-style:preserve-3d;transform:translate3d(0,0,0)}.expanding-slide .swiper-slide{justify-content:center;align-items:center;display:flex}.expanding-slide-initialized .expanding-slide-content,.expanding-slide-initialized .expanding-slide-cover,.expanding-slide-initialized .expanding-slide-cover::before{transition-duration:300ms}.expanding-slide-container,.expanding-slide-cover{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.expanding-slide-container{width:90%;max-width:640px;position:relative;margin-bottom:1.5rem}.expanding-slide-cover{opacity:var(--expanding-slide-inactive-cover-opacity);position:relative}.expanding-slide-cover img{width:100%;border-radius:var(--expanding-slide-cover-border-radius);display:block;margin:0;position:relative;z-index:2}.expanding-slide-cover::before{content:"";position:absolute;width:100%;height:90%;left:0;bottom:0;border-radius:var(--expanding-slide-cover-border-radius);z-index:1;transform-origin:center bottom;box-shadow:var(--expanding-slide-cover-box-shadow)}.swiper-slide.swiper-slide-active .expanding-slide-cover{opacity:1;cursor:pointer}.swiper-slide:not(.swiper-slide-active) .expanding-slide-cover::before{box-shadow:none}.swiper-slide:not(.swiper-slide-active) .expanding-slide-content{opacity:0}.expanding-slide-content{position:absolute;box-sizing:border-box;left:calc(-1 * var(--expanding-slide-content-horizontal-offset));right:calc(-1 * var(--expanding-slide-content-horizontal-offset));top:0;z-index:0;padding-top:calc(var(--expanding-slide-cover-height) - var(--expanding-slide-content-vertical-offset));border-radius:var(--expanding-slide-content-border-radius);transform:scaleX(var(--expanding-slide-scale-x)) scaleY(var(--expanding-slide-scale-y));transform-origin:center top;background:var(--expanding-slide-content-bg-color)}.expanding-slide-content-inner{padding:var(--expanding-slide-content-padding);box-sizing:border-box}.expanding-slide-opened .expanding-slide-cover{transform:translateY(var(--expanding-slide-opened-translate-y))}.expanding-slide-opened .expanding-slide-content{transform:scale(1) translateY(calc(var(--expanding-slide-opened-translate-y)+var(--expanding-slide-content-vertical-offset)));opacity:1;background-color:antiquewhite}

data/assets/theme/j1/modules/swiperjs/css/modules/layoutNeighbor.min.css

@@ -1,6 +1,6 @@
 /*
  # -----------------------------------------------------------------------------
- # ~/assets/theme/j1/modules/swiper/css/modules/layoutNeighbor.css
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutNeighbor.min.css
  # CSS styles of the J1 module for SwiperJS v11 (layout)
  # -----------------------------------------------------------------------------
  #
@@ -14,4 +14,4 @@
  # -----------------------------------------------------------------------------
 */
 
-.neighbor-slider{position:relative;overflow:hidden}.neighbor-slider .swiper{width:90%;max-width:640px;height:320px}.neighbor-slider .neighbor-slider-main{position:relative;z-index:10;box-shadow:0 0 30px rgba(0,0,0,0.5)}.neighbor-slider .neighbor-slider-prev,.neighbor-slider .neighbor-slider-next{top:50%;opacity:.75;position:absolute;user-select:none;-webkit-user-select:none;cursor:pointer;filter:grayscale(1);transform:translateY(-50%) scale(1) rotateY(0)}.neighbor-slider .neighbor-slider-prev{right:50%}.neighbor-slider .neighbor-slider-next{left:50%}
+.neighbor-slider{position:relative;overflow:hidden}.neighbor-slider .swiper{width:90%;max-width:540px;height:320px}.neighbor-slider .neighbor-slider-main{position:relative;z-index:10;box-shadow:0 0 30px rgba(0,0,0,0.5)}.neighbor-slider .neighbor-slider-prev,.neighbor-slider .neighbor-slider-next{position:absolute;top:50%;cursor:pointer;user-select:none;-webkit-user-select:none;opacity:.75;filter:grayscale(1);transform:translateY(-50%) scale(1) rotateY(0)}.neighbor-slider .neighbor-slider-prev{right:50%}.neighbor-slider .neighbor-slider-next{left:50%}

data/assets/theme/j1/modules/swiperjs/css/modules/layoutParallax.css

@@ -0,0 +1,16 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutParallax.css
+ # CSS styles of the J1 module for SwiperJS v11 (layout)
+ # -----------------------------------------------------------------------------
+ #
+ # Product/Info:
+ # http://jekyll.one
+ #
+ # Copyright (C) 2025 Juergen Adams
+ #
+ # J1 Theme is licensed under MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
+ # -----------------------------------------------------------------------------
+*/
+

data/assets/theme/j1/modules/swiperjs/css/modules/layoutParallax.min.css

@@ -0,0 +1,16 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutParallax.min.css
+ # CSS styles of the J1 module for SwiperJS v11 (layout)
+ # -----------------------------------------------------------------------------
+ #
+ # Product/Info:
+ # http://jekyll.one
+ #
+ # Copyright (C) 2025 Juergen Adams
+ #
+ # J1 Theme is licensed under MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE
+ # -----------------------------------------------------------------------------
+*/
+

data/assets/theme/j1/modules/swiperjs/css/modules/layoutStacked.css

@@ -21,29 +21,29 @@
     --stacked-slider-width: 265px;
     /* height of the swiper container (image) */
     --stacked-slider-height: 392px;
-  }
-  
+}
+
 /*
  * VW unit CSS: viewport width.
  * Relative unit that represents a percentage of the width of the
  * current viewport.
  * NOTE: 1vw means 1 percent of the screen width.
 */
-  
+
 @media ((orientation: portrait) and (min-width: 768px)) {
     .stacked-slider {
         --stacked-slider-width: 68vw;
         --stacked-slider-height: 55vw;
     }
 }
-  
+
 @media ((orientation: portrait) and (min-width: 576px)) {
     .stacked-slider {
         --stacked-slider-width: 68vw;
         --stacked-slider-height: 60vw;
     }
 }
-  
+
 @media ((orientation: portrait) and (max-width: 575.98px)) {
     .stacked-slider {
         --stacked-slider-width: 72vw;
@@ -57,7 +57,7 @@
         --stacked-slider-height: 80vh;
     }
 }
-  
+
 @media ((orientation: landscape) and (min-width: 992px)) {
     .stacked-slider {
         --stacked-slider-width: calc(80vh / 1.1);
@@ -95,4 +95,3 @@
     height: 100%;
     object-fit: cover;
 }
-

data/assets/theme/j1/modules/swiperjs/css/modules/layoutStacked.min.css

@@ -14,85 +14,4 @@
  # -----------------------------------------------------------------------------
 */
 
-:root {
-    /* actually sets slide shadow that should match background color of the element behind th slider */
-    --stacked-slider-shadow-bg-color: #000;
-    /* width of the swiper container (image) */
-    --stacked-slider-width: 265px;
-    /* height of the swiper container (image) */
-    --stacked-slider-height: 392px;
-  }
-  
-/*
- * VW unit CSS: viewport width.
- * Relative unit that represents a percentage of the width of the
- * current viewport.
- * NOTE: 1vw means 1 percent of the screen width.
-*/
-  
-@media ((orientation: portrait) and (min-width: 768px)) {
-    .stacked-slider {
-        --stacked-slider-width: 68vw;
-        --stacked-slider-height: 55vw;
-    }
-}
-  
-@media ((orientation: portrait) and (min-width: 576px)) {
-    .stacked-slider {
-        --stacked-slider-width: 68vw;
-        --stacked-slider-height: 60vw;
-    }
-}
-  
-@media ((orientation: portrait) and (max-width: 575.98px)) {
-    .stacked-slider {
-        --stacked-slider-width: 72vw;
-        --stacked-slider-height: 162vw;
-    }
-}
-
-@media ((orientation: landscape) and (min-width: 768px)) {
-    .stacked-slider {
-        --stacked-slider-width: calc(80vh / 1.1);
-        --stacked-slider-height: 80vh;
-    }
-}
-  
-@media ((orientation: landscape) and (min-width: 992px)) {
-    .stacked-slider {
-        --stacked-slider-width: calc(80vh / 1.1);
-        --stacked-slider-height: 55vh;
-    }
-}
-
-.stacked-slider {
-    display: flex;
-    overflow: hidden;
-    position: relative;
-    box-sizing: border-box;
-    width: 100%;
-    margin: 0 auto;
-}
-
-.stacked-slider .swiper {
-    overflow: visible;
-    width: var(--stacked-slider-width);
-    height: var(--stacked-slider-height);
-}
-
-.stacked-slider .swiper-slide {
-    border-radius: 10px;
-    justify-content: center;
-    display: flex;
-}
-
-.stacked-slider .swiper-slide-shadow {
-    background: var(--stacked-slider-shadow-bg-color);
-}
-
-.stacked-slider img {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-}
-
+:root{--stacked-slider-shadow-bg-color:#000;--stacked-slider-width:265px;--stacked-slider-height:392px}@media((orientation:portrait) and (min-width:768px)){.stacked-slider{--stacked-slider-width:68vw;--stacked-slider-height:55vw}}@media((orientation:portrait) and (min-width:576px)){.stacked-slider{--stacked-slider-width:68vw;--stacked-slider-height:60vw}}@media((orientation:portrait) and (max-width:575.98px)){.stacked-slider{--stacked-slider-width:72vw;--stacked-slider-height:162vw}}@media((orientation:landscape) and (min-width:768px)){.stacked-slider{--stacked-slider-width:calc(80vh / 1.1);--stacked-slider-height:80vh}}@media((orientation:landscape) and (min-width:992px)){.stacked-slider{--stacked-slider-width:calc(80vh / 1.1);--stacked-slider-height:55vh}}.stacked-slider{display:flex;overflow:hidden;position:relative;box-sizing:border-box;width:100%;margin:0 auto}.stacked-slider .swiper{overflow:visible;width:var(--stacked-slider-width);height:var(--stacked-slider-height)}.stacked-slider .swiper-slide{border-radius:10px;justify-content:center;display:flex}.stacked-slider .swiper-slide-shadow{background:var(--stacked-slider-shadow-bg-color)}.stacked-slider img{width:100%;height:100%;object-fit:cover}

data/assets/theme/j1/modules/swiperjs/css/modules/layoutThumbs.min.css

@@ -1,6 +1,6 @@
 /*
  # -----------------------------------------------------------------------------
- # ~/assets/theme/j1/modules/swiper/css/modules/layoutThumbs.css
+ # ~/assets/theme/j1/modules/swiper/css/modules/layoutThumbs.min.css
  # CSS styles of the J1 Template for SwiperJS v11 (layout)
  # -----------------------------------------------------------------------------
  #
@@ -14,31 +14,4 @@
  # -----------------------------------------------------------------------------
 */
 
-/* Thumbs Slider
--------------------------------------------------------------------------------- */
-
-.thumbs-slider:active { 
-  cursor: grabbing; 
-}
-
-.thumbs-slider--top .swiper-slide {
-  height: 200px !important;
-}
-
-.thumbs-slider--bottom .swiper-slide {
-  height: 200px !important;
-}
-
-.thumbs-slider--top .swiper-slide,
-.thumbs-slider--right .swiper-slide,
-.thumbs-slider--bottom .swiper-slide,
-.thumbs-slider--left .swiper-slide {
-  opacity: .6;
-}
-
-.thumbs-slider--top .swiper-slide-thumb-active,
-.thumbs-slider--right .swiper-slide-thumb-active,
-.thumbs-slider--bottom .swiper-slide-thumb-active,
-.thumbs-slider--left .swiper-slide-thumb-active {
-  opacity: 1;
-}
+.thumbs-slider:active{cursor:grabbing}.thumbs-slider--top .swiper-slide{height:200px !important}.thumbs-slider--bottom .swiper-slide{height:200px !important}.thumbs-slider--top .swiper-slide,.thumbs-slider--right .swiper-slide,.thumbs-slider--bottom .swiper-slide,.thumbs-slider--left .swiper-slide{opacity:.6}.thumbs-slider--top .swiper-slide-thumb-active,.thumbs-slider--right .swiper-slide-thumb-active,.thumbs-slider--bottom .swiper-slide-thumb-active,.thumbs-slider--left .swiper-slide-thumb-active{opacity:1}