From 7814db6868add897535b34488e8389b40dfa3bfd Mon Sep 17 00:00:00 2001
From: inmake <inmake.ru@gmail.com>
Date: Sat, 2 Nov 2024 18:02:53 +0500
Subject: [PATCH] upd

---
 .../complexPage/ComplexTopPanel.tsx           | 20 ++++++++--------
 client/src/components/multiRangeSlider.css    |  2 +-
 client/src/pages/ComplexWingPage.tsx          | 24 +++++++++++--------
 client/src/pages/FloorSelectionMobilePage.tsx |  2 +-
 client/src/pages/SearchPage.tsx               |  2 ++
 client/yarn.lock                              |  6 ++---
 6 files changed, 31 insertions(+), 25 deletions(-)

diff --git a/client/src/components/complexPage/ComplexTopPanel.tsx b/client/src/components/complexPage/ComplexTopPanel.tsx
index b752c98..932e2cd 100644
--- a/client/src/components/complexPage/ComplexTopPanel.tsx
+++ b/client/src/components/complexPage/ComplexTopPanel.tsx
@@ -2,26 +2,21 @@ import { useNavigate } from "react-router-dom";
 import InfoIcon from "../icons/InfoIcon";
 import Button3 from "../Button3";
 import ArrowLeftIcon from "../icons/ArrowLeftIcon";
