From de3b7d25d256aede60e0cc506f232fada720c1cb Mon Sep 17 00:00:00 2001
From: Noel De Martin <noel@moodle.com>
Date: Thu, 1 Jul 2021 13:44:19 +0200
Subject: [PATCH] MOBILE-3320 course: Disable course thumb parallax

---
 .../course/pages/preview/preview.scss         | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/core/features/course/pages/preview/preview.scss b/src/core/features/course/pages/preview/preview.scss
index ba783b098..161f3647a 100644
--- a/src/core/features/course/pages/preview/preview.scss
+++ b/src/core/features/course/pages/preview/preview.scss
@@ -7,17 +7,22 @@
     perspective-origin: center top;
     transform-style: preserve-3d;
 
-    .core-course-thumb-parallax-content {
-        transform: translateZ(0);
-        -webkit-filter: drop-shadow(0px -3px 3px rgba(var(--drop-shadow)));
-        filter: drop-shadow(0px -3px 3px rgba(var(--drop-shadow)));
-    }
-    .core-course-thumb-parallax {
-        height: 40vw;
-        max-height: 35vh;
-        z-index: -1;
-        overflow: hidden;
-    }
+    // @todo This parallax effect caused the image to be scaled during page transitions,
+    // and in some devices it seems like the problem persisted even after the transition.
+    // We should decide whether we want to keep this parallax or not, and if we do fix
+    // the problem or find an alternative implementation. For now, it's disabled.
+
+    // .core-course-thumb-parallax-content {
+    //     transform: translateZ(0);
+    //     -webkit-filter: drop-shadow(0px -3px 3px rgba(var(--drop-shadow)));
+    //     filter: drop-shadow(0px -3px 3px rgba(var(--drop-shadow)));
+    // }
+    // .core-course-thumb-parallax {
+    //     height: 40vw;
+    //     max-height: 35vh;
+    //     z-index: -1;
+    //     overflow: hidden;
+    // }
     .core-course-thumb {
         overflow: hidden;
         text-align: center;
@@ -30,7 +35,7 @@
          * translate-z: -2 * $scroll-factor px;
          * scale: 1 + $scroll-factor * 2;
          */
-        transform: translateZ(-1px) scale(2);
+        // transform: translateZ(-1px) scale(2);
     }