61 lines
2.6 KiB
Plaintext
61 lines
2.6 KiB
Plaintext
import Link from "next/link";
|
|
import Image from "next/image";
|
|
import logo from "../../../public/assets/photos/logo.svg"
|
|
import styles from "./header.module.css"
|
|
import { useState } from "react";
|
|
|
|
const header = ({ backwardStatus, setbackwardStatus }) => {
|
|
const [menuOpen, setMenuOpen] = useState(false);
|
|
|
|
const toggleMenu = () => {
|
|
setMenuOpen(!menuOpen);
|
|
setbackwardStatus(!menuOpen);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div className={styles.header}>
|
|
<div className={`toggleMenu ${menuOpen ? 'open' : ''}`}>
|
|
<span className="openToggle icon menuIcon" onClick={toggleMenu}></span>
|
|
<div className={`toggleSlider ${menuOpen ? 'open' : ''}`}>
|
|
<span className="closeToggle icon closeIcon" onClick={toggleMenu}>
|
|
منو
|
|
</span>
|
|
<div className="toggleContent">
|
|
<Link href="/main">صفحه اصلی</Link>
|
|
<Link href="/services">خدمات ما</Link>
|
|
<Link href="/customers">مشتریان ما</Link>
|
|
<Link href="/about">درباره ما</Link>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div className={styles.logo}>
|
|
<Image src={logo} alt='logo' width="100px" height="100px" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="container">
|
|
<div className={styles.parent}>
|
|
<div className={styles.content}>
|
|
<Link href="/main">صفحه اصلی</Link>
|
|
<Link href="/services">خدمات ما</Link>
|
|
<Link href="/customers">مشتریان ما</Link>
|
|
<Link href="/about">درباره ما</Link>
|
|
</div>
|
|
<div className={styles.logoContent}>
|
|
<div className={styles.logo}>
|
|
<Image src={logo} alt='logo' width="100px" height="100px" />
|
|
</div>
|
|
<div className={styles.logoTxt}>
|
|
<h1>سپهر دیتا</h1>
|
|
<h1>SEPEHR DATA</h1>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default header; |