fix(effect-cards): fixed in RTL mode

fixes #5534
nolimits4web · Jun 7, 2023 · e402f05 · e402f05
1 parent 8b4cccd
commit e402f05
Showing 1 changed file with 7 additions and 6 deletions.
diff --git a/src/modules/effect-cards/effect-cards.js b/src/modules/effect-cards/effect-cards.js
@@ -15,10 +15,10 @@ export default function EffectCards({ swiper, extendParams, on }) {
   });
 
   const setTranslate = () => {
-    const { slides, activeIndex } = swiper;
+    const { slides, activeIndex, rtlTranslate: rtl } = swiper;
     const params = swiper.params.cardsEffect;
     const { startTranslate, isTouched } = swiper.touchEventsData;
-    const currentTranslate = swiper.translate;
+    const currentTranslate = rtl ? -swiper.translate : swiper.translate;
     for (let i = 0; i < slides.length; i += 1) {
       const slideEl = slides[i];
       const slideProgress = slideEl.progress;
@@ -61,13 +61,12 @@ export default function EffectCards({ swiper, extendParams, on }) {
         tXAdd += 96 * subProgress;
         tY = `${-25 * subProgress * Math.abs(progress)}%`;
       }
-
       if (progress < 0) {
         // next
-        tX = `calc(${tX}px + (${tXAdd * Math.abs(progress)}%))`;
+        tX = `calc(${tX}px ${rtl ? '-' : '+'} (${tXAdd * Math.abs(progress)}%))`;
       } else if (progress > 0) {
         // prev
-        tX = `calc(${tX}px + (-${tXAdd * Math.abs(progress)}%))`;
+        tX = `calc(${tX}px ${rtl ? '-' : '+'} (-${tXAdd * Math.abs(progress)}%))`;
       } else {
         tX = `${tX}px`;
       }
@@ -80,11 +79,13 @@ export default function EffectCards({ swiper, extendParams, on }) {
       const scaleString =
         progress < 0 ? `${1 + (1 - scale) * progress}` : `${1 - (1 - scale) * progress}`;
 
+      /* eslint-disable */
       const transform = `
         translate3d(${tX}, ${tY}, ${tZ}px)
-        rotateZ(${params.rotate ? rotate : 0}deg)
+        rotateZ(${params.rotate ? (rtl ? -rotate : rotate) : 0}deg)
         scale(${scaleString})
       `;
+      /* eslint-enable */
 
       if (params.slideShadows) {
         // Set shadows