Add heartbeat blink animation to preloader logo and fix header logo paths

This commit is contained in:
R-Bharathraj
2026-06-30 17:08:43 +05:30
parent 9d0cb800f0
commit b23af1fea4
3 changed files with 31 additions and 4 deletions

BIN
public/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

View File

@@ -246,11 +246,38 @@ body.is-home-page.scroll-up .sticky-active {
z-index: 999999999 !important;
}
/* Ensure page loader covers everything during initial render */
.page-loader-container {
z-index: 1000000000 !important;
}
.page-loader-logo {
animation: heartbeat-blink 1.4s infinite ease-in-out;
transform-origin: center;
}
@keyframes heartbeat-blink {
0% {
transform: scale(1);
opacity: 0.8;
}
14% {
transform: scale(1.12);
opacity: 1;
}
28% {
transform: scale(1);
opacity: 0.8;
}
42% {
transform: scale(1.12);
opacity: 1;
}
70% {
transform: scale(1);
opacity: 0.8;
}
}
/* Respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce) {
/* Disable utility animation classes used across the project */

View File

@@ -71,7 +71,7 @@ export default function Header() {
>
<div className="page-loader">
<Image
src="/loyaly_php/assets/images/loyalyai-logo.png"
src="/favicon.png"
alt="Loyaly.AI"
width={100}
height={100}
@@ -120,7 +120,7 @@ export default function Header() {
{/* Panel header */}
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<Image
src="/loyaly_php/assets/images/loyalyai.png"
src="/images/logo-dark.png"
alt="Loyaly.AI"
width={140}
height={40}
@@ -247,7 +247,7 @@ export default function Header() {
<div style={{ flexShrink: 0, flex: 1, minWidth: 120 }}>
<Link href="/" aria-label="Loyaly.AI home" style={{ display: 'inline-flex', alignItems: 'center', textDecoration: 'none' }}>
<Image
src="/loyaly_php/assets/images/loyalyai.png"
src="/images/logo-dark.png"
alt="Loyaly.AI"
width={160}
height={48}