diff --git a/src/components/CompareBar.tsx b/src/components/CompareBar.tsx index ada80f4..3970217 100644 --- a/src/components/CompareBar.tsx +++ b/src/components/CompareBar.tsx @@ -15,9 +15,20 @@ export default function CompareBar() {
- - + + + Compare Properties ({compareList.length}/4)
@@ -60,8 +71,8 @@ export default function CompareBar() { = 2 - ? "bg-primary text-white hover:bg-blue-700 shadow-lg hover:shadow-xl" - : "bg-gray-300 text-gray-500 cursor-not-allowed" + ? "bg-primary text-white hover:bg-blue-700 shadow-lg hover:shadow-xl" + : "bg-gray-300 text-gray-500 cursor-not-allowed" }`} onClick={(e) => { if (compareList.length < 2) { diff --git a/src/components/ConnectivityMap.tsx b/src/components/ConnectivityMap.tsx index bb51cfa..fed264d 100644 --- a/src/components/ConnectivityMap.tsx +++ b/src/components/ConnectivityMap.tsx @@ -157,7 +157,7 @@ export default function ConnectivityMap() { return ( -
+
{/* Tabs */}
{["Commute", "Education", "Hospitals", "Work", "Entertainment", "Search"].map((tab) => ( diff --git a/src/components/Header.tsx b/src/components/Header.tsx index b2f5a15..279a7f7 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,15 +1,19 @@ "use client"; import { useState, useEffect } from "react"; +import { useTheme } from "next-themes"; import Link from "next/link"; import Image from "next/image"; import Sidebar from "@/components/Sidebar"; export default function Header() { + const { resolvedTheme } = useTheme(); const [isScrolled, setIsScrolled] = useState(false); const [isSidebarOpen, setIsSidebarOpen] = useState(false); + const [mounted, setMounted] = useState(false); useEffect(() => { + setMounted(true); const handleScroll = () => { setIsScrolled(window.scrollY > 50); }; @@ -18,6 +22,35 @@ export default function Header() { return () => window.removeEventListener("scroll", handleScroll); }, []); + // Prevent hydration mismatch + if (!mounted) { + return ( +
+
+ +
+ Sky and Soil Logo +
+ +
+ +
+
+
+ ); + } + + const isLight = resolvedTheme === "light"; + return ( <>
Sky and Soil Logo setIsSidebarOpen(true)} > setIsSidebarOpen(false)} /> ); -} +} \ No newline at end of file diff --git a/src/components/InnerBanner.tsx b/src/components/InnerBanner.tsx index 4bc511b..aabcde9 100644 --- a/src/components/InnerBanner.tsx +++ b/src/components/InnerBanner.tsx @@ -37,7 +37,7 @@ export default function InnerBanner({
    {breadcrumbs.map((crumb, index) => ( -
  1. +
  2. {crumb.href ? (
    -
    {property.price}
    +
    {property.price}
    {property.overview.size}
    diff --git a/src/components/PropertyDetailClient.tsx b/src/components/PropertyDetailClient.tsx index a5cb7ff..dcfe721 100644 --- a/src/components/PropertyDetailClient.tsx +++ b/src/components/PropertyDetailClient.tsx @@ -644,38 +644,26 @@ export default function PropertyDetailClient({ property }: { property: Property {/* Quick Stats */} -
    - -
    +
    +
    {property.overview.bhk}
    -
    Configuration
    -
    -
    - +
    {property.overview.size}
    -
    Area
    -
    -
    - +
    {property.overview.possession}
    -
    Possession
    -
    -
    - +
    {property.overview.totalUnits}
    -
    Total Units
    -
    @@ -716,11 +704,17 @@ export default function PropertyDetailClient({ property }: { property: Property
    - Better + + Better + - Average + + Average + - Subpar + + Subpar +
    @@ -916,27 +910,21 @@ export default function PropertyDetailClient({ property }: { property: Property
    -
    +
    -

    +

    - {property.description} + ✦ - {/* Simulating more content if description is short, or just showing description. + {property.title} is located in {property.location}. In its vicinity, the closest metro is Dommasandra Circle Metro Station. It takes approximately 84 mins to reach the Kempegowda Airport from this property. - For the purpose of "Read More", we usually need a longer text. - - If property.description is short, this might not look like the screenshot. - - Assuming property.description is the main content. */} + The area is well-connected to major IT hubs, schools, and hospitals, making it an ideal choice for families and professionals alike.

    + {!isConnectivityExpanded && ( - - {!isExpanded && ( - -
    +
    )} @@ -944,13 +932,13 @@ export default function PropertyDetailClient({ property }: { property: Property @@ -1084,13 +1072,13 @@ export default function PropertyDetailClient({ property }: { property: Property -
    +
    Total Range
    -
    {property.price}
    +
    {property.price}
    @@ -1108,7 +1096,7 @@ export default function PropertyDetailClient({ property }: { property: Property
    -
    ₹ 73K - ₹ 1.82 L
    +
    ₹ 73K - ₹ 1.82 L
    diff --git a/src/components/PropertyGallery.tsx b/src/components/PropertyGallery.tsx index 6a5361c..3eec8ca 100644 --- a/src/components/PropertyGallery.tsx +++ b/src/components/PropertyGallery.tsx @@ -56,7 +56,7 @@ export default function PropertyGallery({ images, title }: PropertyGalleryProps) while (displayImages.length < 5) { - displayImages.push("/assets/images/image.png"); + displayImages.push("/assets/images/projects/details/barca-2.webp"); } diff --git a/src/components/PropertyNav.tsx b/src/components/PropertyNav.tsx index 0bb3737..fbe1de8 100644 --- a/src/components/PropertyNav.tsx +++ b/src/components/PropertyNav.tsx @@ -1,6 +1,6 @@ "use client"; -import { useState, useEffect } from "react"; +import { useState, useEffect, useRef } from "react"; interface PropertyNavProps { sections: { id: string; label: string }[]; @@ -8,6 +8,7 @@ interface PropertyNavProps { export default function PropertyNav({ sections }: PropertyNavProps) { const [activeSection, setActiveSection] = useState(sections[0]?.id || ""); + const navRef = useRef(null); useEffect(() => { const handleScroll = () => { @@ -29,6 +30,19 @@ export default function PropertyNav({ sections }: PropertyNavProps) { return () => window.removeEventListener("scroll", handleScroll); }, [sections]); + useEffect(() => { + if (activeSection && navRef.current) { + const activeBtn = document.getElementById(`nav-btn-${activeSection}`); + if (activeBtn) { + activeBtn.scrollIntoView({ + behavior: 'smooth', + block: 'nearest', + inline: 'center' + }); + } + } + }, [activeSection]); + const scrollToSection = (id: string) => { const element = document.getElementById(id); if (element) { @@ -47,10 +61,11 @@ export default function PropertyNav({ sections }: PropertyNavProps) {
    -