From 931c71b400791f3aa04adef1480ad460fa074765 Mon Sep 17 00:00:00 2001 From: RizqiSyahrendra Date: Fri, 18 Apr 2025 21:22:29 +0700 Subject: [PATCH 1/4] feat: not found page --- src/app/not-found.tsx | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 src/app/not-found.tsx diff --git a/src/app/not-found.tsx b/src/app/not-found.tsx new file mode 100644 index 0000000..3f289c6 --- /dev/null +++ b/src/app/not-found.tsx @@ -0,0 +1,15 @@ +export default function NotFound() { + return ( + <> +
+
+

Page Not Found

+

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

+ + Go to Homepage + +
+
+ + ); +} From 42793bffab56f29a2e2805efefad41e472766d27 Mon Sep 17 00:00:00 2001 From: RizqiSyahrendra Date: Sat, 19 Apr 2025 08:51:47 +0700 Subject: [PATCH 2/4] fix: hero slider and homepage styling --- src/app/blog/page.tsx | 3 ++ src/app/globals.css | 1 + src/app/layout.tsx | 11 +++- src/app/page.tsx | 21 +++++--- src/components/ContactFormSection.tsx | 2 +- src/components/GoogleReviewBox.tsx | 2 +- src/components/Hero.tsx | 47 ---------------- src/components/HeroSlider.tsx | 77 +++++++++++++++++++++++++++ 8 files changed, 107 insertions(+), 57 deletions(-) create mode 100644 src/app/blog/page.tsx delete mode 100644 src/components/Hero.tsx create mode 100644 src/components/HeroSlider.tsx 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({ - +
(null); + + function scrollToForm() { + formRef.current?.scrollIntoView?.({ behavior: "smooth" }); + } + return ( <> - + + +
+ +
@@ -455,10 +468,6 @@ export default function Home() {
- -
- -
); } 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..1318826 --- /dev/null +++ b/src/components/HeroSlider.tsx @@ -0,0 +1,77 @@ +"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}
+
+ +
+
+
+
+
+ + ))} + + + +
+ ); +} From bf45a1f029afab4d8134be5f5ffa4083d7fa423c Mon Sep 17 00:00:00 2001 From: RizqiSyahrendra Date: Sat, 19 Apr 2025 09:11:48 +0700 Subject: [PATCH 3/4] fix: hero slider add call us --- src/components/HeroSlider.tsx | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/src/components/HeroSlider.tsx b/src/components/HeroSlider.tsx index 1318826..a87b369 100644 --- a/src/components/HeroSlider.tsx +++ b/src/components/HeroSlider.tsx @@ -55,14 +55,23 @@ export default function HeroSlider({ onClickBook }: HeroSliderProps) {
- From ce78370fbb248a1b5b244e573387d039ef6bbd07 Mon Sep 17 00:00:00 2001 From: RizqiSyahrendra Date: Sat, 19 Apr 2025 09:28:15 +0700 Subject: [PATCH 4/4] fix: optimize image render in homepage --- src/app/page.tsx | 297 +++------------------------------ src/components/CardProduct.tsx | 51 ++++++ 2 files changed, 75 insertions(+), 273 deletions(-) create mode 100644 src/components/CardProduct.tsx diff --git a/src/app/page.tsx b/src/app/page.tsx index c1b6b09..7d555ec 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,8 +1,10 @@ "use client"; +import CardProduct from "@/components/CardProduct"; import ContactFormSection from "@/components/ContactFormSection"; import GoogleReviewBox from "@/components/GoogleReviewBox"; import HeroSlider from "@/components/HeroSlider"; +import Image from "next/image"; import Link from "next/link"; import { useRef } from "react"; @@ -80,7 +82,17 @@ export default function Home() {
-
+
+ Experience the Difference in Every Key Turn
@@ -127,278 +139,17 @@ export default function Home() {
-
-
- +
+
+ + + + + +
-
-
-
-
- - - - -
-
- $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 @@ -407,7 +158,7 @@ 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 +
    • +
+
+
+ ); +}