Bharath/loyaly
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
R-Bharathraj
2026-04-13 11:37:10 +05:30
commit 49e3a4e836
1215 changed files with 176675 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

513
includes/header.php Normal file
View File

@@ -0,0 +1,513 @@
<div class="body-overlay"></div>
<!-- Active Menu Item Underline Style -->
<style>
/* Active Menu Item - Underline Only */
.mega-menu-item.menu-item-active>.mega-menu-link {
position: relative;
transition: all 0.3s ease;
}
/* Smooth underline effect for active item */
.mega-menu-item.menu-item-active>.mega-menu-link::after {
content: '';
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
height: 3px;
background: #8f8f8e4f;
box-shadow: 0 0 8px #f0be17;
animation: slideUnderline 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.mega-menu-item.menu-item-active>.mega-menu-link span::after{
color: black;
}
@keyframes slideUnderline {
0% {
width: 0;
left: 50%;
}
100% {
width: 100%;
left: 0;
}
}
/* Smooth hover transition */
.mega-menu-link {
transition: all 0.3s ease;
position: relative;
}
</style>
<!-- Menu Item Active Detection Script -->
<script>
// Initialize menu highlighting
function highlightCurrentMenu() {
// Get current page URL
const currentUrl = window.location.href;
console.log('Current URL:', currentUrl);
// Remove active class from all menu items
document.querySelectorAll('.mega-menu-item').forEach(item => {
item.classList.remove('menu-item-active');
});
// Get all mega menu links
const menuLinks = document.querySelectorAll('.mega-menu-link');
console.log('Found menu links:', menuLinks.length);
menuLinks.forEach(link => {
const href = link.getAttribute('href');
console.log('Checking:', href);
// Check if current page matches the link
if (currentUrl.includes(href) || currentUrl.includes(href.replace('.php', ''))) {
const menuItem = link.closest('.mega-menu-item');
if (menuItem) {
menuItem.classList.add('menu-item-active');
console.log('Activated:', href);
// Animate
link.style.animation = 'none';
setTimeout(() => {
link.style.animation = 'menuActivate 0.6s ease-out';
}, 10);
}
}
});
}
// Run on document ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', highlightCurrentMenu);
} else {
highlightCurrentMenu();
}
// Also run after small delay in case content loads later
window.addEventListener('load', highlightCurrentMenu);
// Add animation keyframe
const animationStyle = document.createElement('style');
animationStyle.textContent = `
@keyframes menuActivate {
0% {
opacity: 0.7;
transform: scale(0.95);
}
50% {
opacity: 1;
transform: scale(1.05);
}
100% {
opacity: 1;
transform: scale(1);
}
}
`;
document.head.appendChild(animationStyle);
console.log('Menu highlighting script initialized');
</script>
<div class="body-overlay"></div>
<!-- Page Pre Loader -->
<div class="page-loader-container">
<div class="page-loader">
<div class="page-loader-inner">
<img width="100" height="100" src="/loyaly_php/assets/images/loyalyai-logo.png" alt="Page Loader Image" class="page-loader-logo" />
</div>
</div>
</div>
<!-- Search Panel -->
<div class="site-search">
<div class="site-search-close"></div>
<form name="search_form" method="get" action="https://demo.artureanec.com/themes/aiero/" class="search-form" id="search-589">
<span class="search-form-icon" onclick=document.getElementById(search-589).submit()></span>
<input type="text" name="s" value="" placeholder="Type Your Search..." title="Search" class="search-form-field">
</form>
</div>
<!-- Mobile Menu Panel -->
<div class="mobile-header-menu-container">
<div class="mobile-header-row">
<!-- Icons Block -->
<div class="header-icons-container">
<div class="header-icon search-trigger">
<span class="search-trigger-icon"></span>
</div>
<div class="header-icon menu-close">
<span class="menu-close-icon"></span>
</div>
</div>
</div>
<!-- Menu Block -->
<div id="mega-menu-wrap-main" class="mega-menu-wrap">
<div class="mega-menu-toggle">
<div class="mega-toggle-blocks-left"></div>
<div class="mega-toggle-blocks-center"></div>
<div class="mega-toggle-blocks-right">
<div class='mega-toggle-block mega-menu-toggle-animated-block mega-toggle-block-0' id='mega-toggle-block-0'>
<button aria-label="Toggle Menu" class="mega-toggle-animated mega-toggle-animated-slider" type="button" aria-expanded="false">
<span class="mega-toggle-animated-box">
<span class="mega-toggle-animated-inner"></span>
</span>
</button>
</div>
</div>
</div>
<ul id="mega-menu-main" class="mega-menu max-mega-menu mega-menu-horizontal mega-no-js" data-event="hover_intent" data-effect="fade_up" data-effect-speed="200" data-effect-mobile="disabled" data-effect-speed-mobile="0" data-mobile-force-width="false" data-second-click="go" data-document-click="collapse" data-vertical-behaviour="standard" data-breakpoint="1364" data-unbind="true" data-mobile-state="collapse_all" data-mobile-direction="vertical" data-hover-intent-timeout="300" data-hover-intent-interval="100">
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-current-menu-ancestor mega-current-menu-parent mega-menu-item-has-children mega-menu-megamenu mega-menu-grid mega-align-bottom-left mega-menu-grid mega-menu-item-105" id="mega-menu-item-105">
<a class="mega-menu-link" href="/loyaly_php/index.php" aria-expanded="false" tabindex="0">
Home
<!-- <span class="mega-indicator" aria-hidden="true"></span> -->
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-106" id="mega-menu-item-106">
<a class="mega-menu-link" href="use_cases.php" aria-expanded="false" tabindex="0">
Use Cases <span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-3245" id="mega-menu-item-3245">
<a class="mega-menu-link" href="solutions_page.php" aria-expanded="false" tabindex="0">
Solutions<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2949" id="mega-menu-item-2949">
<a class="mega-menu-link" href="/loyaly_php/about_us.php" aria-expanded="false" tabindex="0">
About Us<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2955" id="mega-menu-item-2955">
<a class="mega-menu-link" href="blog_main.php" aria-expanded="false" tabindex="0">
Market Insights<span aria-hidden="true"></span>
</a>
</li>
</ul>
</div>
<div class="header-mobile-contacts">
<div class="contact-items-title">Contacts</div>
<div class="contact-item contact-item-phone">
<a href="tel:+18005291037">+1 800 529 10 37</a>
</div>
<div class="contact-item contact-item-email">
<a href="mailto:aiero@mail.co">aiero@mail.co</a>
</div>
</div>
<div class="header-mobile-socials">
<span class="socials-title">Follow us:</span>
<ul class="mobile-menu-socials wrapper-socials">
<li>
<a href="https://www.facebook.com/" target="_blank" class="fab fa-facebook-f" title="Facebook"></a>
</li>
<li>
<a href="https://twitter.com/" target="_blank" class="fab fa-x-twitter" title="X"></a>
</li>
<li>
<a href="https://www.linkedin.com/" target="_blank" class="fab fa-linkedin-in" title="LinkedIn"></a>
</li>
<li>
<a href="https://www.youtube.com/" target="_blank" class="fab fa-youtube" title="Youtube"></a>
</li>
</ul>
</div>
<div class="header-mobile-button">
<a class="aiero-button" href="/loyaly_php/contacts.php">
Get in Touch<span class="button-inner"></span>
</a>
</div>
</div>
<!-- Compact Menu Block -->
<div class="body-container">
<!-- Side Panel -->
<div class="slide-sidebar-wrapper slide-sidebar-position-left">
<!-- <div class="slide-sidebar-close">Close</div> -->
<div class="slide-sidebar">
<div><a href="" style="font-size: 24px;" class="slide-sidebar-close"></a></div>
<div class="sidebar-logo-container">
<div class="logo retina-logo">
<a class="logo-link" href="/loyaly_php/index.php">
<img width="150" height="150" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20109%2019'%3E%3C/svg%3E" alt="Loyaly.AI" data-lazy-src="/loyaly_php/assets/images/logo-dark.png" />
<noscript>
<img width="250" height="150" src="/loyaly_php/assets/images/logo-dark.png" alt="Loyaly.AI" />
</noscript>
</a>
</div>
</div>
<div class="slide-sidebar-content">
<div id="block-8" class="widget side-widget widget_block">
<div class="widget-wrapper side-widget-wrapper">
<div class="wp-block-group">
<div class="wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained">
<p style="font-size:12px;font-style:normal;font-weight:700;text-transform:uppercase">Contacts</p>
<p style="font-size:18px">
No.424, Red Rose Towers, DB Road,<br />RS Puram Coimbatore&#8211;641002
</p>
<p style="font-size:18px">
<a href="tel:8001009752034">800 100 975 20 34</a>
<br>
<a href="tel:12318002345678">+ (123) 1800-234-5678</a>
</p>
<p style="font-size:18px;text-decoration:underline">
<a href="mailto:aiero@mail.co">aiero@mail.co</a>
</p>
</div>
</div>
</div>
</div>
<div id="block-9" class="widget side-widget widget_block">
<div class="widget-wrapper side-widget-wrapper">
<div class="wp-block-group">
<div class="wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained">
<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
<div class="wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex">
<div class="wp-block-button has-custom-font-size" style="font-size:16px;font-style:normal;font-weight:600">
<a class="wp-block-button__link wp-element-button" href="/loyaly_php/contacts.php">
Get in Touch<span class="icon-button-arrow"></span>
<span class="button-inner"></span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<ul class="wrapper-socials">
<li>
<a href="https://www.facebook.com/" target="_blank" class="fab fa-facebook-f" title="Facebook"></a>
</li>
<li>
<a href="https://twitter.com/" target="_blank" class="fab fa-x-twitter" title="X"></a>
</li>
<li>
<a href="https://www.linkedin.com/" target="_blank" class="fab fa-linkedin-in" title="LinkedIn"></a>
</li>
<li>
<a href="https://www.youtube.com/" target="_blank" class="fab fa-youtube" title="Youtube"></a>
</li>
</ul>
</div>
<!-- <span class="slide-sidebar-gradient"></span> -->
</div>
<div class="top-page-wrapper header-type-1 header-position-above">
<div class="header-wrapper header-position-above">
<!-- Mobile Sticky Header -->
<div class="mobile-header sticky-header mobile-header-type-1">
<div class="mobile-header-row">
<!-- Logo Block -->
<div class="logo-container">
<div class="logo retina-logo">
<a class="logo-link" href="/loyaly_php/index.php">
<img width="200" height="200" src="/loyaly_php/assets/images/loyalyai.png" alt="Aiero" />
</a>
</div>
</div>
<!-- Icons Block -->
<div class="header-icons-container">
<div class="header-icon menu-trigger">
<span class="menu-trigger-icon">
<span class="hamburger">
<span></span>
<span></span>
<span></span>
</span>
</span>
</div>
</div>
</div>
</div>
<!-- Mobile Header -->
<div class="mobile-header mobile-header-transparent mobile-header-position-above sticky-header-on mobile-header-type-1">
<div class="mobile-header-row">
<!-- Logo Block -->
<div class="logo-container">
<div class="logo retina-logo">
<a class="logo-link" href="/loyaly_php/index.php">
<img width="200" height="200" src="/loyaly_php/assets/images/loyalyai.png" alt="Aiero" />
</a>
</div>
</div>
<!-- Icons Block -->
<div class="header-icons-container">
<div class="header-icon menu-trigger">
<span class="menu-trigger-icon">
<span class="hamburger">
<span></span>
<span></span>
<span></span>
</span>
</span>
</div>
</div>
</div>
</div>
<!-- Sticky Header -->
<header class="header sticky-header header-type-1 header-menu-style-standard sticky-active">
<div class="header-row">
<!-- Left Info Block -->
<div class="header-icons-container">
<div class="header-icon dropdown-trigger">
<div class="dropdown-trigger-item"></div>
</div>
<div class="logo-container">
<div class="logo retina-logo">
<a class="logo-link" href="/loyaly_php/index.php">
<img width="200" height="200" src="/loyaly_php/assets/images/loyalyai.png" alt="Loyaly.AI" />
</a>
</div>
</div>
</div>
<!-- Menu Block -->
<div id="mega-menu-wrap-main" class="mega-menu-wrap">
<div class="mega-menu-toggle">
<div class="mega-toggle-blocks-left"></div>
<div class="mega-toggle-blocks-center"></div>
<div class="mega-toggle-blocks-right">
<div class='mega-toggle-block mega-menu-toggle-animated-block mega-toggle-block-0' id='mega-toggle-block-0'>
<button aria-label="Toggle Menu" class="mega-toggle-animated mega-toggle-animated-slider" type="button" aria-expanded="false">
<span class="mega-toggle-animated-box">
<span class="mega-toggle-animated-inner"></span>
</span>
</button>
</div>
</div>
</div>
<ul id="mega-menu-main" class="mega-menu max-mega-menu mega-menu-horizontal mega-no-js" data-event="hover_intent" data-effect="fade_up" data-effect-speed="200" data-effect-mobile="disabled" data-effect-speed-mobile="0" data-mobile-force-width="false" data-second-click="go" data-document-click="collapse" data-vertical-behaviour="standard" data-breakpoint="1364" data-unbind="true" data-mobile-state="collapse_all" data-mobile-direction="vertical" data-hover-intent-timeout="300" data-hover-intent-interval="100">
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-current-menu-ancestor mega-current-menu-parent mega-menu-item-has-children mega-menu-megamenu mega-menu-grid mega-align-bottom-left mega-menu-grid mega-menu-item-105" id="mega-menu-item-105">
<a class="mega-menu-link" href="/loyaly_php/index.php" aria-expanded="false" tabindex="0">
Home
<!-- <span class="mega-indicator" aria-hidden="true"></span> -->
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-106" id="mega-menu-item-106">
<a class="mega-menu-link" href="use_cases.php" aria-expanded="false" tabindex="0">
Use Cases<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-3245" id="mega-menu-item-3245">
<a class="mega-menu-link" href="solutions_page.php" aria-expanded="false" tabindex="0">
Solutions<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2949" id="mega-menu-item-2949">
<a class="mega-menu-link" href="/loyaly_php/about_us.php" aria-expanded="false" tabindex="0">
About Us<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2955" id="mega-menu-item-2955">
<a class="mega-menu-link" href="blog_main.php" aria-expanded="false" tabindex="0">
Market Insights<span aria-hidden="true"></span>
</a>
</li>
</ul>
</div>
<!-- Right Info Block -->
<div class="header-icons-container">
<div class="header-icon search-trigger">
<span class="search-trigger-icon"></span>
</div>
<div class="header-icon header-button-container">
<a class="aiero-button" href="/loyaly_php/contacts.php">
Get in Touch<span class="button-inner"></span>
</a>
</div>
</div>
</div>
</header>
<!-- Header -->
<header id="head" class="header header-type-1 header-position-above header-transparent sticky-header-on header-menu-style-standard">
<div class="header-row">
<!-- Left Info Block -->
<div class="header-icons-container">
<div class="header-icon dropdown-trigger">
<div class="dropdown-trigger-item"></div>
</div>
<div class="logo-container">
<div class="logo retina-logo">
<a class="logo-link" href="/loyaly_php/index.php">
<img width="200" height="200" src="/loyaly_php/assets/images/loyalyai.png" alt="Aiero" />
</a>
</div>
</div>
</div>
<!-- Menu Block -->
<div id="mega-menu-wrap-main" class="mega-menu-wrap">
<div class="mega-menu-toggle">
<div class="mega-toggle-blocks-left"></div>
<div class="mega-toggle-blocks-center"></div>
<div class="mega-toggle-blocks-right">
<div class='mega-toggle-block mega-menu-toggle-animated-block mega-toggle-block-0' id='mega-toggle-block-0'>
<button aria-label="Toggle Menu" class="mega-toggle-animated mega-toggle-animated-slider" type="button" aria-expanded="false">
<span class="mega-toggle-animated-box">
<span class="mega-toggle-animated-inner"></span>
</span>
</button>
</div>
</div>
</div>
<ul id="mega-menu-main" class="mega-menu max-mega-menu mega-menu-horizontal mega-no-js" data-event="hover_intent" data-effect="fade_up" data-effect-speed="200" data-effect-mobile="disabled" data-effect-speed-mobile="0" data-mobile-force-width="false" data-second-click="go" data-document-click="collapse" data-vertical-behaviour="standard" data-breakpoint="1364" data-unbind="true" data-mobile-state="collapse_all" data-mobile-direction="vertical" data-hover-intent-timeout="300" data-hover-intent-interval="100">
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-current-menu-ancestor mega-current-menu-parent mega-menu-item-has-children mega-menu-megamenu mega-menu-grid mega-align-bottom-left mega-menu-grid mega-menu-item-105" id="mega-menu-item-105">
<a class="mega-menu-link" href="/loyaly_php/index.php" aria-expanded="false" tabindex="0">
Home
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-106" id="mega-menu-item-106">
<a class="mega-menu-link" href="use_cases.php" aria-expanded="false" tabindex="0">
Use Cases <span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-3245" id="mega-menu-item-3245">
<a class="mega-menu-link" href="solutions_page.php" aria-expanded="false" tabindex="0">
Solutions<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2949" id="mega-menu-item-2949">
<a class="mega-menu-link" href="/loyaly_php/about_us.php" aria-expanded="false" tabindex="0">
About Us<span aria-hidden="true"></span>
</a>
</li>
<li class="mega-menu-item mega-menu-item-type-custom mega-menu-item-object-custom mega-menu-item-has-children mega-align-bottom-left mega-menu-flyout mega-menu-item-2955" id="mega-menu-item-2955">
<a class="mega-menu-link" href="blog_main.php" aria-expanded="false" tabindex="0">
Market Insights<span aria-hidden="true"></span>
</a>
</li>
</ul>
</div>
<!-- Right Info Block -->
<div class="header-icons-container">
<div class="header-icon search-trigger">
<span class="search-trigger-icon"></span>
</div>
<div class="header-icon header-button-container">
<a class="aiero-button" href="/loyaly_php/contacts.php">
Get in Touch<span class="button-inner"></span>
</a>
</div>
</div>
</div>
</header>
</div>
</div>