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

Update environment variables, fix import paths, enhance button variants, and improve layout responsiveness across components. Remove unused ApartmentItem and FavoritesPage components.

Browse Source
This commit is contained in:
inmake
2025-06-19 14:56:32 +05:00
parent 4818f29fc7
commit f330e0ca34
15 changed files with 88 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env
+3 -2
View File
@@ -1,2 +1,3 @@
VITE_API_URL=http://192.168.1.224:4002
# VITE_API_URL=http://194.26.138.94:4002
# VITE_API_URL=http://192.168.1.224:4002
# VITE_API_URL=http://194.26.138.94:4002
VITE_API_URL=http://localhost:4002
src/components/AboutMarasiDrive.tsx
+26 -14
View File
@@ -1,7 +1,6 @@
import {
marasiDriveFeatures,
marasiDriveDescriptionBadges,
marasiDriveExpandable,
marasiDriveMapCards,
} from "../data/aboutMarasiDrive";
import MarariDriveNeighboursSlider from "./MarasiDriveNeighboursSlider";
@@ -82,7 +81,7 @@ function AboutMarasiDrive() {
<div className="2xl:sticky relative 2xl:top-[-134vw]">
<section className="bg-white w-full overflow-clip 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 flex flex-col 2xl:gap-[4.444vw] md:max-2xl:gap-12 gap-10">
<div className="flex flex-col 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 items-center">
<h2 className="font-mixcase-unmixed md:text-h1 text-[28px] leading-none text-center max-md:whitespace-pre-line ">
<h2 className="font-mixcase-unmixed text-h1 text-center max-md:whitespace-pre-line">
{`What makes
a Rove Home?`}
</h2>
@@ -106,8 +105,9 @@ function AboutMarasiDrive() {
</section>
<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 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 items-center">
<h2 className="font-mixcase-unmixed text-h1 text-center">
Expandable Living Solutions
<h2 className="font-mixcase-unmixed text-h1 text-center max-md:whitespace-pre-line">
{`Expandable living
solutions`}
</h2>
<p className="text-s opacity-70 whitespace-pre-line text-center">
{`ORI introduces a revolutionary solution to apartment living,
@@ -119,16 +119,28 @@ function AboutMarasiDrive() {
))}
</div>
</div>
<div className="flex gap-[1.111vw]">
{marasiDriveExpandable.map((image) => (
<div key={image}>
<img
src={image}
alt="Expandable Living Solutions"
className="rounded-[1.111vw]"
/>
</div>
))}
<div className="2xl:flex max-2xl:grid 2xl:grid-cols-3 md:max-2xl:grid-cols-2 grid-cols-1 2xl:gap-[1.111vw] gap-4">
<div>
<img
src="/images/about-complex/marasi-drive/living_solution1.jpg"
alt=""
className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover md:max-2xl:aspect-square"
/>
</div>
<div>
<img
src="/images/about-complex/marasi-drive/living_solution2.jpg"
alt=""
className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover md:max-2xl:aspect-square"
/>
</div>
<div className="md:max-2xl:col-span-2">
<img
src="/images/about-complex/marasi-drive/living_solution3.jpg"
alt=""
className="2xl:rounded-[1.111vw] rounded-2xl w-full object-cover max-2xl:aspect-[12/9]"
/>
</div>
</div>
</section>
<section className="bg-white w-full overflow-clip flex flex-col 2xl:gap-[4.444vw] 2xl:pt-[9.444vw] 2xl:pb-[15vw] 2xl:px-[2.222vw] md:max-2xl:pt-[104px] md:max-2xl:px-6 md:max-2xl:pb-8 pt-16 px-4 max-md:pb-8">
src/components/MarasiDriveInteriorsSlider.tsx
+2 -2
View File
@@ -77,14 +77,14 @@ function MarasiDriveInteriorsSlider() {
<Button
onlyIcon
disabled={currentIndex === marasiDriveInspiredInteriors.length - 1}
className="!bg-[#F3F3F2] absolute 2xl:right-[27.778vw] top-[15.833vw]"
className="absolute 2xl:right-[27.778vw] top-[15.833vw]"
onClick={() =>
setCurrentIndex(
Math.min(currentIndex + 1, marasiDriveInspiredInteriors.length - 1)
)
}
>
<span className="2xl:size-[1.389vw] size-5 text-[#0D1922] in-disabled:text-[#0D1922]/40">
<span className="2xl:size-[1.389vw] size-5">
<ChevronRightIcon />
</span>
</Button>
src/components/UnitCard.tsx
+1
View File
@@ -25,6 +25,7 @@ function UnitCard({ unit }: { unit: Unit }) {
return (
<Link
target="_blank"
to={`/complex/${complexNameToSlug(unit.project)}/${unit.unitNo}`}
className="2xl:p-[1.111vw] p-4 2xl:rounded-[1.111vw] rounded-2xl flex flex-col justify-between 2xl:gap-[1.111vw] gap-4 bg-white 2xl:aspect-[332/396] md:max-2xl:aspect-[352/396] aspect-[328/396]"
>
src/components/UnitTypeItem.tsx
+13 -3
View File
@@ -21,6 +21,14 @@ function UnitTypeItem({
texts,
area,
}: UnitTypeItemProps) {
function handleShare() {
// navigator.clipboard.writeText(window.location.href);
navigator.share({
title: title,
url: window.location.href,
});
}
return (
<div className="2xl:p-[2.222vw] md:max-2xl:p-[3.125vw] p-4 bg-white flex 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 max-2xl:flex-col">
<div className="bg-[#F3F3F2] 2xl:aspect-[1028/664] md:max-2xl:aspect-[720/616] aspect-square 2xl:w-[71.389vw] w-full 2xl:rounded-[1.111vw] md:max-2xl:rounded-2xl rounded-xl" />
@@ -33,7 +41,7 @@ function UnitTypeItem({
{area}
</p>
</div>
<Button onlyIcon variant="secondary">
<Button onlyIcon variant="secondary" onClick={handleShare}>
<span className="2xl:size-[1.389vw] size-5 text-[#0D1922]">
<ShareIcon />
</span>
@@ -69,10 +77,12 @@ function UnitTypeItem({
</div>
</div>
<div className="2xl:gap-[0.556vw] flex 2xl:flex-col sticky 2xl:bottom-[2.222vw] bottom-0 md:max-2xl:-mx-6 md:max-2xl:p-6 max-md:-mx-4 max-md:p-4 bg-white md:max-2xl:gap-4 gap-2 max-2xl:rounded-t-2xl max-2xl:shadow-[0_-4px_20px_#0000000D]">
<Button variant="secondary" className="!bg-[#F3F3F2] w-full">
<Button variant="primary" className="w-full">
Virtual tour
</Button>
<Button className="w-full">Show options</Button>
<Button variant="cta" className="w-full">
Show options
</Button>
</div>
</div>
</div>
src/pages/ApartmentItem.tsx → src/components/_ApartmentItem.tsx
+4 -4
View File
@@ -1,7 +1,7 @@
import HeartIcon from "../components/icons/HeartIcon";
import PlayIcon from "../components/icons/PlayIcon";
import ShareIcon from "../components/icons/ShareIcon";
import Button from "../components/ui/Button";
import HeartIcon from "./icons/HeartIcon";
import PlayIcon from "./icons/PlayIcon";
import ShareIcon from "./icons/ShareIcon";
import Button from "./ui/Button";
interface ApartmentItemProps {
title: string;
src/components/ui/BrochureButton.tsx
+2 -2
View File
@@ -20,9 +20,9 @@ export default function BrochureButton({
return (
<Button
variant="secondary"
variant="primary"
size="large"
className="w-full !bg-[#F3F3F2] !justify-between group hover:!bg-[#F3F3F2]"
className="w-full !justify-between group"
onClick={handleDownload}
>
<span className="text-nowrap text-caption-m group-hover:text-[#0D1922] transition-colors duration-300">
src/components/ui/Button.tsx
+6 -3
View File
@@ -3,7 +3,7 @@ import { clsx } from "clsx";
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
children: React.ReactNode;
variant?: "link" | "primary" | "secondary" | "tertiary";
variant?: "link" | "primary" | "secondary" | "tertiary" | "cta";
className?: string;
size?: "small" | "medium" | "large";
onlyIcon?: boolean;
@@ -42,9 +42,12 @@ function Button({
: "2xl:px-[0.889vw] 2xl:py-[0.556vw] 2xl:gap-[0.278vw] 2xl:text-[0.833vw] px-3 py-2 gap-1 text-btn-s"),
],
variant === "link" && "text-sm text-black/50 w-fit",
variant === "cta" &&
"bg-[#00BED7] hover:!bg-[#0AB3C9] text-white disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
variant === "primary" &&
"!bg-[#f3f3f2] text-white hover:!bg-[#0AB3C9] active:!bg-[#00A7BD] disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
variant === "secondary" && "bg-white text-[#0D1922]/70",
"bg-[#F3F3F2] hover:!bg-[#E2E2DC] disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
variant === "secondary" &&
"bg-white hover:!bg-white/80 text-[#0D1922]/70 disabled:!bg-[#0D1922]/8 disabled:!text-[#0D1922]/40",
variant === "tertiary" &&
"text-xs leading-[135%] text-[#0D1922]/70 !px-0 hover:!text-[#0D1922] disabled:!bg-transparent",
roundedFull ? "rounded-full" : "2xl:rounded-[0.833vw] rounded-xl",
src/data/aboutMarasiDrive.ts
+3 -9
View File
@@ -1,7 +1,7 @@
export const marasiDriveDescriptionBadges = [
"Expandable Living Solutions",
"Heartbeat Location",
"Inspired Interiors",
"Expandable living solutions",
"Heartbeat location",
"Inspired interiors",
] as const;
export const marasiDriveFeatures = [
@@ -27,12 +27,6 @@ export const marasiDriveFeatures = [
},
] as const;
export const marasiDriveExpandable = [
"/images/about-complex/marasi-drive/living_solution1.jpg",
"/images/about-complex/marasi-drive/living_solution2.jpg",
"/images/about-complex/marasi-drive/living_solution3.jpg",
] as const;
export const marasiDriveInspiredInteriors = [
{
name: "Studio flex",
src/index.css
+1 -1
View File
@@ -18,7 +18,7 @@ button {
}
@utility text-h1 {
@apply 2xl:text-[3.889vw] text-[56px] leading-none;
@apply 2xl:text-[3.889vw] md:max-2xl:text-[56px] text-[28px] leading-none;
}
@utility text-h15 {
src/layout/DefaultLayout.tsx
+5
View File
@@ -2,10 +2,15 @@ import Header from "../components/Header";
import { Outlet, useLocation } from "react-router";
import Footer from "../components/Footer";
import clsx from "clsx";
import { useEffect } from "react";
function DefaultLayout() {
const { pathname } = useLocation();
useEffect(() => {
window.scrollTo(0, 0);
}, [pathname]);
return (
<div
className={clsx(
src/layout/LayoutWithoutFooter.tsx
+8 -1
View File
@@ -1,7 +1,14 @@
import Header from "../components/Header";
import { Outlet } from "react-router";
import { Outlet, useLocation } from "react-router";
import { useEffect } from "react";
function LayoutWithoutFooter() {
const { pathname } = useLocation();
useEffect(() => {
window.scrollTo(0, 0);
}, [pathname]);
return (
<div className="flex flex-col select-none min-h-dvh">
<Header />
src/main.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ import ComplexPage from "./pages/ComplexPage.tsx";
import FloorsPage from "./pages/FloorsPage.tsx";
import UnitTypesPage from "./pages/UnitTypesPage.tsx";
import AboutIRTHPage from "./pages/AboutIRTHPage.tsx";
import FavoritesPage from "./pages/FavouritesPage.tsx";
import FavoritesPage from "./pages/FavoritesPage.tsx";
import SearchPage from "./pages/SearchPage.tsx";
import LayoutWithoutFooter from "./layout/LayoutWithoutFooter.tsx";
import { queryClient } from "./lib/queryClient.ts";
src/pages/FavouritesPage.tsx → src/pages/FavoritesPage.tsx
+4 -5
View File
@@ -123,7 +123,7 @@ function FavoritesPage() {
</p>
</div>
<Button
variant="primary"
variant="cta"
size="large"
onClick={() => navigate("/search")}
>
@@ -155,8 +155,7 @@ function FavoritesPage() {
<div className="flex justify-between">
<Button
onlyIcon
variant="secondary"
className="!bg-[#F3F3F2]"
variant="primary"
onClick={handlePrev}
disabled={currentUnit === 0}
>
@@ -184,7 +183,7 @@ function FavoritesPage() {
</div>
<Button
onlyIcon
variant="secondary"
variant="primary"
disabled={
filteredFavoriteUnits.length - currentUnit <=
(innerWidth >= 1440 ? 4 : 2)
@@ -358,7 +357,7 @@ function FavoritesPage() {
/>
)}
</div>
<Button size="large" className="w-full">
<Button variant="cta" size="large" className="w-full">
Book
</Button>
</div>
src/pages/UnitPage.tsx
+9 -2
View File
@@ -41,6 +41,13 @@ function UnitPage() {
if (!unit) return null;
function handleShare() {
navigator.share({
title: `${unit!.unitType} - ${unit!.unitNo}`,
url: window.location.href,
});
}
return (
<div className="2xl:p-[2.222vw] md:max-2xl:p-6 p-4 max-2xl:pb-0 bg-white flex 2xl:gap-[2.222vw] md:max-2xl:gap-8 gap-6 max-2xl:flex-col">
<div className="bg-[#F3F3F2] 2xl:aspect-[1028/664] md:max-2xl:aspect-[720/616] aspect-square 2xl:w-[71.389vw] w-full 2xl:rounded-[1.111vw] md:max-2xl:rounded-2xl rounded-xl" />
@@ -76,7 +83,7 @@ function UnitPage() {
)}
</span>
</Button>
<Button variant="tertiary" onlyIcon>
<Button variant="tertiary" onlyIcon onClick={handleShare}>
<span className="2xl:size-[1.389vw] size-5">
<ShareIcon />
</span>
@@ -136,7 +143,7 @@ function UnitPage() {
>
Virtual tour
</Button>
<Button size="large" className="w-full">
<Button variant="cta" size="large" className="w-full">
Book
</Button>
</div>