dynamic-realty/dynamic-realty-next
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'dev' (#1) from dev into main

Browse Source 
Reviewed-on: #1
This commit is contained in:
RizqiSyahrendra 2025-04-18 01:42:19 +00:00
commit 871e4b5ecd
15 changed files with 205 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@ -11,7 +11,8 @@
"dependencies": {
"next": "15.3.0",
"react": "^19.0.0",
"react-dom": "^19.0.0"
"react-dom": "^19.0.0",
"swiper": "^11.2.6"
},
"devDependencies": {
"@eslint/eslintrc": "^3",

25
public/css/style.css
View File

@ -11555,7 +11555,6 @@ html.tablet .ui-to-top {
font-weight: 600;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--color-colorHeaderText);
}
.rd-dropdown-link,
@ -11968,16 +11967,18 @@ html.tablet .ui-to-top {
.rd-navbar-fixed .rd-navbar-toggle {
display: inline-block;
position: absolute;
}
.rd-navbar-fixed .rd-navbar-brand {
position: relative;
margin-left: 6px;
margin-left: auto;
margin-right: auto;
}
.rd-navbar-fixed .rd-navbar-brand img {
max-width: 160px;
max-height: 41px;
max-width: 90px;
max-height: 60px;
width: auto;
height: auto;
}
@ -12913,8 +12914,8 @@ html.rd-navbar-fixed-linked .page {
.rd-navbar-classic.rd-navbar-static .rd-navbar-brand img {
width: auto;
height: auto;
max-width: 200px;
max-height: 80px;
max-width: 220px;
max-height: 110px;
}
.rd-navbar-classic.rd-navbar-static .rd-navbar-nav-wrap {
@ -12946,7 +12947,7 @@ html.rd-navbar-fixed-linked .page {
}
.rd-navbar-classic.rd-navbar-static.rd-navbar--is-stuck .rd-navbar-brand img, .rd-navbar-classic.rd-navbar-static.rd-navbar--is-clone .rd-navbar-brand img {
max-height: 50px;
max-height: 74px;
}
.rd-navbar-classic.rd-navbar-static.rd-navbar--is-stuck .rd-navbar-nav-item > .rd-navbar-submenu, .rd-navbar-classic.rd-navbar-static.rd-navbar--is-clone .rd-navbar-nav-item > .rd-navbar-submenu {
@ -13390,8 +13391,8 @@ html.rd-navbar-fixed-linked .page {
.rd-navbar-corporate.rd-navbar-static .rd-navbar-brand img {
width: auto;
height: auto;
max-width: 200px;
max-height: 80px;
max-width: 220px;
max-height: 110px;
}
.rd-navbar-corporate.rd-navbar-static .rd-navbar-nav-wrap {
@ -13539,7 +13540,7 @@ html.rd-navbar-fixed-linked .page {
align-self: stretch;
align-items: stretch;
width: 100%;
height: auto;
height: 100%;
min-height: inherit;
transition-property: transform;
box-sizing: content-box;
@ -13766,8 +13767,8 @@ html.rd-navbar-fixed-linked .page {
.swiper-slide {
position: relative;
display: flex;
align-items: center;
justify-content: center;
/* align-items: center; */
/* justify-content: center; */
flex-shrink: 0;
width: 100%;
height: 100%;

BIN
public/images/bg-header2.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

BIN
public/images/bg-header3.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 62 KiB

BIN
public/images/logo2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.1 KiB

15
src/app/globals.css
View File

@ -14,14 +14,25 @@
--color-colorExt1: #0a0a0a;
--color-colorExt2: #ffffff;
--color-colorExt3: #967244;
--color-colorExt4: #31323c;
--color-colorext4: #bc986b;
--color-colorExt5: #1d1d1d;
--color-colorHeader: var(--color-colorExt1);
--color-colorHeaderText: var(--color-colorExt2);
--color-colorHeaderTextHover: var(--color-colorext4);
--color-colorFooter: var(--color-colorExt1);
--color-colorFooter2: var(--color-colorExt5);
--color-colorFooterText: var(--color-colorExt2);
--color-colorFooterTextHover: var(--color-colorExt3);
--color-colorFormInput: var(--color-colorExt2);
--color-colorContactForm: var(--color-colorExt4);
--color-colorContactForm: var(--color-colorExt5);
--color-colorText1: var(--color-colorExt1);
--color-colorText2: var(--color-colorExt2);
}
@layer components {
.rd-nav-link-custom {
@apply text-colorHeader! lg:text-colorHeaderText! lg:hover:text-colorHeaderTextHover!
}
}
@media (prefers-color-scheme: dark) {

13
src/app/page.tsx
View File

@ -1,13 +1,12 @@
import ContactFormBox from "@/components/ContactFormBox";
import ContactFormSection from "@/components/ContactFormSection";
import GoogleReviewBox from "@/components/GoogleReviewBox";
import Hero from "@/components/Hero";
import Link from "next/link";
export default function Home() {
return (
<>
<section className="section bg-[url(/images/bg-header.webp)] flex! flex-row! justify-end!">
<ContactFormBox />
</section>
<Hero />
<section className="section section-lg bg-default">
<div className="container">
@ -73,7 +72,7 @@ export default function Home() {
<div className="cell-inner box-1-outer">
<div className="box-1">
<div className="text-center">
<h2>About Us</h2>
<h2>Experience the Difference in Every Key Turn</h2>
</div>
<div className="mt-4 text-lg">
<p>
@ -456,6 +455,10 @@ export default function Home() {
</div>
</div>
</section>
<div className="lg:hidden">
<ContactFormSection />
</div>
</>
);
}

4
src/components/ContactFormBox.tsx
View File

@ -1,12 +1,12 @@
export default function ContactFormBox() {
return (
<div className="lg:w-1/3 box-1-cell height-fill context-dark bg-colorContactForm/80!">
<div className="lg:w-1/3 box-1-cell height-fill hidden! lg:flex! context-dark bg-colorContactForm/80! z-20!">
<div className="box-1-bg-shape">
<img className="box-1-bg-image" src="images/bg-shape-1.png" alt="" role="presentation" />
</div>
<div className="cell-inner box-1-outer">
<div className="box-1">
<h2>Find Your Property</h2>
<h2>Get in Touch with Us Today!</h2>
<form className="rd-form">
<div className="row row-x-20 row-20">
<div className="col-sm-6 col-lg-12 col-xl-6">

67
src/components/ContactFormSection.tsx Normal file
View File

@ -0,0 +1,67 @@
export default function ContactFormSection() {
return (
<div className="box-1-cell height-fill context-dark bg-colorContactForm z-20!">
<div className="box-1-bg-shape">
<img className="box-1-bg-image" src="images/bg-shape-1.png" alt="" role="presentation" />
</div>
<div className="cell-inner box-1-outer">
<div className="box-1">
<h2>Get in Touch with Us Today!</h2>
<form className="rd-form">
<div className="row row-x-20 row-20">
<div className="col-sm-6 col-lg-12 col-xl-6">
<div className="form-wrap form-wrap-validation">
<input className="form-input" placeholder="First Name" name="first_name" />
</div>
</div>
<div className="col-sm-6 col-lg-12 col-xl-6">
<div className="form-wrap form-wrap-validation">
<input className="form-input" placeholder="Last Name" name="last_name" />
</div>
</div>
<div className="col-sm-6 col-lg-12 col-xl-6">
<div className="form-wrap form-wrap-validation">
<input type="email" className="form-input" placeholder="E-Mail" name="email" />
</div>
</div>
<div className="col-sm-6 col-lg-12 col-xl-6">
<div className="form-wrap form-wrap-validation">
<input className="form-input" placeholder="Phone Number" name="phone" />
</div>
</div>
<div className="col-sm-12 col-lg-12 col-xl-12">
<div className="form-wrap form-wrap-validation">
<select
className="form-input select-filter"
name="interest"
data-style="modern"
data-classname="select-dropdown-context-dark"
data-placeholder="I'm interested in"
data-minimum-results-for-search="Infinity"
data-constraints="@Required"
>
<option label="placeholder"></option>
<option value="2">Buying</option>
<option value="3">Selling</option>
<option value="4">Renting</option>
</select>
<span className="select-arrow"></span>
</div>
</div>
<div className="col-sm-12 col-lg-12 col-xl-12">
<div className="form-wrap form-wrap-validation">
<textarea className="form-input" placeholder="Questions/Comments" name="question"></textarea>
</div>
</div>
<div className="col-sm-6 col-lg-12 col-xl-6">
<a className="button button-primary-outline min-w-[150px]" href="search-results.html">
Send
</a>
</div>
</div>
</form>
</div>
</div>
</div>
);
}

26
src/components/GoogleReviewBox.tsx
View File

@ -34,8 +34,9 @@ export default function GoogleReviewBox() {
</p>
</div>
<div className="quote-modern-meta-outer">
<img className="quote-modern-avatar" src="images/google-provider.svg" alt="" width="40" height="40" />
<StarRating value={5} />
<div className="quote-modern-meta">
<h4 className="quote-modern-cite">Karen Sanders</h4>
</div>
</div>
</div>
</article>
@ -51,8 +52,11 @@ export default function GoogleReviewBox() {
</p>
</div>
<div className="quote-modern-meta-outer">
<img className="quote-modern-avatar" src="images/google-provider.svg" alt="" width="40" height="40" />
<StarRating value={5} />
<div className="quote-modern-meta-outer">
<div className="quote-modern-meta">
<h4 className="quote-modern-cite">Walter Williams</h4>
</div>
</div>
</div>
</div>
</article>
@ -68,8 +72,11 @@ export default function GoogleReviewBox() {
</p>
</div>
<div className="quote-modern-meta-outer">
<img className="quote-modern-avatar" src="images/google-provider.svg" alt="" width="40" height="40" />
<StarRating value={4} />
<div className="quote-modern-meta-outer">
<div className="quote-modern-meta">
<h4 className="quote-modern-cite">Kate Anderson</h4>
</div>
</div>
</div>
</div>
</article>
@ -85,8 +92,11 @@ export default function GoogleReviewBox() {
</p>
</div>
<div className="quote-modern-meta-outer">
<img className="quote-modern-avatar" src="images/google-provider.svg" alt="" width="40" height="40" />
<StarRating value={4.5} />
<div className="quote-modern-meta-outer">
<div className="quote-modern-meta">
<h4 className="quote-modern-cite">Peter Smith</h4>
</div>
</div>
</div>
</div>
</article>

47
src/components/Hero.tsx Normal file
View File

@ -0,0 +1,47 @@
"use client";
import { Swiper, SwiperSlide } from "swiper/react";
import ContactFormBox from "./ContactFormBox";
import { Autoplay } from "swiper/modules";
export default function Hero() {
return (
<section className="section flex! flex-row! justify-end! relative! min-h-80! lg:min-h-auto!">
<Swiper
className="absolute w-full h-full"
modules={[Autoplay]}
spaceBetween={50}
slidesPerView={1}
autoplay={{ delay: 4000 }}
loop
>
<SwiperSlide className="bg-[url(/images/bg-header2.webp)]">
<section className="section section-lg text-colorText2! bg-colorExt5/50 w-full h-full">
<div className="container">
<div className="row">
<div className="col-12 col-lg-8 text-wrap">
<div className="text-4xl lg:text-8xl!">Real Estate, Refined</div>
<div className="text-2xl lg:text-5xl! mt-12">Where Southern Charm Meets Boutique Real Estate</div>
</div>
</div>
</div>
</section>
</SwiperSlide>
<SwiperSlide className="bg-[url(/images/bg-header3.webp)]">
<section className="section section-lg text-colorText2! bg-colorExt5/50 w-full h-full">
<div className="container">
<div className="row">
<div className="col-12 col-lg-8 text-wrap">
<div className="text-4xl lg:text-8xl!">Your Vision, Our Expertise</div>
<div className="text-2xl lg:text-5xl! mt-12">Discover a Smarter Way to Buy & Sell</div>
</div>
</div>
</div>
</section>
</SwiperSlide>
</Swiper>
<ContactFormBox />
</section>
);
}

8
src/components/layouts/Footer.tsx
View File

@ -117,7 +117,7 @@ export default function Footer() {
</div>
</div>
</section>
<footer className="section footer-classic context-dark bg-colorFooter">
<footer className="section footer-classic context-dark bg-colorFooter2">
<div className="container">
<div className="row row-10 justify-content-sm-between">
<div className="col-sm-6">
@ -130,9 +130,9 @@ export default function Footer() {
</div>
<div className="col-sm-6 text-sm-right">
<div className="right-1">
{/* <a href="#">
<span className="icon mdi mdi-plus"></span>Submit Property
</a> */}
<a href="#">
<span className="icon mdi mdi-plus"></span>Book Appointment
</a>
</div>
</div>
</div>

35
src/components/layouts/Header.tsx
View File

@ -49,7 +49,7 @@ export default function Header() {
</div>
</li>
</ul>
<div className="rd-navbar-aside-item">
<div className="rd-navbar-aside-item hidden lg:block">
<div className="block-inline">
<div className="unit unit-spacing-xs align-items-center">
<span className="unit-left">
@ -70,28 +70,30 @@ export default function Header() {
<span></span>
</button>
<div className="rd-navbar-brand lg:flex lg:flex-col lg:items-center">
<div className="rd-navbar-brand">
<a className="brand" href="/">
<img
className="brand-logo-dark"
src="images/logo-default-142x41.png"
// src="images/logo-default-142x41.png"
src="images/logo2.png"
alt=""
width="142"
height="41"
srcSet="images/logo-default-284x82.png 2x"
srcSet="images/logo2.png 2x"
/>
<img
className="brand-logo-light"
src="images/logo-inverse-121x61.png"
// src="images/logo-inverse-121x61.png"\
src="images/logo2.png"
alt=""
width="121"
height="61"
srcSet="images/logo-inverse-284x82.png 2x"
srcSet="images/logo2.png 2x"
/>
</a>
<h3 className="text-colorHeaderText! font-montserrat! font-semibold! hidden lg:inline">
{/* <h3 className="text-colorHeaderText! font-montserrat! font-semibold! hidden lg:inline">
Dynamic Realty
</h3>
</h3> */}
</div>
</div>
<div className="rd-navbar-nav-wrap">
@ -103,7 +105,7 @@ export default function Header() {
</li>
<li className="rd-nav-item">
<a
className="rd-nav-link"
className="rd-nav-link rd-nav-link-custom"
href="https://dynamicrealtyinc.managebuilding.com/Resident/public/rentals"
target="_blank"
>
@ -111,20 +113,25 @@ export default function Header() {
</a>
</li>
<li className="rd-nav-item">
<a className="rd-nav-link" href="/">
<a className="rd-nav-link rd-nav-link-custom" href="/">
LISTINGS FOR SALE
</a>
</li>
<li className="rd-nav-item">
<a className="rd-nav-link" href="/">
<a className="rd-nav-link rd-nav-link-custom" href="/">
LISTINGS FOR RENT
</a>
</li>
<li className="rd-nav-item">
<a className="rd-nav-link" href="/">
<a className="rd-nav-link rd-nav-link-custom" href="/">
BLOGS
</a>
</li>
<li className="rd-nav-item block lg:hidden!">
<a className="rd-nav-link rd-nav-link-custom" href="/login">
LOGIN
</a>
</li>
{/* <li className="rd-nav-item">
<a className="rd-nav-link" href="#">
Properties
@ -280,8 +287,8 @@ export default function Header() {
</a>
</li> */}
</ul>
<div className="rd-navbar-main-item">
<a className="button button-sm button-primary" href="#">
<div className="rd-navbar-main-item context-dark">
<a className="button button-sm button-primary-outline" href="#">
BOOK APPOINTMENT
</a>
</div>

3
src/middleware.ts
View File

@ -8,7 +8,8 @@ export function middleware(request: NextRequest) {
const host = request.headers.get("x-forwarded-host") || request.nextUrl.hostname;
const path = request.nextUrl.pathname + request.nextUrl.search;
const siteName = "Dynamic Realty";
const metaDesc = "Lorem ipsum dolor sit amet.";
const metaDesc =
"Dynamic Realty is a full-service veteran-owned real estate company based in Centerville, GA, established in 2004.";
// Construct the full URL
const mainUrl = `${protocol}://${host}`;

8
yarn.lock
View File

@ -1450,6 +1450,7 @@ __metadata:
prettier: "npm:^3.5.3"
react: "npm:^19.0.0"
react-dom: "npm:^19.0.0"
swiper: "npm:^11.2.6"
tailwindcss: "npm:^4"
typescript: "npm:^5"
languageName: unknown
@ -3705,6 +3706,13 @@ __metadata:
languageName: node
linkType: hard
"swiper@npm:^11.2.6":
version: 11.2.6
resolution: "swiper@npm:11.2.6"
checksum: 10c0/36ba63e2d1c5045f647f0f07b3a25c164393fb89b17db63f57fa9f776eb61bc5cb2c34634f80cf69caaddc209a174d0cd7be23c580785534569ea4a098b3a42c
languageName: node
linkType: hard
"synckit@npm:^0.11.0":
version: 0.11.4
resolution: "synckit@npm:0.11.4"