fixed layout slider

src/components/UnitList.tsx

@@ -7,28 +7,30 @@ type UnitListProps = {
 
 const UnitList = ({ units, startIndex = 0 }: UnitListProps) => {
   return (
-    <div className="px-8 py-6 h-full">
-      <div className="font-medium text-lg flex w-full gap-[18px] py-2 pr-6 pl-4">
-        <div>№</div>
-        <div className="flex justify-between w-full">
-          <div>Unit</div>
-          <div>Area (m)</div>
-        </div>
-      </div>
-      {units.map((unit, index) => (
-        <div
-          key={unit.id}
-          className={`font-medium text-lg flex w-full gap-[18px] py-2 pr-6 text-[#333333] pl-4  ${
-            index % 2 === 0 ? "bg-[#EAE5E0] rounded-lg" : ""
-          }`}
-        >
-          <div>{startIndex + index + 1}</div>
+    <div className="min-w-[440px] overflow-y-scroll flex flex-col justify-center self-center h-screen">
+      <div className="px-8 py-6 h-full">
+        <div className="font-medium text-lg flex w-full gap-[18px] py-2 pr-6 pl-4">
+          <div>№</div>
           <div className="flex justify-between w-full">
-            <div>{unit.title}</div>
-            <div>{unit.value}</div>
+            <div>Unit</div>
+            <div>Area (m)</div>
           </div>
         </div>
-      ))}
+        {units.map((unit, index) => (
+          <div
+            key={unit.id}
+            className={`font-medium text-lg flex w-full gap-[18px] py-2 pr-6 text-[#333333] pl-4  ${
+              index % 2 === 0 ? "bg-[#EAE5E0] rounded-lg" : ""
+            }`}
+          >
+            <div>{startIndex + index + 1}</div>
+            <div className="flex justify-between w-full">
+              <div>{unit.title}</div>
+              <div>{unit.value}</div>
+            </div>
+          </div>
+        ))}
+      </div>
     </div>
   );
 };

src/components/desktop/Appartment/LayoutModal.tsx

@@ -40,12 +40,10 @@ const LayoutModal = () => {
     <>
       <div className="flex overflow-x-hidden w-screen bg-white h-screen justify-center">
         <div className="flex">
-          <div className="min-w-[440px] overflow-y-scroll flex flex-col justify-center self-center">
-            {currentUnits && (
-              <UnitList units={currentUnits} startIndex={startIndex} />
-            )}
-          </div>
-          <div className="w-full flex flex-col p-8">
+          {currentUnits && (
+            <UnitList units={currentUnits} startIndex={startIndex} />
+          )}
+          <div className="w-full flex flex-col p-8 h-screen">
             <LayoutSlider
               currentView={currentView}
               setCurrentView={setCurrentView}

src/components/mobile/Appartment/LayoutSlider.tsx

@@ -34,7 +34,7 @@ const LayoutSlider = ({ currentView, setCurrentView }: LayoutSliderProps) => {
   });
 
   return (
-    <div className="flex w-full overflow-x-hidden max-w-[1100px] mx-auto overflow-hidden select-none">
+    <div className="flex w-full overflow-x-hidden max-w-[1100px] mx-auto overflow-hidden select-none h">
       <div
         {...handlers}
         className="flex w-full transition-all duration-300"