diff --git a/.env b/.env index d965dec..9c07060 100644 --- a/.env +++ b/.env @@ -1 +1 @@ -VITE_API_URL=http://192.168.1.250:3000 \ No newline at end of file +VITE_API_URL=http://192.168.1.170:3000 \ No newline at end of file diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 57b6c8f..791e117 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,7 +1,7 @@ -import { Link, NavLink } from "react-router"; +import { Link, NavLink, useLocation } from "react-router"; import LocationIcon from "./icons/LocationIcon"; import clsx from "clsx"; -import { useState } from "react"; +import { useEffect, useRef, useState } from "react"; import Button from "./ui/Button"; import BurgerIcon from "./icons/BurgerIcon"; import { AnimatePresence, motion } from "motion/react"; @@ -18,163 +18,178 @@ function Header() { window.location.href = "/"; } - return ( -
-
-
- logo -
-
- - - -

Dubai

-
-
- -
- -
-
- ); -} - -export default Header; - -function Menu() { const [opened, setOpened] = useState(false); - const { setModal } = useModalStore(); + const { setModal, modal } = useModalStore(); + + const burgerRef = useRef(null); + + const menuRef = useClickAway((e) => { + if (burgerRef.current?.contains(e.target as Node)) return; + setOpened(false); + }); + + const { pathname } = useLocation(); + + useEffect(() => setOpened(false), [pathname]); return ( <> -
- - -
+
+ + + +

Dubai

+
+ +
+ + +
+
+ +
+ {opened && ( - -
-

Projects

-
- {projects.map(({ img, title }, index) => ( + <> + +
+

Projects

+
+ {projects.map(({ img, title }, index) => ( + + {title} + {title} + + ))} - {title} - {title} + Show on Map - ))} - - Show on Map - -
-
-
- - - - -
-
-
-

Brochures

-
-
-

Rove Home Marasi Drive

-
- {[ - "Rove Main Brochure", - "Rove Amenties Brochure", - "Rove Technical Brochure", - ].map((title) => ( - - ))} -
-
-

Rove Home Downtown

-
- {[ - "Rove Main Brochure", - "Rove Amenties Brochure", - "Rove Technical Brochure", - ].map((title) => ( - - ))} +
+ +
+
+

Brochures

+
+
+

Rove Home Marasi Drive

+
+ {[ + "Rove Main Brochure", + "Rove Amenties Brochure", + "Rove Technical Brochure", + ].map((title) => ( + + ))} +
+
+
+

Rove Home Downtown

+
+ {[ + "Rove Main Brochure", + "Rove Amenties Brochure", + "Rove Technical Brochure", + ].map((title) => ( + + ))} +
-
-
-

- For more information, visit our website:{" "} - +

+ For more information, visit our +
+ website:{" "} + + www.irth.ae + +

+ -
- + Privacy Policy + +
+ +
+ )} ); } +export default Header; + function NavItem({ href, title }: { href: string; title: string }) { return ( clsx( "text-btn-m 2xl:px-[1.25vw] 2xl:py-[0.903vw] p-4 2xl:rounded-[0.833vw] rounded-xl transition-colors duration-300 !leading-none max-2xl:text-center max-2xl:bg-[#F3F3F2]", - isActive && "2xl:bg-[#00BED7] 2xl:text-[#FFFFFF]" + isActive && "!bg-[#00BED7] text-[#FFFFFF]" ) } > @@ -231,7 +246,7 @@ function BrochuresDropdown() { animate={{ opacity: 1, x: "0%" }} exit={{ opacity: 0, x: "100%" }} transition={{ bounce: 0, duration: 0.3 }} - className="max-2xl:hidden p-[1.667vw] flex gap-[1.111vw] z-0 justify-stretch items-stretch fixed top-[calc(3.889vw+20px)] left-[58.264vw] w-[32.222vw] rounded-[1.111vw] bg-white shadow-[0_2px_8px_rgba(0,0,0,0.15)]" + className="max-2xl:hidden p-[1.667vw] flex gap-[1.111vw] justify-stretch items-stretch fixed top-[calc(3.889vw+20px)] left-[57.083vw] w-[32.222vw] rounded-[1.111vw] bg-white shadow-[0_2px_8px_rgba(0,0,0,0.15)]" >

Rove Home Marasi Drive

diff --git a/src/components/ModalContainer.tsx b/src/components/ModalContainer.tsx index 06898e7..f364fdf 100644 --- a/src/components/ModalContainer.tsx +++ b/src/components/ModalContainer.tsx @@ -51,10 +51,10 @@ function ModalContainer() { >
-
+
{modal} diff --git a/src/components/ProjectSelect.tsx b/src/components/ProjectSelect.tsx index 55a8416..78e0235 100644 --- a/src/components/ProjectSelect.tsx +++ b/src/components/ProjectSelect.tsx @@ -29,7 +29,7 @@ function ProjectSelect({ {withAll && (
setSelectedProject(null)} @@ -67,7 +67,7 @@ function ProjectSelect({ ))}