59 lines
2.9 KiB
TypeScript
59 lines
2.9 KiB
TypeScript
"use client";
|
|
import React, { useState, useEffect } from 'react';
|
|
import Link from 'next/link';
|
|
import useSticky from '@/hooks/useSticky';
|
|
import NavItemsMetatron from './NavItemsMetatron';
|
|
|
|
const HeaderMetatron = () => {
|
|
const sticky = useSticky();
|
|
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
|
|
|
|
const toggleMobileMenu = () => {
|
|
setIsMobileMenuOpen(!isMobileMenuOpen);
|
|
};
|
|
|
|
return (
|
|
<header className="metatron-header-wrap">
|
|
<div id="metatron-header-sticky" className={`metatron-header-area ${sticky ? "header-sticky" : ""}`}>
|
|
<div className="container">
|
|
<div className="row align-items-center">
|
|
<div className="col-lg-3 col-md-6 col-6">
|
|
<div className="metatron-logo">
|
|
<Link href="/">
|
|
<img src="/assets/img/home/footer/footer-logo-black.webp" alt="MetatronCube" style={{ width: '100%', maxWidth: '220px', height: 'auto' }} />
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
<div className="col-lg-6 d-none d-lg-block">
|
|
<div className="metatron-main-menu text-center">
|
|
<nav className="metatron-nav">
|
|
<NavItemsMetatron />
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
<div className="col-lg-3 col-md-6 col-6">
|
|
<div className="metatron-header-right d-flex align-items-center justify-content-end">
|
|
<div className="metatron-hero-btn d-none d-lg-block text-end">
|
|
<Link href="/contact" className="metatron-btn-main">
|
|
Get Started Now <i className="fa-solid fa-angle-right"></i>
|
|
</Link>
|
|
</div>
|
|
<div className="metatron-header-action-item d-block d-lg-none">
|
|
<button type="button" className="metatron-offcanvas-toggle" onClick={() => {
|
|
document.querySelector(".offcanvas__info")?.classList.add("info-open");
|
|
document.querySelector(".offcanvas__overlay")?.classList.add("overlay-open");
|
|
}}>
|
|
<i className="fa-solid fa-bars-staggered"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
};
|
|
|
|
export default HeaderMetatron;
|