Merge pull request #23 from Morkowski/heart-animation

heart animation

src/app.css

@@ -2,6 +2,15 @@
 @tailwind components;
 @tailwind utilities;
 
+@layer utilities {
+  .fa-beat-custom {
+    --fa-animation-duration: 0.4s;
+    --fa-fade-opacity: 0.6;
+    --fa-animation-iteration-count: 1;
+    --fa-beat-scale: 1.4;
+  }
+}
+
 @font-face {
   font-family: "Montserrat";
   font-style: normal;

src/partials/Note.svelte

@@ -262,7 +262,7 @@
               {$repliesCount}
             </div>
             <div class={cx({'text-accent': like})}>
-              <button class="fa fa-heart cursor-pointer" on:click={() => like ? deleteReaction(like) : react("+")} />
+              <button class={cx('fa fa-heart cursor-pointer', {'fa-beat fa-beat-custom': like})} on:click={() => like ? deleteReaction(like) : react("+")} />
               {$likesCount}
             </div>
             <div>