Merge pull request #830 from jamesgeorge007/master

Add heartbeat animation

README.md

@@ -81,6 +81,7 @@ You may [generate a SRI hash](https://www.srihash.org/) of that particular versi
 | `zoomOutDown`     | `zoomOutLeft`      | `zoomOutRight`      | `zoomOutUp`          |
 | `slideInDown`     | `slideInLeft`      | `slideInRight`      | `slideInUp`          |
 | `slideOutDown`    | `slideOutLeft`     | `slideOutRight`     | `slideOutUp`         |
+| `heartBeat`       |
 
 Full example:
 

animate-config.json

@@ -9,7 +9,8 @@
     "swing": true,
     "tada": true,
     "wobble": true,
-    "jello": true
+    "jello": true,
+    "heartBeat": true
   },
 
   "bouncing_entrances": {

animate.css

@@ -703,6 +703,69 @@
   transform-origin: center;
 }
 
+@-webkit-keyframes heartBeat {
+  0% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  14% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  28% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  42% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  70% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+}
+
+@keyframes heartBeat {
+  0% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  14% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  28% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+
+  42% {
+    -webkit-transform: scale(1.3);
+    transform: scale(1.3);
+  }
+
+  70% {
+    -webkit-transform: scale(1);
+    transform: scale(1);
+  }
+}
+
+.heartBeat {
+  -webkit-animation-name: heartBeat;
+  animation-name: heartBeat;
+  -webkit-animation-duration: 1.3s;
+  animation-duration: 1.3s;
+  -webkit-animation-timing-function: ease-in-out;
+  animation-timing-function: ease-in-out;
+}
+
 @-webkit-keyframes bounceIn {
   from,
   20%,

package.json

@@ -35,7 +35,10 @@
     "run-sequence": "^2.2.1"
   },
   "lint-staged": {
-    "*.{js,json,md,css}": ["prettier --write", "git add"]
+    "*.{js,json,md,css}": [
+      "prettier --write",
+      "git add"
+    ]
   },
   "prettier": {
     "bracketSpacing": false,

source/attention_seekers/heartBeat.css

@@ -0,0 +1,29 @@
+@keyframes heartBeat{
+  
+  0%{
+    transform: scale(1);
+  }
+  
+  14%{
+    transform: scale(1.3);
+  }
+  
+  28%{
+    transform: scale(1);
+  }
+  
+  42%{
+    transform: scale(1.3);
+  }
+  
+  70%{
+    transform: scale(1);
+  }
+  
+}
+
+.heartBeat{
+  animation-name: heartBeat;
+  animation-duration: 1.3s;
+  animation-timing-function: ease-in-out;
+}