diff --git a/src/app/blog/page.tsx b/src/app/blog/page.tsx new file mode 100644 index 0000000..752cb7f --- /dev/null +++ b/src/app/blog/page.tsx @@ -0,0 +1,3 @@ +export default function Blog() { + return <>; +} diff --git a/src/app/globals.css b/src/app/globals.css index f1cf574..0fd081d 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -11,6 +11,7 @@ --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); --font-montserrat: var(--font-montserrat); + --font-playfairdisplay: var(--font-playfairdisplay); --color-colorExt1: #0a0a0a; --color-colorExt2: #ffffff; --color-colorExt3: #967244; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index ac032b8..876ad84 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,5 +1,5 @@ import InitialScript from "@/components/layouts/InitialScript"; -import { Geist, Geist_Mono, Montserrat } from "next/font/google"; +import { Geist, Geist_Mono, Montserrat, Playfair_Display } from "next/font/google"; import "./globals.css"; import { Metadata } from "next"; import { getDefaultMetadata } from "@/utils/metadata"; @@ -21,6 +21,11 @@ const montserrat = Montserrat({ subsets: ["latin"], }); +const playfairDisplay = Playfair_Display({ + variable: "--font-playfairdisplay", + subsets: ["latin"], +}); + export async function generateMetadata(): Promise { const metadata = await getDefaultMetadata(); return metadata; @@ -48,7 +53,9 @@ export default function RootLayout({ - +
+
+
+

Page Not Found

+

You may have mistyped the address or the page may have moved