+import { isMobile } from "react-device-detect";
 
 const ComplexTopPanel = () => {
   const navigate = useNavigate();
 
   return (
     <div className="absolute top-0 left-0 z-20 w-full p-3 mt-14">
-      <div className="flex sm:gap-2 max-sm:justify-between">
-        <div>
+      <div className="grid justify-between w-full grid-cols-3 sm:gap-2">
+        <div className="flex items-start gap-2">
           <Button3
             size="small"
             icon={<ArrowLeftIcon />}
             onlyIcon
-            onClick={() => navigate("/")}
+            onClick={() => (isMobile ? navigate("/") : navigate("/masterplan/1"))}
           />
-        </div>
-        <div className="font-semibold text-center text-white sm:hidden">
-          <p className="text-base">ROVE Home Marasi Drive</p>
-          <p className="text-xs">Select a wing</p>
-        </div>
-        <div>
           <Button3
             variant="secondary"
             icon={<InfoIcon className="w-5 h-5" />}
@@ -30,9 +25,14 @@ const ComplexTopPanel = () => {
           >
             About Projects
           </Button3>
+        </div>
+        <div className="font-semibold text-center text-white drop-shadow">
+          <p className="text-base lg:text-xl">ROVE Home Marasi Drive</p>
+        </div>
+        <div className="flex items-start justify-end">
           <Button3
             variant="secondary"
-            icon={<InfoIcon />}
+            icon={<InfoIcon className="w-5 h-5" />}
             onlyIcon
             className="sm:hidden"
             onClick={() => navigate("/about-projects")}
diff --git a/client/src/components/multiRangeSlider.css b/client/src/components/multiRangeSlider.css
index 47c24e6..e1dc835 100644
--- a/client/src/components/multiRangeSlider.css
+++ b/client/src/components/multiRangeSlider.css
@@ -75,7 +75,7 @@
 }
 
 .range-slider input[type="range"] {
-  -webkit-appearance: none;
+  appearance: none;
   pointer-events: none;
   position: absolute;
   z-index: 2;
diff --git a/client/src/pages/ComplexWingPage.tsx b/client/src/pages/ComplexWingPage.tsx
index 54c8a80..fcc9c43 100644
--- a/client/src/pages/ComplexWingPage.tsx
+++ b/client/src/pages/ComplexWingPage.tsx
@@ -66,7 +66,7 @@ function ComplexWingPage() {
     if (path["data-name"].includes("floor")) {
       const wing = path["data-name"].split(" ")[0].toLowerCase() as "east" | "west";
       const floor = path["data-name"].split(" ")[1];
-      
+
       setSidebarComponent({
         element: <FloorPlan wing={wing} floor={floor} />,
         name: "Floor",
@@ -122,20 +122,14 @@ function ComplexWingPage() {
 
           <div className="absolute top-0 left-0 z-10 w-full">
             <div className="p-3 mt-14">
-              <div className="flex sm:gap-2 max-sm:justify-between">
-                <div className="">
+              <div className="grid justify-between w-full grid-cols-3 sm:gap-2">
+                <div className="flex items-start gap-2">
                   <Button3
                     size="small"
                     icon={<ArrowLeftIcon />}
                     onlyIcon
                     onClick={() => (isMobile ? navigate("/") : navigate("/masterplan/1"))}
                   />
-                </div>
-                <div className="font-semibold text-center text-white sm:hidden">
-                  <p className="text-base">ROVE Home Marasi Drive</p>
-                  <p className="text-xs">Select a wing</p>
-                </div>
-                <div className="">
                   <Button3
                     variant="secondary"
                     icon={<InfoIcon className="w-5 h-5" />}
@@ -144,9 +138,19 @@ function ComplexWingPage() {
                   >
                     About Projects
                   </Button3>
+                </div>
+                <div
+                  className={`font-semibold text-center text-white drop-shadow transition-opacity ${
+                    sidebarComponent ? "opacity-0" : "opacity-100"
+                  }`}
+                >
+                  <p className="text-base lg:text-xl">ROVE Home Marasi Drive</p>
+                  <p className="text-xs">Select a {isMobile ? "wing" : "floor"}</p>
+                </div>
+                <div className="flex items-start justify-end">
                   <Button3
                     variant="secondary"
-                    icon={<InfoIcon />}
+                    icon={<InfoIcon className="w-5 h-5" />}
                     onlyIcon
                     className="sm:hidden"
                     onClick={() => navigate("/about-projects")}
diff --git a/client/src/pages/FloorSelectionMobilePage.tsx b/client/src/pages/FloorSelectionMobilePage.tsx
index ccd3cd2..3641329 100644
--- a/client/src/pages/FloorSelectionMobilePage.tsx
+++ b/client/src/pages/FloorSelectionMobilePage.tsx
@@ -254,7 +254,7 @@ function FloorSelectionMobilePage({ wing, onUnselectWing, onSelectPath }: Props)
             <div className="w-full p-4 space-y-4 bg-white rounded-lg">
               <div className="relative flex items-start justify-between pb-4 border-b border-[#E2E2DC]">
                 <div>
-                  <p className="font-semibold text-[#0D1922]">{selectedPathName?.split(" ")[1]} floor</p>
+                  <p className="font-semibold text-[#0D1922]">{selectedPathName?.replace(/west|east/gi, "")}</p>
                   <div className="">
                     <p className="text-[#0D1922]/70 text-xs font-semibold capitalize">{wing} Wing</p>
                     {/* <div className="w-1 h-1 bg-[#E2E2DC] rounded-full"></div> */}
diff --git a/client/src/pages/SearchPage.tsx b/client/src/pages/SearchPage.tsx
index b1adc63..349511d 100644
--- a/client/src/pages/SearchPage.tsx
+++ b/client/src/pages/SearchPage.tsx
@@ -18,6 +18,8 @@ import { isMobile } from "react-device-detect";
 import CloseIcon from "../components/icons/CloseIcon";
 import FiltersIcon from "../components/icons/FiltersIcon";
 import Button3 from "../components/Button3";
+// import "react-range-slider-input/dist/style.css";
+import "../components/multiRangeSlider.css";
 
 function SearchPage() {
   const [units, setUnits] = useState<IUnit[]>([]);
diff --git a/client/yarn.lock b/client/yarn.lock
index 67ba08f..8df2e22 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -1191,9 +1191,9 @@ convert-source-map@^2.0.0:
   integrity sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==
 
 core-js@^3.22.4:
-  version "3.37.1"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.37.1.tgz#d21751ddb756518ac5a00e4d66499df981a62db9"
-  integrity sha512-Xn6qmxrQZyB0FFY8E3bgRXei3lWDJHhvI+u0q9TKIYM49G8pAr0FgnnrFRAmsbptZL1yxRADVXn+x5AGsbBfyw==
+  version "3.38.1"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.38.1.tgz#aa375b79a286a670388a1a363363d53677c0383e"
+  integrity sha512-OP35aUorbU3Zvlx7pjsFdu1rGNnD4pgw/CWoYzRY3t2EzoVT7shKHY1dlAy3f41cGIO7ZDPQimhGFTlEYkG/Hw==
 
 cross-env@^7.0.3:
   version "7.0.3"