87 lines
2.9 KiB
React
87 lines
2.9 KiB
React
import { useNavigate } from "react-router-dom";
|
|
import siteLogo from "../assets/Исходники/logo.png";
|
|
import BurgerButton from "./BurgerButton";
|
|
import { useState } from "react";
|
|
import BurgerMenu from "./BurgerMenu";
|
|
|
|
export default function HeaderMobile() {
|
|
const navigate = useNavigate();
|
|
|
|
const [isOpen, setIsOpen] = useState(false);
|
|
|
|
return (
|
|
<>
|
|
<header className="w-full h-27.5 px-6 flex items-center justify-between ">
|
|
<div className="flex items-center gap-1">
|
|
<BurgerButton
|
|
isOpen={isOpen}
|
|
onClick={() => {
|
|
setIsOpen(!isOpen);
|
|
}}
|
|
/>
|
|
<button
|
|
className="flex flex-col items-center text-sm tracking-widest text-gold"
|
|
onClick={() => navigate("/")}
|
|
>
|
|
<img
|
|
src={siteLogo}
|
|
alt="Лого"
|
|
className="w-12 h-12 object-contain"
|
|
/>
|
|
<span>FISH FISH</span>
|
|
</button>
|
|
</div>
|
|
<div className="flex items-center">
|
|
<button className="text-slate-200 hover:text-gold transition-colors duration-200 pr-7">
|
|
<svg
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<circle
|
|
cx="12"
|
|
cy="7.5"
|
|
r="4"
|
|
stroke="currentColor"
|
|
strokeLinecap="square"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M21 21H3C3 17.6863 5.68629 15 9 15H15C18.3137 15 21 17.6863 21 21Z"
|
|
stroke="currentColor"
|
|
strokeLinecap="square"
|
|
/>
|
|
</svg>
|
|
</button>
|
|
<button
|
|
className="text-slate-200 hover:text-gold transition-colors duration-200"
|
|
onClick={() => navigate("/cart")}
|
|
>
|
|
<svg
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M16.2654 8H7.73459C6.73929 8 5.89545 8.73186 5.75469 9.71716L4.32612 19.7172C4.154 20.922 5.08892 22 6.30602 22H17.694C18.9111 22 19.846 20.922 19.6739 19.7172L18.2453 9.71716C18.1046 8.73186 17.2607 8 16.2654 8Z"
|
|
stroke="currentColor"
|
|
/>
|
|
<path
|
|
d="M9 10V5C9 3.89543 9.89543 3 11 3H13C14.1046 3 15 3.89543 15 5V10"
|
|
stroke="currentColor"
|
|
/>
|
|
<circle cx="9" cy="10" r="1" fill="currentColor" />
|
|
<circle cx="15" cy="10" r="1" fill="currentColor" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</header>
|
|
<BurgerMenu isOpen={isOpen} onClose={() => setIsOpen(false)} />
|
|
</>
|
|
);
|
|
}
|