disable fire trophy animation unless hovered: it strains CPU

v2
Thibault Duplessis 2019-04-29 19:47:53 +07:00
parent 7cca786af0
commit 14d0a31641
2 changed files with 16 additions and 18 deletions

View File

@ -1,23 +1,14 @@
%fire-trophy-shadow {
text-shadow: 0 0 .111em #fefcc9,
.055em -.055em .166em #fefcc9,
-.111em -.111em .222em #feec85,
.122em -.233em .333em #ffae34,
-.122em -.322em .277em #ec760c,
0 -.456em .444em #cd4606,
.055em -.5em .444em #973716;
text-shadow: 0 .008em .127em #fefcc9,
.055em -.066em .2em #feec85,
-.111em -.127em .272em #ffae34,
.111em -.272em .411em #ec760c,
-.111em -.456em .416em #cd4606,
0 -.533em .577em #973716,
.055em -.55em .533em #451b0e;
}
@keyframes fire-trophy {
0% {
text-shadow: 0 0 .111em #fefcc9,
.055em -.055em .166em #fefcc9,
-.111em -.111em .222em #feec85,
.122em -.233em .333em #ffae34,
-.122em -.322em .277em #ec760c,
0 -.456em .444em #cd4606,
.055em -.5em .444em #973716;
}
100% {
text-shadow: 0 .008em .127em #fefcc9,
.055em -.066em .2em #feec85,
-.111em -.127em .272em #ffae34,
@ -26,13 +17,21 @@
0 -.533em .577em #973716,
.055em -.55em .533em #451b0e;
}
100% {
text-shadow: 0 0 .111em #fefcc9,
.055em -.055em .166em #fefcc9,
-.111em -.111em .222em #feec85,
.122em -.233em .333em #ffae34,
-.122em -.322em .277em #ec760c,
0 -.456em .444em #cd4606,
.055em -.5em .444em #973716;
}
}
.fire-trophy {
@extend %fire-trophy-shadow;
color: $c-font;
font-size: 90px;
display: block;
animation: fire-trophy 1.5s ease-in-out infinite alternate;
&:hover {
animation: fire-trophy 1.5s ease-in-out infinite alternate;
}

View File

@ -45,7 +45,6 @@
font-size: 65px;
}
.fire-trophy {
@extend %fire-trophy-shadow;
color: $c-font-dim;
opacity: 0.9;
transition: opacity 0.8s;