chore: update health animation

tvapp2/www/css/tvapp2.min.css

@@ -347,7 +347,7 @@ p
 
 .navbar-social svg
 {
-    font-size:                  clamp(0.7em, 2vw, 1.1em);
+    font-size:                  clamp(0.7em, 2vw, 1.0em);
     margin-left:                10px;
 }
 
@@ -630,78 +630,36 @@ code
 {
     0%
     {
-            transform: scale( .75);
+            transform: scale(1.2);
     }
     20%
     {
-            transform: scale( 1);
+            transform: scale(1.5);
     }
     40%
     {
-            transform: scale( .75);
+            transform: scale(1.2);
     }
     60%
     {
-            transform: scale( 1);
+            transform: scale(1.5);
     }
     80%
     {
-            transform: scale( .75);
+            transform: scale(1.2);
     }
     100%
     {
-            transform: scale( .75);
+            transform: scale(1.2);
     }
 }
 
-#heart
+.heart
 {
     position:                   relative;
-    width: 100px;
-    height: 90px;
     animation:                  heartbeat 1s infinite;
 }
 
-#heart:before,
-#heart:after
-{
-    position: absolute;
-    content: "";
-    left: 50px;
-    top: 0;
-    width: 50px;
-    height: 80px;
-    background: red;
-    -moz-border-radius: 50px 50px 0 0;
-    border-radius: 50px 50px 0 0;
-    -webkit-transform: rotate(-45deg);
-    -moz-transform: rotate(-45deg);
-    -ms-transform: rotate(-45deg);
-    -o-transform: rotate(-45deg);
-    transform: rotate(-45deg);
-    -webkit-transform-origin: 0 100%;
-    -moz-transform-origin: 0 100%;
-    -ms-transform-origin: 0 100%;
-    -o-transform-origin: 0 100%;
-    transform-origin: 0 100%;
-}
-
-#heart:after
-{
-    left: 0;
-    -webkit-transform: rotate(45deg);
-    -moz-transform: rotate(45deg);
-    -ms-transform: rotate(45deg);
-    -o-transform: rotate(45deg);
-    transform: rotate(45deg);
-    -webkit-transform-origin: 100% 100%;
-    -moz-transform-origin: 100% 100%;
-    -ms-transform-origin: 100% 100%;
-    -o-transform-origin: 100% 100%;
-    transform-origin: 100% 100%;
-}
-
-
 @-webkit-keyframes fadeOut {
     0% {
         opacity: 1;

tvapp2/www/index.html

@@ -21,8 +21,8 @@
                     <a class="header-name" href="<%= appUrlGithub %>">TVApp2 for Docker</a>
                 </div>
                 <div class="navbar-social">
+                    <a href=""><i id="action-health" data-bs-toggle="tooltip" title="Health" class="heart logo health fa-duotone fa-solid fa-heart" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>
                     <a href="javascript:runResync();"><i id="action-resync" data-bs-toggle="tooltip" title="Resync" class="restart fa-solid fa-rotate" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>
-                    <a href=""><i id="action-health" data-bs-toggle="tooltip" title="Health" class="logo health fa-duotone fa-solid fa-heart" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>
                     <a href="<%= appUrlDocs %>"><i data-bs-toggle="tooltip" title="Documentation" class="logo fa-duotone fa-solid fa-book-open-cover" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>
                     <a href="<%= appUrlGithub %>"><i data-bs-toggle="tooltip" title="Github" class="logo fa-logos fa-github" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>
                     <a href="<%= appUrlDiscord %>"><i data-bs-toggle="tooltip" title="Discord" class="logo fa-logos fa-discord" style="--fa-primary-color: rgb(255, 255, 255); --fa-secondary-color: rgb(255, 255, 255);" aria-hidden="true"></i></a>