mirror of
https://github.com/TheBinaryNinja/tvapp2.git
synced 2026-06-04 05:35:41 -04:00
chore: update health animation
This commit is contained in:
58
tvapp2/www/css/tvapp2.min.css
vendored
58
tvapp2/www/css/tvapp2.min.css
vendored
@@ -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;
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user