75 lines
No EOL
1.9 KiB
TypeScript
75 lines
No EOL
1.9 KiB
TypeScript
import { navigation } from "@/shared/config/navigation/navigation";
|
|
import styles from "@/static/header/header.module.css";
|
|
|
|
const Header = () => {
|
|
return (
|
|
<header className={styles.header}>
|
|
<div className={styles["cont-header"]}>
|
|
{/* LEFT */}
|
|
<div className={styles.left}>
|
|
<a href="/">
|
|
<h1>Autli</h1>
|
|
</a>
|
|
</div>
|
|
|
|
{/* RIGHT */}
|
|
<div className={styles.right}>
|
|
{/* Десктопное меню */}
|
|
<nav className={styles["desktop-nav"]}>
|
|
<ul>
|
|
{navigation.map((item) => (
|
|
<li key={item.href}>
|
|
<a href={item.href}>{item.label}</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</nav>
|
|
|
|
{/* Переключатель языка */}
|
|
<a
|
|
href="/en/"
|
|
className={styles["language-toggle"]}
|
|
aria-label="Переключить язык"
|
|
>
|
|
EN
|
|
</a>
|
|
|
|
{/* Переключатель темы */}
|
|
<button
|
|
className={styles["theme-toggle"]}
|
|
id="theme-toggle"
|
|
type="button"
|
|
aria-label="Переключить тему"
|
|
>
|
|
<span className={styles["theme-icon"]}>☾</span>
|
|
</button>
|
|
|
|
{/* Гамбургер */}
|
|
<button
|
|
className={styles.hamburger}
|
|
id="hamburger"
|
|
type="button"
|
|
aria-label="Открыть меню"
|
|
>
|
|
<span />
|
|
<span />
|
|
<span />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Мобильное меню */}
|
|
<nav className={styles["mobile-menu"]}>
|
|
<ul>
|
|
{navigation.map((item) => (
|
|
<li key={item.href}>
|
|
<a href={item.href}>{item.label}</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
);
|
|
};
|
|
|
|
export default Header; |