MOBILE-3320 course: Disable course thumb parallax

main
Noel De Martin 2021-07-01 13:44:19 +02:00
parent 555562e0ef
commit de3b7d25d2
1 changed files with 17 additions and 12 deletions

View File

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