/home/awneajlw/.trash/storage.2/framework/views/b23542d70938a8475df09173fd87e648.php
<!DOCTYPE html>
<html lang="en" style="scroll-behavior: smooth">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Safeeyes Jeweler offers secure business management software with features like zakat calculation, inventory tracking, and user management."
/>
<meta
name="keywords"
content="business management, zakat calculator, inventory software, Safeeyes Jeweler"
/>
<meta
property="og:title"
content="Safeeyes Jeweler - Secure Business Management"
/>
<meta
property="og:description"
content="Manage your business with Safeeyes' powerful software solutions."
/>
<meta
property="og:image"
content="https://safeeyesjewelers.com/public/frontend/images/safeeyes.png"
/>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/alpinejs" defer></script>
<title>Safeeyes Jeweler</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css"
/>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap"
rel="stylesheet"
/>
<link
rel="icon"
href="https://safeeyesjewelers.com/public/frontend/images/safeeyes.png"
/>
<style>
[x-cloak] {
display: none;
}
body {
font-family: "Poppins", sans-serif;
}
</style>
</head>
<body class="bg-gradient-to-br from-gray-50 to-sky-100 text-gray-800">
<!-- Header -->
<header>
<nav
class="w-full bg-white px-6 py-4 shadow-md rounded-xl sticky top-0 z-50"
x-data="{
open: false,
isFixed: false,
isHomeActive: true,
isServiceActive: false,
isSubscriptionActive: false,
isContactActive: false
}"
x-init="
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
isHomeActive = entry.target.id === 'home';
isServiceActive = entry.target.id === 'services';
isSubscriptionActive = entry.target.id === 'subscription';
isContactActive = entry.target.id === 'contact';
}
});
}, { threshold: 0.3 });
observer.observe(document.getElementById('home'));
observer.observe(document.getElementById('services'));
observer.observe(document.getElementById('subscription'));
observer.observe(document.getElementById('contact'));
window.addEventListener('scroll', () => {
isFixed = window.scrollY > 0;
});
"
:class="{ 'fixed w-full': isFixed, 'sticky': !isFixed }"
>
<div class="w-[94%] mx-auto flex items-center justify-between">
<!-- Logo -->
<div class="flex items-center space-x-3">
<img
src="https://safeeyesjewelers.com/public/frontend/images/safeeyes.png"
alt="Safeeyes Jeweler logo"
class="w-12 h-12 object-contain"
loading="lazy"
/>
<span class="text-xl font-bold text-sky-800 hidden sm:inline"
>Safeeyes</span
>
</div>
<!-- Desktop Menu -->
<div class="hidden md:flex items-center space-x-6">
<a
href="/"
class="text-sm font-semibold px-4 py-1.5 rounded-full transition"
:class="isHomeActive ? 'bg-sky-800 text-white' : 'border border-sky-800 text-sky-800 hover:bg-sky-800 hover:text-white'"
>Home</a
>
<a
href="/#services"
class="text-sm font-semibold px-4 py-1.5 rounded-full transition"
:class="isServiceActive ? 'bg-sky-800 text-white' : 'border border-sky-800 text-sky-800 hover:bg-sky-800 hover:text-white'"
>Service</a
>
<a
href="/#subscription"
class="text-sm font-semibold px-4 py-1.5 rounded-full transition"
:class="isSubscriptionActive ? 'bg-sky-800 text-white' : 'border border-sky-800 text-sky-800 hover:bg-sky-800 hover:text-white'"
>Subscription</a
>
<a
href="/#contact"
class="text-sm font-semibold px-4 py-1.5 rounded-full transition"
:class="isContactActive ? 'bg-sky-800 text-white' : 'border border-sky-800 text-sky-800 hover:bg-sky-800 hover:text-white'"
>Contact</a
>
</div>
<!-- Login Button -->
<div class="hidden md:block">
<a
href="<?php echo e(url('/login')); ?>"
class="bg-sky-700 text-white px-5 py-2 rounded-full text-sm font-medium hover:bg-sky-800 transition"
>Login</a
>
</div>
<!-- Mobile Toggle -->
<button
@click="open = !open"
class="md:hidden focus:outline-none"
aria-label="Toggle mobile menu"
x-bind:aria-expanded="open"
>
<svg
class="w-7 h-7 text-sky-800"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M4 6h16M4 12h16M4 18h16"
/>
</svg>
</button>
</div>
<!-- Mobile Menu -->
<div
x-show="open"
x-transition
x-cloak
class="md:hidden mt-4 bg-white rounded-lg p-4 space-y-3 shadow-md"
>
<a
href="/"
class="block font-medium px-4 py-2 rounded-full transition"
:class="isHomeActive ? 'bg-sky-800 text-white' : 'text-sky-800 hover:bg-sky-100'"
>Home</a
>
<a
href="/#services"
class="block font-medium px-4 py-2 rounded-full transition"
:class="isServiceActive ? 'bg-sky-800 text-white' : 'text-sky-800 hover:bg-sky-100'"
>Service</a
>
<a
href="/#subscription"
class="block font-medium px-4 py-2 rounded-full transition"
:class="isSubscriptionActive ? 'bg-sky-800 text-white' : 'text-sky-800 hover:bg-sky-100'"
>Subscription</a
>
<a
href="/#contact"
class="block font-medium px-4 py-2 rounded-full transition"
:class="isContactActive ? 'bg-sky-800 text-white' : 'text-sky-800 hover:bg-sky-100'"
>Contact</a
>
<a
href="<?php echo e(url('/login')); ?>"
class="block bg-sky-800 text-white px-5 py-2 rounded-full text-sm font-medium text-center hover:bg-sky-700 transition"
>Login</a
>
</div>
</nav>
</header>
<?php /**PATH /home/awneajlw/public_html/safeeyesjewelers.com/resources/views/frontend/component/header.blade.php ENDPATH**/ ?>