inmake/irth-new-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Refine AboutMarasiDrive component with enhanced layout adjustments, including improved spacing and responsive design for better visual consistency across different screen sizes.

Browse Source
This commit is contained in:
inmake
2025-06-23 17:30:19 +05:00
parent 48feca46a2
commit 735e8ad797
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AboutMarasiDrive.tsx
+6 -6
View File
@@ -158,9 +158,9 @@ function AboutMarasiDrive() {
<MarasiDriveInteriorsSlider />
</section>
</div>
<div className="2xl:sticky">
<section className="bg-white w-full overflow-clip flex flex-col 2xl:gap-[4.444vw] 2xl:pt-[9.444vw] 2xl:px-[2.222vw] 2xl:pb-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 pb-8">
<div className="flex flex-col items-center 2xl:gap-[2.222vw]">
<div className="2xl:sticky relative">
<section className="bg-white w-full overflow-clip flex flex-col 2xl:gap-[4.444vw] gap-12 2xl:pt-[9.444vw] 2xl:px-[2.222vw] 2xl:pb-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 pb-8">
<div className="flex flex-col items-center 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6">
<h2 className="font-mixcase-unmixed text-h1 text-center whitespace-pre-line">
{`A home for the young
and young in heart`}
@@ -172,7 +172,7 @@ function AboutMarasiDrive() {
</p>
</div>
<img
className="rounded-[1.667vw]"
className="2xl:rounded-[1.667vw] rounded-2xl max-md:aspect-[4/3] object-cover"
src="/images/about-complex/marasi-drive/business_bay.jpg"
alt=""
/>
@@ -181,8 +181,8 @@ function AboutMarasiDrive() {
className="bg-white w-full overflow-clip h-[calc(27.639vw*5)] 2xl:pt-[9.444vw] 2xl:px-[2.222vw] 2xl:pb-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 pb-8"
ref={target}
>
<div className="flex flex-col 2xl:gap-[4.444vw] sticky top-[5vw]">
<div className="flex flex-col items-center 2xl:gap-[2.222vw]">
<div className="flex flex-col 2xl:gap-[4.444vw] md:max-2xl:gap-16 gap-12 2xl:sticky top-[5vw]">
<div className="flex flex-col items-center 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6">
<h2 className="font-mixcase-unmixed text-h1 text-center whitespace-pre-line">
{`Explore the neighbourhood`}
</h2>