|
|
@ -10,23 +10,6 @@ import Search from "../Search"; |
|
|
|
import SearchResult from "./SearchResult"; |
|
|
|
import SearchResult from "./SearchResult"; |
|
|
|
import Loading from "../Loading"; |
|
|
|
import Loading from "../Loading"; |
|
|
|
|
|
|
|
|
|
|
|
//assets
|
|
|
|
|
|
|
|
import logoIcon from "../../assets/icons/logo.svg"; |
|
|
|
|
|
|
|
import qrIcon from "../../assets/icons/qr-white.svg"; |
|
|
|
|
|
|
|
import qrBlueIcon from "../../assets/icons/qr-blue.svg"; |
|
|
|
|
|
|
|
import arIcon from "../../assets/icons/ar-white.svg"; |
|
|
|
|
|
|
|
import arBlueIcon from "../../assets/icons/ar-blue.svg"; |
|
|
|
|
|
|
|
import hamburgerIcon from "../../assets/icons/hamburger.svg"; |
|
|
|
|
|
|
|
import hamburgerBlueIcon from "../../assets/icons/hamburger-blue.svg"; |
|
|
|
|
|
|
|
import arrowBlueIcon from "../../assets/icons/arrow-right-blue.svg"; |
|
|
|
|
|
|
|
import arrowWhiteIcon from "../../assets/icons/arrow-left-white.svg"; |
|
|
|
|
|
|
|
import dotsMenuDarkIcon from "../../assets/icons/dots-menu-dark.svg"; |
|
|
|
|
|
|
|
import bookmarkDeactiveDarkIcon from "../../assets/icons/bookmark-deactive-dark.svg"; |
|
|
|
|
|
|
|
import bookmarkActiveDarkIcon from "../../assets/icons/bookmark-active-dark.svg"; |
|
|
|
|
|
|
|
import dotsMenuLightIcon from "../../assets/icons/dots-menu-light.svg"; |
|
|
|
|
|
|
|
import bookmarkDeactiveLightIcon from "../../assets/icons/bookmark-deactive-light.svg"; |
|
|
|
|
|
|
|
import bookmarkActiveLightIcon from "../../assets/icons/bookmark-active-light.svg"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function Navbar({ |
|
|
|
function Navbar({ |
|
|
|
getCartProducts, |
|
|
|
getCartProducts, |
|
|
|
getUserFavorite, |
|
|
|
getUserFavorite, |
|
|
@ -99,7 +82,11 @@ function Navbar({ |
|
|
|
to="/" |
|
|
|
to="/" |
|
|
|
className="flex items-center text-2xl font-black text-green7B" |
|
|
|
className="flex items-center text-2xl font-black text-green7B" |
|
|
|
> |
|
|
|
> |
|
|
|
<img src={logoIcon} className="w-8 relative bottom-1 ml-1" alt="" /> |
|
|
|
<img |
|
|
|
|
|
|
|
src={"/assets/icons/logo-small.svg"} |
|
|
|
|
|
|
|
className="w-8 relative bottom-1 ml-1" |
|
|
|
|
|
|
|
alt="" |
|
|
|
|
|
|
|
/> |
|
|
|
{window.t("دانوین")} |
|
|
|
{window.t("دانوین")} |
|
|
|
</Link> |
|
|
|
</Link> |
|
|
|
|
|
|
|
|
|
|
@ -125,7 +112,7 @@ function Navbar({ |
|
|
|
to="/" |
|
|
|
to="/" |
|
|
|
className="lg:hidden absolute left-1/2 transform -translate-y-1/2 top-1/2 -translate-x-1/2" |
|
|
|
className="lg:hidden absolute left-1/2 transform -translate-y-1/2 top-1/2 -translate-x-1/2" |
|
|
|
> |
|
|
|
> |
|
|
|
<img src={logoIcon} className="w-6 h-8" /> |
|
|
|
<img src={"/assets/icons/logo-small.svg"} className="w-6 h-8" /> |
|
|
|
</Link> |
|
|
|
</Link> |
|
|
|
)} |
|
|
|
)} |
|
|
|
{/* desktop */} |
|
|
|
{/* desktop */} |
|
|
@ -136,17 +123,25 @@ function Navbar({ |
|
|
|
<span className="w-2.5 h-2.5 rounded-full bg-redFF1 absolute -left-1 -top-1 animate-bounce"></span> |
|
|
|
<span className="w-2.5 h-2.5 rounded-full bg-redFF1 absolute -left-1 -top-1 animate-bounce"></span> |
|
|
|
<img |
|
|
|
<img |
|
|
|
onClick={() => setDrawerOpen((prevState) => !prevState)} |
|
|
|
onClick={() => setDrawerOpen((prevState) => !prevState)} |
|
|
|
src={isDark ? hamburgerIcon : hamburgerBlueIcon} |
|
|
|
src={ |
|
|
|
|
|
|
|
isDark |
|
|
|
|
|
|
|
? "/assets/icons/hamburger-white.svg" |
|
|
|
|
|
|
|
: "/assets/icons/hamburger-primary.svg" |
|
|
|
|
|
|
|
} |
|
|
|
alt="" |
|
|
|
alt="" |
|
|
|
className="w-7 h-7.5" |
|
|
|
className="w-7" |
|
|
|
/> |
|
|
|
/> |
|
|
|
</> |
|
|
|
</> |
|
|
|
)} |
|
|
|
)} |
|
|
|
{!title && back ? ( |
|
|
|
{!title && back ? ( |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? arrowWhiteIcon : arrowBlueIcon} |
|
|
|
src={ |
|
|
|
alt="back" |
|
|
|
isDark |
|
|
|
className={`w-6 ${isDark ? "transform rotate-180" : ""}`} |
|
|
|
? "/assets/icons/arrow-white.svg" |
|
|
|
|
|
|
|
: "/assets/icons/arrow-primary.svg" |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
alt="بازگشت" |
|
|
|
|
|
|
|
className="w-6" |
|
|
|
onClick={() => navigation(-1)} |
|
|
|
onClick={() => navigation(-1)} |
|
|
|
/> |
|
|
|
/> |
|
|
|
) : null} |
|
|
|
) : null} |
|
|
@ -186,7 +181,11 @@ function Navbar({ |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? qrIcon : qrBlueIcon} |
|
|
|
src={ |
|
|
|
|
|
|
|
isDark |
|
|
|
|
|
|
|
? "/assets/icons/qr-white.svg" |
|
|
|
|
|
|
|
: "/assets/icons/qr-primary.svg" |
|
|
|
|
|
|
|
} |
|
|
|
alt="" |
|
|
|
alt="" |
|
|
|
className="w-6" |
|
|
|
className="w-6" |
|
|
|
/> |
|
|
|
/> |
|
|
@ -201,7 +200,11 @@ function Navbar({ |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? arIcon : arBlueIcon} |
|
|
|
src={ |
|
|
|
|
|
|
|
isDark |
|
|
|
|
|
|
|
? "/assets/icons/ar-white.svg" |
|
|
|
|
|
|
|
: "/assets/icons/ar-primary.svg" |
|
|
|
|
|
|
|
} |
|
|
|
alt="" |
|
|
|
alt="" |
|
|
|
className="w-6" |
|
|
|
className="w-6" |
|
|
|
/> |
|
|
|
/> |
|
|
@ -213,7 +216,7 @@ function Navbar({ |
|
|
|
<Loading size={2} color="bg-green-500" /> |
|
|
|
<Loading size={2} color="bg-green-500" /> |
|
|
|
) : isActiveBookmark ? ( |
|
|
|
) : isActiveBookmark ? ( |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? bookmarkActiveDarkIcon : bookmarkActiveLightIcon} |
|
|
|
src={isDark ? "/assets/icons/bookmark-fill-white.svg" : "/assets/icons/bookmark-fill-primary.svg"} |
|
|
|
alt="bookmark" |
|
|
|
alt="bookmark" |
|
|
|
className="w-7 flex lg:hidden" |
|
|
|
className="w-7 flex lg:hidden" |
|
|
|
onClick={() => |
|
|
|
onClick={() => |
|
|
@ -227,7 +230,7 @@ function Navbar({ |
|
|
|
) : ( |
|
|
|
) : ( |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={ |
|
|
|
src={ |
|
|
|
isDark ? bookmarkDeactiveDarkIcon : bookmarkDeactiveLightIcon |
|
|
|
isDark ? '/assets/icons/bookmark-white.svg' : '/assets/icons/bookmark-primary.svg' |
|
|
|
} |
|
|
|
} |
|
|
|
alt="bookmark" |
|
|
|
alt="bookmark" |
|
|
|
className="w-7 flex lg:hidden" |
|
|
|
className="w-7 flex lg:hidden" |
|
|
@ -237,18 +240,24 @@ function Navbar({ |
|
|
|
) : null} |
|
|
|
) : null} |
|
|
|
{menu && ( |
|
|
|
{menu && ( |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? dotsMenuDarkIcon : dotsMenuLightIcon} |
|
|
|
src={ |
|
|
|
alt="menu" |
|
|
|
isDark |
|
|
|
|
|
|
|
? "/assets/icons/dots-white.svg" |
|
|
|
|
|
|
|
: "/assets/icons/dots-primary.svg" |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
alt="منو" |
|
|
|
className="w-7 mr-2 flex lg:hidden" |
|
|
|
className="w-7 mr-2 flex lg:hidden" |
|
|
|
/> |
|
|
|
/> |
|
|
|
)} |
|
|
|
)} |
|
|
|
{title && back ? ( |
|
|
|
{title && back ? ( |
|
|
|
<img |
|
|
|
<img |
|
|
|
src={isDark ? arrowWhiteIcon : arrowBlueIcon} |
|
|
|
src={ |
|
|
|
alt="back" |
|
|
|
isDark |
|
|
|
className={`w-6 flex lg:hidden transform ${ |
|
|
|
? "/assets/icons/arrow-white.svg" |
|
|
|
isDark ? "" : "-rotate-180" |
|
|
|
: "/assets/icons/arrow-primary.svg" |
|
|
|
}`}
|
|
|
|
} |
|
|
|
|
|
|
|
alt="بازگشت" |
|
|
|
|
|
|
|
className={`w-6 flex lg:hidden transform -rotate-180`} |
|
|
|
onClick={() => navigation(-1)} |
|
|
|
onClick={() => navigation(-1)} |
|
|
|
/> |
|
|
|
/> |
|
|
|
) : null} |
|
|
|
) : null} |
|
|
@ -268,7 +277,7 @@ function Navbar({ |
|
|
|
</select> |
|
|
|
</select> |
|
|
|
|
|
|
|
|
|
|
|
<img |
|
|
|
<img |
|
|
|
src={'/assets/icons/search-primary.svg'} |
|
|
|
src={"/assets/icons/search-primary.svg"} |
|
|
|
alt="" |
|
|
|
alt="" |
|
|
|
className="w-7 ml-3 cursor-pointer lg:flex hidden" |
|
|
|
className="w-7 ml-3 cursor-pointer lg:flex hidden" |
|
|
|
onClick={() => setOverLayer(true)} |
|
|
|
onClick={() => setOverLayer(true)} |
|
|
|