From 3dd52777beb4b42b2e67cc12b847f9a41170acf2 Mon Sep 17 00:00:00 2001
From: zojgame <zogame002@gmail.com>
Date: Tue, 11 Jun 2024 16:43:00 +0500
Subject: [PATCH] aboutComplex page done

---
 src/components/aboutComplex/RoveHomeSlider.tsx | 2 +-
 src/pages/AboutComplex.tsx                     | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/aboutComplex/RoveHomeSlider.tsx b/src/components/aboutComplex/RoveHomeSlider.tsx
index 561c8e4..4cace65 100644
--- a/src/components/aboutComplex/RoveHomeSlider.tsx
+++ b/src/components/aboutComplex/RoveHomeSlider.tsx
@@ -135,7 +135,7 @@ const RoveHomeSlider = () => {
                 alt=""
                 className="select-none pointer-events-none xl:aspect-video sm:aspect-[7.6/10] aspect-video object-cover xl:h-auto"
               />
-              <div className="flex p-4 flex-col gap-3 bg-white rounded-ee-2xl rounded-es-2xl  sm:w-full w-[calc(100vw-32px)] h-full sm:hidden">
+              <div className="flex p-4 flex-col gap-3 bg-white rounded-ee-2xl rounded-es-2xl sm:hidden sm:w-full w-[calc(100vw-32px)] h-full">
                 <h2 className="text-[#00BED7] font-semibold text-subheadline-m">
                   {slide.title}
                 </h2>
diff --git a/src/pages/AboutComplex.tsx b/src/pages/AboutComplex.tsx
index 639a072..157553c 100644
--- a/src/pages/AboutComplex.tsx
+++ b/src/pages/AboutComplex.tsx
@@ -126,7 +126,7 @@ const AboutComplex = () => {
         } grid grid-cols-12`}
       >
         <div className="flex px-6 py-4 col-span-full h-16 relative">
-          <div className="fixed z-50">
+          <div className="fixed z-[100]">
             <Button
               text="Masterplan"
               icon={<LeftArrowIcon />}
@@ -166,10 +166,10 @@ const AboutComplex = () => {
             ROVE AROUND THE CITY
           </div>
           <div className="xl:col-start-3 col-span-full grid grid-cols-10 gap-6">
-            <div className="xl:col-span-4 grid grid-cols-4 gap-4 order-2 xl:order-1 col-span-full">
+            <div className="xl:col-span-4 xl:grid grid-cols-4 gap-4 order-2 xl:order-1 col-span-full flex flex-nowrap overflow-x-scroll">
               {roveAroundTheCity.map((item) => (
                 <div
-                  className="xl:col-span-2 sm:col-span-1 col-span-2 bg-white rounded-lg flex flex-col p-3"
+                  className="xl:col-span-2 sm:col-span-1 col-span-2 bg-white rounded-lg flex flex-col p-3 sm:min-w-[calc(25vw-24px)] min-w-[calc(50vw-30px)]"
                   key={item.id}
                 >
                   <div className="flex gap-1 items-center">