Update src/app/property/[id]/page.tsx

Update src/app/layout.tsx
Update src/app/about/page.tsx
2026-04-10 16:23:36 +00:00 · 2026-04-10 16:23:36 +00:00 · 2026-04-10 16:23:35 +00:00 · 2026-04-10 16:23:07 +00:00 · 2026-04-10 16:23:06 +00:00 · 2026-04-10 16:23:06 +00:00
7 changed files with 172 additions and 255 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -2,12 +2,11 @@

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FooterCard from '@/components/sections/footer/FooterCard';
-import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
+import TeamCardOne from '@/components/sections/team/TeamCardOne';
+import FooterCard from '@/components/sections/footer/FooterCard';

-export default function LandingPage() {
+export default function AboutPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
@@ -22,78 +21,32 @@ export default function LandingPage() {
        headingFontWeight="semibold"
    >
      <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleCentered
-      navItems={[
-        {
-          name: "Home",
-          id: "/",
-        },
-        {
-          name: "Properties",
-          id: "/properties",
-        },
-        {
-          name: "About",
-          id: "/about",
-        },
-        {
-          name: "Contact",
-          id: "/contact",
-        },
-      ]}
-      brandName="PropElite"
-    />
-  </div>
-
-  <div id="about-content" data-section="about-content">
-      <InlineImageSplitTextAbout
-      useInvertedBackground={false}
-      heading={[
-        {
-          type: "text",
-          content: "Welcome to PropElite Real Estate.",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/male-real-estate-agent-doing-business-showing-house-potential-buying-couple_23-2150164706.jpg",
-          alt: "About PropElite",
-        },
-        {
-          type: "text",
-          content: "We bring years of trusted service and unparalleled property expertise to help you find your dream home.",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="team" data-section="team">
-      <TeamCardTwo
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      title="Meet Our Experts"
-      description="Professional agents ready to assist."
-      members={[
-        {
-          id: "m1",
-          name: "Jane Doe",
-          role: "Senior Consultant",
-          description: "Over 15 years in luxury real estate.",
-          imageSrc: "http://img.b2bpic.net/free-photo/male-real-estate-agent-doing-business-showing-house-potential-buying-couple_23-2150164706.jpg",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="PropElite Real Estate"
-      copyrightText="© 2025 PropElite. All rights reserved."
-    />
-  </div>
+        <NavbarStyleCentered
+            navItems={[
+                { name: "Home", id: "/" },
+                { name: "Properties", id: "/properties" },
+                { name: "About", id: "/about" },
+                { name: "Contact", id: "/contact" },
+            ]}
+            brandName="PropElite"
+        />
+        <TeamCardOne 
+            members={[
+                { id: "t1", name: "Jane Doe", role: "CEO & Founder", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-holding-digital-tablet-standing-outdoor_23-2147862770.jpg" },
+                { id: "t2", name: "John Smith", role: "Senior Consultant", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-carrying-woman-with-wheelbarrow_23-2149382171.jpg" }
+            ]}
+            gridVariant="two-columns-alternating-heights"
+            animationType="slide-up"
+            title="Our Leadership"
+            description="Meet the experts driving our vision forward."
+            useInvertedBackground={false}
+            textboxLayout="default"
+        />
+        <FooterCard
+            logoText="PropElite Real Estate"
+            copyrightText="© 2025 PropElite. All rights reserved."
+        />
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -2,12 +2,11 @@

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
-import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FooterCard from '@/components/sections/footer/FooterCard';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ContactText from '@/components/sections/contact/ContactText';
+import FooterCard from '@/components/sections/footer/FooterCard';

-export default function LandingPage() {
+export default function ContactPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
@@ -22,69 +21,25 @@ export default function LandingPage() {
        headingFontWeight="semibold"
    >
      <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleCentered
-      navItems={[
-        {
-          name: "Home",
-          id: "/",
-        },
-        {
-          name: "Properties",
-          id: "/properties",
-        },
-        {
-          name: "About",
-          id: "/about",
-        },
-        {
-          name: "Contact",
-          id: "/contact",
-        },
-      ]}
-      brandName="PropElite"
-    />
-  </div>
-
-  <div id="contact-main" data-section="contact-main">
-      <ContactSplit
-      useInvertedBackground={true}
-      background={{
-        variant: "plain",
-      }}
-      tag="Let's Talk"
-      title="Get in Touch Today"
-      description="Have questions about our properties or need expert guidance? Reach out now."
-      imageSrc="http://img.b2bpic.net/free-photo/man-woman-car-dealership-together_23-2148333030.jpg"
-      mediaAnimation="slide-up"
-    />
-  </div>
-
-  <div id="contact" data-section="contact">
-      <ContactCTA
-      useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Need Help?"
-      title="We're here to guide you"
-      description="Speak with an expert today."
-      buttons={[
-        {
-          text: "Call Now",
-          href: "tel:123456789",
-        },
-      ]}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="PropElite Real Estate"
-      copyrightText="© 2025 PropElite. All rights reserved."
-    />
-  </div>
+        <NavbarStyleCentered
+            navItems={[
+                { name: "Home", id: "/" },
+                { name: "Properties", id: "/properties" },
+                { name: "About", id: "/about" },
+                { name: "Contact", id: "/contact" },
+            ]}
+            brandName="PropElite"
+        />
+        <ContactText
+            text="Let's Connect and Find Your Perfect Space"
+            background={{ variant: "plain" }}
+            useInvertedBackground={false}
+        />
+        <FooterCard
+            logoText="PropElite Real Estate"
+            copyrightText="© 2025 PropElite. All rights reserved."
+        />
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -11,8 +11,8 @@ import { Nunito_Sans } from "next/font/google";


 export const metadata: Metadata = {
-  title: 'PropElite | Your Dream Home Finder',
-  description: 'Browse premium real estate listings, search by location and budget, and connect with trusted property experts.',
+  title: 'PropElite Real Estate',
+  description: 'Premium luxury real estate properties and professional consulting.',
  openGraph: {
    "title": "PropElite | Premium Real Estate",
    "description": "Finding your home is simple with PropElite.",
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -122,4 +122,4 @@ export default function LandingPage() {
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/properties/page.tsx
+++ b/src/app/properties/page.tsx
@@ -2,12 +2,11 @@

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FooterCard from '@/components/sections/footer/FooterCard';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import FooterCard from '@/components/sections/footer/FooterCard';

-export default function LandingPage() {
+export default function PropertiesPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
@@ -22,106 +21,42 @@ export default function LandingPage() {
        headingFontWeight="semibold"
    >
      <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleCentered
-      navItems={[
-        {
-          name: "Home",
-          id: "/",
-        },
-        {
-          name: "Properties",
-          id: "/properties",
-        },
-        {
-          name: "About",
-          id: "/about",
-        },
-        {
-          name: "Contact",
-          id: "/contact",
-        },
-      ]}
-      brandName="PropElite"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Properties", id: "/properties" },
+              { name: "About", id: "/about" },
+              { name: "Contact", id: "/contact" },
+            ]}
+            brandName="PropElite"
+          />
+        </div>
+        
+        <div id="properties" data-section="properties" style={{ paddingTop: "120px" }}>
+          <ProductCardFour
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="four-items-2x2-equal-grid"
+            useInvertedBackground={false}
+            title="Luxury Property Listings"
+            description="Filter by price, location, and type to find your perfect match."
+            products={[
+              { id: "p1", name: "Modern Villa", price: "$1,200,000", variant: "3BHK", imageSrc: "http://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg?_wi=2" },
+              { id: "p2", name: "Downtown Apartment", price: "$450,000", variant: "2BHK", imageSrc: "http://img.b2bpic.net/free-photo/modern-styled-small-entryway_23-2150712847.jpg?_wi=1" },
+              { id: "p3", name: "Suburban Estate", price: "$850,000", variant: "4BHK", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-holding-digital-tablet-standing-outdoor_23-2147862770.jpg" },
+              { id: "p4", name: "City Studio", price: "$300,000", variant: "1BHK", imageSrc: "http://img.b2bpic.net/free-photo/chairs-near-table-with-books-decorations_23-2147896815.jpg" },
+            ]}
+          />
+        </div>

-  <div id="listing-grid" data-section="listing-grid">
-      <ProductCardFour
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="four-items-2x2-equal-grid"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "l1",
-          name: "Sunset Villa",
-          price: "$1,100,000",
-          variant: "3BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg?_wi=4",
-        },
-        {
-          id: "l2",
-          name: "Greenwood Apartment",
-          price: "$400,000",
-          variant: "2BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/modern-styled-small-entryway_23-2150712847.jpg?_wi=4",
-        },
-        {
-          id: "l3",
-          name: "Grand Estate",
-          price: "$900,000",
-          variant: "4BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-holding-digital-tablet-standing-outdoor_23-2147862770.jpg?_wi=3",
-        },
-        {
-          id: "l4",
-          name: "Urban Flat",
-          price: "$280,000",
-          variant: "1BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/chairs-near-table-with-books-decorations_23-2147896815.jpg?_wi=3",
-        },
-        {
-          id: "l5",
-          name: "Coastal Home",
-          price: "$2,200,000",
-          variant: "5BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-carrying-woman-with-wheelbarrow_23-2149382171.jpg?_wi=2",
-        },
-        {
-          id: "l6",
-          name: "Skyline Loft",
-          price: "$3,000,000",
-          variant: "3BHK",
-          imageSrc: "http://img.b2bpic.net/free-photo/staircase-apartment_1150-11156.jpg?_wi=2",
-        },
-      ]}
-      title="All Properties"
-      description="Browse our full catalog of residential and commercial listings."
-    />
-  </div>
-
-  <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
-      textboxLayout="default"
-      useInvertedBackground={false}
-      title="Market Leaders"
-      description="Preferred partner for major property developers."
-      names={[
-        "Developer A",
-        "Developer B",
-        "Developer C",
-      ]}
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterCard
-      logoText="PropElite Real Estate"
-      copyrightText="© 2025 PropElite. All rights reserved."
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterCard
+            logoText="PropElite Real Estate"
+            copyrightText="© 2025 PropElite. All rights reserved."
+          />
+        </div>
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/property/[id]/page.tsx
+++ b/src/app/property/[id]/page.tsx
@@ -0,0 +1,74 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
+import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterCard from '@/components/sections/footer/FooterCard';
+
+export default function PropertyPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="rounded"
+        contentWidth="medium"
+        sizing="medium"
+        background="circleGradient"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="gradient"
+        secondaryButtonStyle="glass"
+        headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <NavbarStyleCentered
+            navItems={[
+                { name: "Home", id: "/" },
+                { name: "Properties", id: "/properties" },
+                { name: "About", id: "/about" },
+                { name: "Contact", id: "/contact" },
+            ]}
+            brandName="PropElite"
+        />
+        <HeroBillboardGallery
+            title="Luxury Estate Overview"
+            description="Experience unparalleled comfort and style in our premium properties."
+            background={{ variant: "plain" }}
+            mediaItems={[{ imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-villa-with-pool_23-2149156499.jpg" }]}
+        />
+        <MetricCardFourteen 
+            title="Property Highlights"
+            tag="Key Specs"
+            metrics={[{ id: "m1", value: "5,000 sq ft", description: "Interior Area" }, { id: "m2", value: "4 Bedrooms", description: "Comfortable Living" }]}
+            useInvertedBackground={false}
+        />
+        <FeatureCardMedia
+            title="Features & Amenities"
+            description="Discover what makes this property truly exceptional."
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+                { id: "f1", title: "Private Pool", description: "Heated infinity pool with ocean view", tag: "Premium" },
+                { id: "f2", title: "Smart Home", description: "Fully integrated automation system", tag: "Modern" }
+            ]}
+        />
+        <ContactCTA
+            title="Interested in this property?"
+            description="Contact us for a private viewing session today."
+            tag="Inquiry"
+            buttons={[{ text: "Get in Touch", href: "/contact" }]}
+            background={{ variant: "plain" }}
+            useInvertedBackground={false}
+        />
+        <FooterCard
+            logoText="PropElite Real Estate"
+            copyrightText="© 2025 PropElite. All rights reserved."
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -10,15 +10,15 @@
  --accent: #ffffff;
  --background-accent: #ffffff; */

-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #106EFB;
+  --background: #0a0a0a;
+  --card: #1a1a1a;
+  --foreground: #f5f5f5;
+  --primary-cta: #ffdf7d;
  --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #1a1a1a;
  --secondary-cta-text: #000612e6;
-  --accent: #e2e2e2;
-  --background-accent: #106EFB;
+  --accent: #b8860b;
+  --background-accent: #8b6914;

  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
Author	SHA1	Message	Date
bender	4a6db318e0	Update src/app/property/[id]/page.tsx	2026-04-10 16:23:36 +00:00
bender	a336c0f7ec	Update src/app/layout.tsx	2026-04-10 16:23:36 +00:00
bender	0137349dd4	Update src/app/about/page.tsx	2026-04-10 16:23:35 +00:00
bender	363f2438aa	Update src/app/styles/variables.css	2026-04-10 16:23:07 +00:00
bender	b91822886b	Add src/app/property/[id]/page.tsx	2026-04-10 16:23:06 +00:00
bender	123a218920	Update src/app/properties/page.tsx	2026-04-10 16:23:06 +00:00
bender	7120e3d7e8	Update src/app/page.tsx	2026-04-10 16:23:06 +00:00
bender	72e79f6485	Update src/app/contact/page.tsx	2026-04-10 16:23:05 +00:00
bender	8296b53f50	Update src/app/about/page.tsx	2026-04-10 16:23:05 +00:00
bender	65888cf547	Merge version_1 into main Merge version_1 into main	2026-04-10 16:02:23 +00:00
bender	107e40af1a	Merge version_1 into main Merge version_1 into main	2026-04-10 16:01:59 +00:00
bender	faa04fcfb6	Merge version_1 into main Merge version_1 into main	2026-04-10 16:01:33 +00:00