animated bounce for donors
This commit is contained in:
parent
835549bd0a
commit
7bc9ead815
|
@ -466,4 +466,78 @@ img.locked-achievement:hover {
|
||||||
-webkit-filter: brightness(0.5) drop-shadow(0 5px 5px #777);
|
-webkit-filter: brightness(0.5) drop-shadow(0 5px 5px #777);
|
||||||
filter: brightness(0.5) drop-shadow(0 5px 5px #777);
|
filter: brightness(0.5) drop-shadow(0 5px 5px #777);
|
||||||
}
|
}
|
||||||
|
.animated.flipOutX,
|
||||||
|
.animated.flipOutY,
|
||||||
|
.animated.bounceIn,
|
||||||
|
.animated.bounceOut {
|
||||||
|
-webkit-animation-duration: .75s;
|
||||||
|
animation-duration: .75s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes bounce {
|
||||||
|
from, 20%, 53%, 80%, to {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
-webkit-transform: translate3d(0,0,0);
|
||||||
|
transform: translate3d(0,0,0);
|
||||||
|
}
|
||||||
|
|
||||||
|
40%, 43% {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
-webkit-transform: translate3d(0, -30px, 0);
|
||||||
|
transform: translate3d(0, -30px, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
-webkit-transform: translate3d(0, -15px, 0);
|
||||||
|
transform: translate3d(0, -15px, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
-webkit-transform: translate3d(0,-4px,0);
|
||||||
|
transform: translate3d(0,-4px,0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
from, 20%, 53%, 80%, to {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||||
|
-webkit-transform: translate3d(0,0,0);
|
||||||
|
transform: translate3d(0,0,0);
|
||||||
|
}
|
||||||
|
|
||||||
|
40%, 43% {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
-webkit-transform: translate3d(0, -30px, 0);
|
||||||
|
transform: translate3d(0, -30px, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||||
|
-webkit-transform: translate3d(0, -15px, 0);
|
||||||
|
transform: translate3d(0, -15px, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
90% {
|
||||||
|
-webkit-transform: translate3d(0,-4px,0);
|
||||||
|
transform: translate3d(0,-4px,0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#bouncy {
|
||||||
|
-webkit-animation-duration: 1s;
|
||||||
|
animation-duration: 1s;
|
||||||
|
-webkit-animation-fill-mode: both;
|
||||||
|
animation-fill-mode: both;
|
||||||
|
-webkit-animation-iteration-count: infinite;
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
-webkit-animation-name: bounce;
|
||||||
|
animation-name: bounce;
|
||||||
|
-webkit-transform-origin: center bottom;
|
||||||
|
transform-origin: center bottom;
|
||||||
|
}
|
|
@ -41,7 +41,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ navbarItem .Path (.T "Donate" | printf "<i class=\"red heart icon\"></i>%s") "/donate" }}
|
{{ if .has_donor }}{{ navbarItem .Path (.T "Donate" | printf "<i id='bouncy' class=\"red heart icon\"></i>%s") "/donate" }}{{else}}{{ navbarItem .Path (.T "Donate" | printf "<i class=\"red heart icon\"></i>%s") "/donate" }}
|
||||||
{{ if $isAdmin }}{{ navbarItem .Path (.T "RAP" | printf "<b>%s</b>") "https://old.yozora.pw/p/100" }}{{ end }}
|
{{ if $isAdmin }}{{ navbarItem .Path (.T "RAP" | printf "<b>%s</b>") "https://old.yozora.pw/p/100" }}{{ end }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
<div class="firetrucking-right-menu">
|
<div class="firetrucking-right-menu">
|
||||||
|
|
Loading…
Reference in New Issue
Block a user