Optimize animations and transitions

will-change is apparently not enough to run GPU-enabled animations, use translateZ on top of it
This commit is contained in:
2020-04-09 20:23:24 +02:00
parent 7a44d5b0ed
commit be0f4c8b59
16 changed files with 75 additions and 43 deletions

View File

@@ -57,7 +57,7 @@
.scroll {
display: flex;
flex-direction: column;
transform: translate(0, 0);
transform: translate(0, 0) translateZ(0);
text-align: right;
line-height: 0.85;
transition: transform 325ms $ease-cubic;
@@ -70,7 +70,7 @@
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -72%);
transform: translate(-50%, -72%) translateZ(0);
font-family: $font-serif;
font-size: rem(18px);
color: $color-secondary-bright;