+ + Go to Homepage + +
+
+ + ); +} diff --git a/src/app/page.tsx b/src/app/page.tsx index 7747a35..7d555ec 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,12 +1,27 @@ +"use client"; + +import CardProduct from "@/components/CardProduct"; import ContactFormSection from "@/components/ContactFormSection"; import GoogleReviewBox from "@/components/GoogleReviewBox"; -import Hero from "@/components/Hero"; +import HeroSlider from "@/components/HeroSlider"; +import Image from "next/image"; import Link from "next/link"; +import { useRef } from "react"; export default function Home() { + const formRef = useRef(null); + + function scrollToForm() { + formRef.current?.scrollIntoView?.({ behavior: "smooth" }); + } + return ( <> - + + +
+ +
@@ -67,7 +82,17 @@ export default function Home() {
-
+
+ Experience the Difference in Every Key Turn
@@ -114,278 +139,17 @@ export default function Home() {
-
-
-
-
-
- - - - -
-
- $5000\mo -
-
-

- 401 Biscayne Boulevard, Miami -

-
-
    -
  • - - 480 Sq Ft -
    • -
  • - - 2 Bathrooms -
    • -
  • - - 2 Bedrooms -
    • -
  • - - 1 Garage -
    • -
-
+
+
+ + + + + +
-
-
-
-
- - - - -
-
- $2500\mo -
-
-

- 923 Folsom St, San Francisco -

-
-
    -
  • - - 535 Sq Ft -
    • -
  • - - 2 Bathrooms -
    • -
  • - - 3 Bedrooms -
    • -
  • - - 1 Garage -
    • -
-
-
-
-
-
-
- - - - -
-
- 9340\mo -
-
-

- 225 Maywood Dr, San Francisco -

-
-
    -
  • - - 435 Sq Ft -
    • -
  • - - 1 Bathroom -
    • -
  • - - 1 Bedroom -
    • -
  • - - 1 Garage -
    • -
-
-
-
-
-
-
- - - - -
-
- $5550\mo -
-
-

- 35 Pond St, New York -

-
-
    -
  • - - 430 Sq Ft -
    • -
  • - - 2 Bathrooms -
    • -
  • - - 3 Bedrooms -
    • -
  • - - 1 Garage -
    • -
-
-
-
-
-
-
- - - - -
-
- $2520\mo -
-
-

- 182 3rd St, Seattle -

-
-
    -
  • - - 630 Sq Ft -
    • -
  • - - 3 Bathrooms -
    • -
  • - - 3 Bedrooms -
    • -
  • - - 2 Garages -
    • -
-
-
-
-
-
-
- - - - -
-
- $5000\mo -
-
-

- 623 Willow Rd, Dallas -

-
-
    -
  • - - 530 Sq Ft -
    • -
  • - - 2 Bathrooms -
    • -
  • - - 2 Bedrooms -
    • -
  • - - 2 Garages -
    • -
-
-
-
+ +
View all properties @@ -394,7 +158,7 @@ export default function Home() {
-
+
@@ -455,10 +219,6 @@ export default function Home() {
- -
- -
); } diff --git a/src/components/CardProduct.tsx b/src/components/CardProduct.tsx new file mode 100644 index 0000000..b897590 --- /dev/null +++ b/src/components/CardProduct.tsx @@ -0,0 +1,51 @@ +import Image from "next/image"; + +export default function CardProduct() { + return ( +
+
+
+
+ + + + +
+
+ $5000\mo +
+
+

+ 401 Biscayne Boulevard, Miami +

+
+
    +
  • + + 480 Sq Ft +
    • +
  • + + 2 Bathrooms +
    • +
  • + + 2 Bedrooms +
    • +
  • + + 1 Garage +
    • +
+
+
+ ); +} diff --git a/src/components/ContactFormSection.tsx b/src/components/ContactFormSection.tsx index fb2e3eb..ce1963b 100644 --- a/src/components/ContactFormSection.tsx +++ b/src/components/ContactFormSection.tsx @@ -1,6 +1,6 @@ export default function ContactFormSection() { return ( -
+
diff --git a/src/components/GoogleReviewBox.tsx b/src/components/GoogleReviewBox.tsx index c4f9e04..75fff99 100644 --- a/src/components/GoogleReviewBox.tsx +++ b/src/components/GoogleReviewBox.tsx @@ -3,7 +3,7 @@ export default function GoogleReviewBox() {

- What People Say + Making Moves, Building Trust

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx deleted file mode 100644 index 8f69006..0000000 --- a/src/components/Hero.tsx +++ /dev/null @@ -1,47 +0,0 @@ -"use client"; - -import { Swiper, SwiperSlide } from "swiper/react"; -import ContactFormBox from "./ContactFormBox"; -import { Autoplay } from "swiper/modules"; - -export default function Hero() { - return ( -
- - -
-
-
-
-
Real Estate, Refined
-
Where Southern Charm Meets Boutique Real Estate
-
-
-
-
- - -
-
-
-
-
Your Vision, Our Expertise
-
Discover a Smarter Way to Buy & Sell
-
-
-
-
- - - - -
- ); -} diff --git a/src/components/HeroSlider.tsx b/src/components/HeroSlider.tsx new file mode 100644 index 0000000..a87b369 --- /dev/null +++ b/src/components/HeroSlider.tsx @@ -0,0 +1,86 @@ +"use client"; + +import { Swiper, SwiperSlide } from "swiper/react"; +import ContactFormBox from "./ContactFormBox"; +import { Autoplay } from "swiper/modules"; +import { useState } from "react"; +import Image from "next/image"; + +type HeroSliderProps = { + onClickBook?: () => void; +}; + +type HeroSlideItem = { + title: string; + description: string; + img: string; +}; + +export default function HeroSlider({ onClickBook }: HeroSliderProps) { + const [slideItems] = useState([ + { + title: "Real Estate, Redefined", + description: "Where Southern Charm Meets Boutique Real Estate", + img: "/images/bg-header2.jpg", + }, + { + title: "Your Vision, Our Expertise", + description: "Discover a Smarter Way to Buy & Sell", + img: "/images/bg-header3.jpg", + }, + ]); + + return ( +
+ + {slideItems.map((slide, idx) => ( + + {slide.title} +
+
+
+
+
+ {slide.title} +
+
+ {slide.description} +
+
+ +
+ +
+
+
+
+ + ))} + + + +
+ ); +}