jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-17 19:25:32 -04:00
Code Issues Activity

fix hand wave pet peeves & heart beats per minute (still fatally low)

Browse Source
This commit is contained in:
Jake Jarvis
2020-06-02 12:46:17 -04:00
parent 598367c19e
commit 23eabb48c0
1 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
assets/sass/components/_animation.scss
View File

@@ -1,14 +1,17 @@
@charset "UTF-8";
/*! Magic Waving Hand Emoji™: https://jrvs.io/wave */
.wave {
display: inline-block;
animation: wave 5s infinite;
transform-origin: 70% 70%;
animation-delay: 1s;
transform-origin: 65% 80%;
}
.beat {
display: inline-block;
animation: beat 20s infinite; // 3 bpm, call 911 if you see this please.
animation: beat 10s infinite; // 6 bpm, call 911 if you see this please.
animation-delay: 2.5s; // offset from wave animation
}
@keyframes wave {
@@ -16,20 +19,24 @@
transform: rotate(0deg);
}
5% {
transform: rotate(-10deg);
transform: rotate(14deg);
}
10% {
transform: rotate(12deg);
transform: rotate(-8deg);
}
15% {
transform: rotate(-10deg);
transform: rotate(14deg);
}
20% {
transform: rotate(9deg);
transform: rotate(-4deg);
}
25% {
transform: rotate(10deg);
}
30% {
transform: rotate(0deg);
}
// pause for 3.5 out of 5 seconds
100% {
transform: rotate(0deg);
}
@@ -39,19 +46,19 @@
0% {
transform: scale(1);
}
1% {
transform: scale(1.25);
}
2% {
transform: scale(1);
}
3% {
transform: scale(1.25);
}
4% {
transform: scale(1);
}
// pause for ~19 out of 20 seconds
6% {
transform: scale(1.2);
}
8% {
transform: scale(1);
}
// pause for ~9 out of 10 seconds
100% {
transform: scale(1);
}