MOBILE-3320 course: Disable course thumb parallax
parent
555562e0ef
commit
de3b7d25d2
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue