S
Hello, I added some scripts to this path packages/Webkul/Velocity/src/Resources/views/shop/layouts/top-nav/index.blade.php
but it's not working at all
and this is my code
<div class="top-nav">
{{-- Desktop --}}
<nav class="container py-1 justify-content-between align-items-center d-lg-flex d-none">
<ul class="nav-links">
<li>
<a href="" class="nav-link">
<span class="mdil mdil-map-marker"></span>
Alexandria, Cairo, Ismailia, Egypt
</a>
</li>
<li class="mx-3 hl">
</li>
<li>
<a href="" class="nav-link">
<span class="mdil mdil-phone"></span>
+20 109 504 6819
</a>
</li>
</ul>
<button class="btn lang-btn text-white">العربية</button>
</nav>
{{-- Mobile --}}
<nav class="container py-2 justify-content-between align-items-center d-lg-none d-flex position-fixed top-0 w-100"
style="z-index: 100000">
<a class="" href="{{ route('shop.home.index') }}" aria-label="Logo">
<img src="{{ asset('storage/logo.svg') }}" alt="Image" style="height: 28px" />
</a>
<ul class="nav-links">
<li>
<button class="btn p-0 nav-link">
<span class="mdil mdil-heart mi-md"></span>
</button>
</li>
<li>
<button class="btn p-0 nav-link">
<span class="mdil mdil-cart mi-md"></span>
</button>
</li>
<li>
<button class="btn p-0 nav-link">
<span class="mdil mdil-account mi-md"></span>
</button>
</li>
<li>
<button id="open-nav-btn" class="btn p-0 text-white">
<span class="mdil mdil-menu mi-md"></span>
</button>
</li>
</ul>
</nav>
</div>
{{-- Mobile offcanvas --}}
<div id="mobile-nav" class="hidden position-fixed top-0 w-100 h-100" style="z-index: 1000000; background-color: #151515;">
<div class="container py-2">
<div class="d-flex justify-content-between align-items-center">
<a class="" href="{{ route('shop.home.index') }}" aria-label="Logo">
<img src="{{ asset('storage/logo.svg') }}" alt="Image" style="height: 28px" />
</a>
<button id="close-nav-btn" class="btn p-0">
<span class="mdi mdi-close text-white mi-md"></span>
</button>
</div>
</div>
<div class="container pt-4">
<ul class="d-flex flex-column mb-0" style="list-style: none; gap: 0.75rem;">
<li><a href="" class="nav-link">Shop</a></li>
<li><a href="" class="nav-link">Categories</a></li>
<li><a href="" class="nav-link">Services</a></li>
<li><a href="" class="nav-link">About</a></li>
</ul>
<div class="bg-white w-100 my-4" style="height: 1px;opacity: 0.25;"></div>
<ul class="d-flex flex-column mb-0" style="list-style: none; gap: 0.75rem;">
<li>
<a href="" class="nav-link">
<span class="mdil mdil-map-marker"></span>
Alexandria, Cairo, Ismailia, Egypt
</a>
</li>
<li>
<a href="" class="nav-link">
<span class="mdil mdil-phone"></span>
+20 109 504 6819
</a>
</li>
<li>
<button class="btn lang-btn text-white">العربية</button>
</li>
</ul>
</div>
</div>
@push('scripts')
<script type="text/javascript">
(() => {
let closeNavBtn = document.getElementById('close-nav-btn');
let openNavBtn = document.getElementById('open-nav-btn');
let mobileNav = document.getElementById('mobile-nav');
console.log(closeNavBtn);
closeNavBtn.addEventListener('click', () => {
mobileNav.classList.add('hidden');
});
openNavBtn.addEventListener('click', () => {
mobileNav.classList.remove('hidden');
});
})();
</script>
@endpush
