loading issue conetnt top detals card updated
This commit is contained in:
parent
b8a2d91728
commit
152022c68f
@ -1,4 +1,5 @@
|
||||
import InnerBanner from "@/components/InnerBanner";
|
||||
import ContactCards from "@/components/ContactCards";
|
||||
import ContactCTA from "@/components/ContactCTA";
|
||||
import Footer from "@/components/Footer";
|
||||
import { Metadata } from "next";
|
||||
@ -20,8 +21,11 @@ export default function ContactPage() {
|
||||
]}
|
||||
backgroundImage="/assets/images/about/contact-banner.webp"
|
||||
/>
|
||||
<div>
|
||||
<ContactCTA />
|
||||
<div className="relative bg-[#f3f1e6] dark:bg-gray-900 pt-20">
|
||||
<ContactCards />
|
||||
<div className="-mt-12">
|
||||
<ContactCTA />
|
||||
</div>
|
||||
</div>
|
||||
<Footer />
|
||||
</main>
|
||||
|
||||
@ -7,6 +7,7 @@ export default function BengaluruPropertiesClientWrapper() {
|
||||
return (
|
||||
<PropertiesClient
|
||||
headerRenderer={(props) => <BengaluruHeader {...props} />}
|
||||
bannerTitle="Properties for Sale in Bengaluru"
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@ -116,7 +116,7 @@ export default function ContactCTA() {
|
||||
}, [alert.show]);
|
||||
|
||||
return (
|
||||
<section id="contact" className="relative py-24 bg-[#f3f1e6] dark:bg-gray-900">
|
||||
<section id="contact" className="relative pb-24 dark:bg-transparent">
|
||||
|
||||
<div className="relative z-10 max-w-6xl mx-auto px-6">
|
||||
<motion.div
|
||||
|
||||
62
src/components/ContactCards.tsx
Normal file
62
src/components/ContactCards.tsx
Normal file
@ -0,0 +1,62 @@
|
||||
"use client";
|
||||
|
||||
import { Phone, Mail, MapPin } from "lucide-react";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function ContactCards() {
|
||||
const cards = [
|
||||
{
|
||||
icon: <Phone size={24} className="text-white" />,
|
||||
title: "Quick Contact",
|
||||
details: ["+91-95388-34444"],
|
||||
type: "phone"
|
||||
},
|
||||
{
|
||||
icon: <Mail size={24} className="text-white" />,
|
||||
title: "Email Address",
|
||||
details: ["support@skyandsoil.com"],
|
||||
type: "email"
|
||||
},
|
||||
{
|
||||
icon: <MapPin size={24} className="text-white" />,
|
||||
title: "Mailing Address",
|
||||
details: [
|
||||
"HSR Layout, Bengaluru, Karnataka 560102"
|
||||
],
|
||||
type: "address"
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section className="relative z-20 px-6 max-w-6xl mx-auto pb-24">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-3 md:grid-cols-3 gap-6">
|
||||
{cards.map((card, index) => (
|
||||
<motion.div
|
||||
key={index}
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.5, delay: index * 0.1 }}
|
||||
className="bg-white dark:bg-gray-800 rounded-2xl shadow-xl p-5 flex flex-col items-start hover:-translate-y-1 transition-transform duration-300"
|
||||
>
|
||||
<div className="w-14 h-14 rounded-full bg-primary flex items-center justify-center mb-6 shadow-lg shadow-primary/30">
|
||||
{card.icon}
|
||||
</div>
|
||||
|
||||
<h3 className="text-xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
{card.title}
|
||||
</h3>
|
||||
|
||||
<div className="space-y-1">
|
||||
{card.details.map((line, i) => (
|
||||
<p key={i} className="text-gray-600 dark:text-gray-300 font-medium">
|
||||
{line}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
@ -1,6 +1,15 @@
|
||||
"use client";
|
||||
import { useEffect, useState } from "react";
|
||||
import Header from "./Header";
|
||||
|
||||
export default function HeaderWrapper() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
if (!mounted) return null;
|
||||
|
||||
return <Header />;
|
||||
}
|
||||
|
||||
@ -12,9 +12,18 @@ import { motion } from "framer-motion";
|
||||
interface PropertiesClientProps {
|
||||
initialFilters?: Partial<FilterState>;
|
||||
headerRenderer?: (props: { filteredCount: number; totalCount: number }) => React.ReactNode;
|
||||
bannerTitle?: string;
|
||||
bannerSubtitle?: string;
|
||||
bannerBackgroundImage?: string;
|
||||
}
|
||||
|
||||
export default function PropertiesClient({ initialFilters, headerRenderer }: PropertiesClientProps = {}) {
|
||||
export default function PropertiesClient({
|
||||
initialFilters,
|
||||
headerRenderer,
|
||||
bannerTitle = "Our Properties",
|
||||
bannerSubtitle = "Discover your dream home from our exclusive collection of premium properties",
|
||||
bannerBackgroundImage = "/assets/images/projects/projects-banner.webp"
|
||||
}: PropertiesClientProps = {}) {
|
||||
const searchParams = useSearchParams();
|
||||
const [filteredProperties, setFilteredProperties] = useState(properties);
|
||||
const [initializedFilters, setInitializedFilters] = useState<Partial<FilterState> | undefined>(undefined);
|
||||
@ -106,13 +115,13 @@ export default function PropertiesClient({ initialFilters, headerRenderer }: Pro
|
||||
<div className="min-h-screen bg-gray-50 dark:bg-black">
|
||||
|
||||
<InnerBanner
|
||||
title="Our Properties"
|
||||
subtitle="Discover your dream home from our exclusive collection of premium properties"
|
||||
title={bannerTitle}
|
||||
subtitle={bannerSubtitle}
|
||||
breadcrumbs={[
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Properties" }
|
||||
]}
|
||||
backgroundImage="/assets/images/projects/projects-banner.webp"
|
||||
backgroundImage={bannerBackgroundImage}
|
||||
/>
|
||||
|
||||
<div>
|
||||
|
||||
@ -15,6 +15,7 @@ const CompareContext = createContext<CompareContextType | undefined>(undefined);
|
||||
|
||||
export function CompareProvider({ children }: { children: React.ReactNode }) {
|
||||
const [compareList, setCompareList] = useState<Property[]>([]);
|
||||
const [isLoaded, setIsLoaded] = useState(false);
|
||||
|
||||
// Load from localStorage on mount
|
||||
useEffect(() => {
|
||||
@ -26,12 +27,15 @@ export function CompareProvider({ children }: { children: React.ReactNode }) {
|
||||
console.error("Failed to load compare list:", e);
|
||||
}
|
||||
}
|
||||
setIsLoaded(true);
|
||||
}, []);
|
||||
|
||||
// Save to localStorage whenever compareList changes
|
||||
// Save to localStorage whenever compareList changes, but ONLY after initial load
|
||||
useEffect(() => {
|
||||
localStorage.setItem("compareProperties", JSON.stringify(compareList));
|
||||
}, [compareList]);
|
||||
if (isLoaded) {
|
||||
localStorage.setItem("compareProperties", JSON.stringify(compareList));
|
||||
}
|
||||
}, [compareList, isLoaded]);
|
||||
|
||||
const addToCompare = (property: Property) => {
|
||||
if (compareList.length >= 4) {
|
||||
|
||||
@ -360,10 +360,10 @@ export const properties: Property[] = [
|
||||
{ title: "Development Rights", description: "Outlines the agreed terms of development between the land owner & the builder" },
|
||||
],
|
||||
builder: {
|
||||
name: "Modern Spaaces",
|
||||
description: "Established in 2012, Modern Spaces focuses on delivering thoughtfully designed residential and commercial developments. With over 1 million sq. ft. completed, the company caters to mid-segment and premium buyers in Bengaluru. Key projects like Modern Greens, Modern Heights, and Modern Meadows are recognized for their innovative layouts and contemporary features. Modern Spaces integrates green practices such as energy-efficient construction and landscaped open spaces into its developments. Known for timely delivery and quality construction, Modern Spaces continues to serve Bengaluru's growing real estate market.",
|
||||
establishedYear: "2012",
|
||||
completedProjects: "No Data",
|
||||
name: "Godrej Properties",
|
||||
description: "Godrej Properties brings the Godrej Group philosophy of innovation, sustainability, and excellence to the real estate industry. Each Godrej Properties development combines a 122-year legacy of excellence and trust with a commitment to cutting-edge design and technology.",
|
||||
establishedYear: "1990",
|
||||
completedProjects: "80+",
|
||||
},
|
||||
locality: {
|
||||
name: "Varthur",
|
||||
@ -666,10 +666,10 @@ export const properties: Property[] = [
|
||||
{ title: "Development Rights", description: "Outlines the agreed terms of development between the land owner & the builder" },
|
||||
],
|
||||
builder: {
|
||||
name: "Modern Spaaces",
|
||||
description: "Established in 2012, Modern Spaces focuses on delivering thoughtfully designed residential and commercial developments. With over 1 million sq. ft. completed, the company caters to mid-segment and premium buyers in Bengaluru. Key projects like Modern Greens, Modern Heights, and Modern Meadows are recognized for their innovative layouts and contemporary features. Modern Spaces integrates green practices such as energy-efficient construction and landscaped open spaces into its developments. Known for timely delivery and quality construction, Modern Spaces continues to serve Bengaluru's growing real estate market.",
|
||||
establishedYear: "2012",
|
||||
completedProjects: "No Data",
|
||||
name: "Godrej Properties",
|
||||
description: "Godrej Properties brings the Godrej Group philosophy of innovation, sustainability, and excellence to the real estate industry. Each Godrej Properties development combines a 122-year legacy of excellence and trust with a commitment to cutting-edge design and technology.",
|
||||
establishedYear: "1990",
|
||||
completedProjects: "80+",
|
||||
},
|
||||
locality: {
|
||||
name: "Varthur",
|
||||
@ -819,10 +819,10 @@ export const properties: Property[] = [
|
||||
{ title: "Development Rights", description: "Outlines the agreed terms of development between the land owner & the builder" },
|
||||
],
|
||||
builder: {
|
||||
name: "Modern Spaaces",
|
||||
description: "Established in 2012, Modern Spaces focuses on delivering thoughtfully designed residential and commercial developments. With over 1 million sq. ft. completed, the company caters to mid-segment and premium buyers in Bengaluru. Key projects like Modern Greens, Modern Heights, and Modern Meadows are recognized for their innovative layouts and contemporary features. Modern Spaces integrates green practices such as energy-efficient construction and landscaped open spaces into its developments. Known for timely delivery and quality construction, Modern Spaces continues to serve Bengaluru's growing real estate market.",
|
||||
establishedYear: "2012",
|
||||
completedProjects: "No Data",
|
||||
name: "Godrej Properties",
|
||||
description: "Godrej Properties brings the Godrej Group philosophy of innovation, sustainability, and excellence to the real estate industry. Each Godrej Properties development combines a 122-year legacy of excellence and trust with a commitment to cutting-edge design and technology.",
|
||||
establishedYear: "1990",
|
||||
completedProjects: "80+",
|
||||
},
|
||||
locality: {
|
||||
name: "Varthur",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user