fix map

src/components/MultiRangeSlider.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import { useState, useRef, useEffect } from "react";
 import RangeSlider from "react-range-slider-input";
 // import "react-range-slider-input/dist/style.css";
@@ -9,7 +10,7 @@ interface MultiRangeSliderProps {
   max: number;
 }
 
-const MultiRangeSlider = ({ min, max, onChange }: MultiRangeSliderProps) => {
+const MultiRangeSlider = ({ min, max }: MultiRangeSliderProps) => {
   const [firstValue, setFirstValue] = useState(min);
   const [secondValue, setSecondValue] = useState(max);
   const firstInputRef = useRef(null);

src/components/complexWingPage/SkygardenDescription.tsx

@@ -1,5 +1,3 @@
-interface ISkygardenDescriptionProps {}
-
 const SkygardenDescription = () => {
   return (
     <div

src/components/complexWingPage/SkygardenSidebar/LayoutSlider.tsx

@@ -26,22 +26,22 @@ const LayoutSlider = () => {
         currentLabel={currentLabel}
         onClick={handleOnSwitchClick}
       />
-      <div className="flex w-full overflow-x-hidden max-w-[1100px] mx-auto overflow-hidden select-none h">
+      <div className="flex w-full overflow-x-hidden max-w-[1100px] mx-auto overflow-hidden select-none pt-6">
         <div
           className="flex w-full transition-all duration-300"
           style={{
             transform: `translateX(${
-              12.5 + (Number(currentLabel.id) - 1) * -100
+              0 + (Number(currentLabel.id) - 1) * -100
             }%)`,
           }}
         >
           <div
-            className={`min-w-full flex flex-col px-6 transition-all duration-300 `}
+            className={`min-w-full flex flex-col px-6 transition-all duration-300 items-center`}
           >
             <SkygardenIndoorLayout />
           </div>
           <div
-            className={`min-w-full flex flex-col px-6 transition-all duration-300 `}
+            className={`min-w-full flex flex-col px-6 transition-all duration-300 items-center`}
           >
             <SkygardenOutdoorLayout />
           </div>

src/components/complexWingPage/SkygardenSidebar/SkygardenSidebar.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { useState } from "react";
 import AmphitheatreIcon from "../../icons/activities/AmphitheatreIcon";
 import BoulderingWallIcon from "../../icons/activities/BoulderingWallIcon";
 import ChangingRoomsIcon from "../../icons/activities/ChangingRoomsIcon";
@@ -18,26 +17,10 @@ import SunLoungingDeckIcon from "../../icons/activities/SunLoungingDeckIcon";
 import SuspendedLoungingNetsIcon from "../../icons/activities/SuspendedLoungingNetsIcon";
 import WellnessFeaturesIcon from "../../icons/activities/WellnessFeaturesIcon";
 import ActivityCard from "./ActivityCard";
-import SkygardenIndoorLayout from "./SkygardenIndoorLayout";
 import ZoneSlider from "./ZoneSlider";
-import { ISwitchLabel } from "../../../types/switchLabel";
-import SwitchToggle from "../../SwitchToggle";
 import LayoutSlider from "./LayoutSlider";
 
-const skygardenLayouts: ISwitchLabel[] = [
-  { id: "1", label: "Indoor" },
-  { id: "2", label: "Outdoor" },
-];
-
 const SkygardenSidebar = () => {
-  const [currentLabel, setCurrentLabel] = useState<ISwitchLabel>(
-    skygardenLayouts[0]
-  );
-
-  const handleOnSwitchClick = (label: ISwitchLabel) => {
-    setCurrentLabel(label);
-  };
-
   return (
     <div className="absolute h-full right-0 w-full z-30 bg-[#F3F3F2] py-6  flex flex-col top-[56px]">
       <div className="flex justify-between pb-2 border-b border-b-[#E2E2DC] mx-6">
@@ -52,22 +35,7 @@ const SkygardenSidebar = () => {
         </div>
       </div>
       <div className="overflow-y-scroll py-6">
-        <div className="px-4  bg-white font-semibold text-caption-m rounded-lg justify-center items-center mb-4 pb-4 mx-6 flex flex-col gap-1 pt-4">
-          {/* <SwitchToggle
-            labels={skygardenLayouts}
-            currentLabel={currentLabel}
-            onClick={handleOnSwitchClick}
-          /> */}
-          {/* {
-            <div className="relative">
-              <div className="w-1/2">
-                <SkygardenLayout />
-              </div>
-              <div className="w-full">
-                <SkygardenLayout />
-              </div>
-            </div>
-          } */}
+        <div className="px-4 bg-white font-semibold text-caption-m rounded-lg justify-center items-center mb-4 pb-4 mx-6 flex flex-col gap-1 pt-4">
           <LayoutSlider />
         </div>
         <div className="grid grid-cols-3 gap-4 border-t pt-4 pb-4 mx-6">

src/components/header/Navbar/NavbarTabDesktop.tsx

@@ -26,8 +26,8 @@ const NavbarTabDesktop = ({
         {tab.value}
       </div>
       {tab.count !== 0 && (
-        <div className="absolute top-0 right-0 w-4 h-4 bg-[#00BED7] rounded-full text-white text-[10px] flex items-center justify-center">
-          {tab.count}
+        <div className="absolute top-0 right-0 w-4 h-4 bg-[#00BED7] rounded-full text-white text-[10px] flex items-center justify-center pt-0.5 pr-[1px]">
+          <span className="leading-none">{tab.count}</span>
         </div>
       )}
     </button>

src/components/masterplanPage/map/Map.tsx

@@ -36,7 +36,8 @@ const Map = () => {
     >
       <TransformComponent
         wrapperClass={
-          "h-[calc(100vh+150px)] w-[calc(100vw+400px)] top-[-50px] left-[-200px]"
+          "h-[calc(100vh+150px)] w-[calc(100vw+400px)] top-[-50px]"
+          // "h-[calc(100vh+150px)] w-[calc(100vw+400px)] top-[-50px] left-[-200px]"
         }
       >
         <ImageMarker

src/pages/Masterplan.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/exhaustive-deps */
 import { useEffect } from "react";
 import useModal from "../store/useModal";
 import Map from "../components/masterplanPage/map/Map";