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;
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);
}