424 lines
17 KiB
TypeScript
424 lines
17 KiB
TypeScript
import { headers } from "next/headers";
|
|
import HeaderFeaturedHomes from "./HeaderFeaturedHomes";
|
|
import { HeaderDropdown, HeaderDropdownGroup, HeaderDropdownMenu } from "./HeaderDropdown";
|
|
|
|
export default async function Header() {
|
|
const headerList = await headers();
|
|
const fullUrl = headerList.get("x-full-url");
|
|
|
|
const headerActive = (pathName: string) => {
|
|
if (!fullUrl) return "";
|
|
const splittedUrl = fullUrl.split("/");
|
|
|
|
return splittedUrl[3] === pathName ? "active" : "";
|
|
};
|
|
|
|
return (
|
|
<header className="section page-header">
|
|
<div className="rd-navbar-wrap">
|
|
<nav
|
|
className="rd-navbar rd-navbar-classic"
|
|
data-layout="rd-navbar-fixed"
|
|
data-sm-layout="rd-navbar-fixed"
|
|
data-md-layout="rd-navbar-fixed"
|
|
data-md-device-layout="rd-navbar-fixed"
|
|
data-lg-layout="rd-navbar-static"
|
|
data-lg-device-layout="rd-navbar-fixed"
|
|
data-xl-layout="rd-navbar-static"
|
|
data-xl-device-layout="rd-navbar-static"
|
|
data-lg-stick-up-offset="46px"
|
|
data-xl-stick-up-offset="46px"
|
|
data-xxl-stick-up-offset="46px"
|
|
data-lg-stick-up="true"
|
|
data-xl-stick-up="true"
|
|
data-xxl-stick-up="true"
|
|
>
|
|
<div className="rd-navbar-aside-outer">
|
|
<div className="rd-navbar-aside">
|
|
<div
|
|
className="rd-navbar-collapse-toggle rd-navbar-fixed-element-1"
|
|
data-rd-navbar-toggle=".rd-navbar-collapse"
|
|
>
|
|
<span></span>
|
|
</div>
|
|
<ul className="rd-navbar-aside-list rd-navbar-collapse">
|
|
<li>
|
|
<div className="block-inline unit unit-spacing-xs align-items-center">
|
|
<div className="unit-left">
|
|
<span className="icon text-middle mdi mdi-phone"></span>
|
|
</div>
|
|
<div className="unit-body">
|
|
<a href="tel:(478) 225 9061">(478) 225 9061</a>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div className="block-inline unit unit-spacing-xs align-items-center">
|
|
<div className="unit-left">
|
|
<span className="icon text-middle mdi mdi-email-outline"></span>
|
|
</div>
|
|
<div className="unit-body">
|
|
<a href="mailto:dynamic@dynamicrealtyga.com">dynamic@dynamicrealtyga.com</a>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<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">
|
|
<span className="icon text-middle mdi mdi-login"></span>
|
|
</span>
|
|
<span className="unit-body">
|
|
<a href="/admin/login">Login</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="rd-navbar-main-outer">
|
|
<div className="rd-navbar-main">
|
|
<div className="rd-navbar-panel">
|
|
<button className="rd-navbar-toggle" data-rd-navbar-toggle=".rd-navbar-nav-wrap">
|
|
<span></span>
|
|
</button>
|
|
|
|
<div className="rd-navbar-brand">
|
|
<a className="brand" href="/">
|
|
<img
|
|
className="brand-logo-dark"
|
|
// src="images/logo-default-142x41.png"
|
|
src="/images/logo2.png"
|
|
alt=""
|
|
width="142"
|
|
height="41"
|
|
srcSet="/images/logo2.png 2x"
|
|
/>
|
|
<img
|
|
className="brand-logo-light"
|
|
// src="images/logo-inverse-121x61.png"\
|
|
src="/images/logo2.png"
|
|
alt=""
|
|
width="121"
|
|
height="61"
|
|
srcSet="images/logo2.png 2x"
|
|
/>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div className="rd-navbar-nav-wrap">
|
|
<ul className="rd-navbar-nav">
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link rd-nav-link-custom" href="#">
|
|
Buying / Selling
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link rd-nav-link-custom" href="#">
|
|
Leasing
|
|
</a>
|
|
<HeaderDropdown>
|
|
<HeaderDropdownGroup>
|
|
<div>
|
|
<form>
|
|
<div className="form-wrap">
|
|
<input type="text" id="search" className="form-input" />
|
|
<label className="form-label" htmlFor="search">
|
|
Search
|
|
</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div className="mt-2">
|
|
<HeaderFeaturedHomes />
|
|
</div>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup title="Future Residents">
|
|
<HeaderDropdownMenu
|
|
list={[
|
|
{
|
|
title: "Our Rentals",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Application Process",
|
|
child: [
|
|
{
|
|
title: "Before You Apply",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Rental Criteria",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Before You Apply",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup title="Current Residents">
|
|
<HeaderDropdownMenu
|
|
list={[
|
|
{
|
|
title: "Moving In",
|
|
child: [
|
|
{
|
|
title: "What To Be Done Prior",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Next Steps (keys, utilities, etc)",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Common Questions",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Welcome home",
|
|
child: [
|
|
{
|
|
title: "Payment",
|
|
href: "#",
|
|
},
|
|
{
|
|
title: "Utilities",
|
|
href: "#",
|
|
},
|
|
{
|
|
title: "Maintenance",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Moving Out",
|
|
child: [
|
|
{
|
|
title: "What To Be Done Prior",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Next Steps (keys, utilities, etc)",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Common Questions",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup className="flex! pr-4!">
|
|
<div className="flex flex-col self-end!">
|
|
<a className="button button-secondary" href="/">
|
|
FAQ
|
|
</a>
|
|
<a className="button button-primary mt-2!" href="/">
|
|
APPLY NOW
|
|
</a>
|
|
</div>
|
|
</HeaderDropdownGroup>
|
|
</HeaderDropdown>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className={`rd-nav-link rd-nav-link-custom`} href="/blog">
|
|
Resources
|
|
</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
|
|
</a>
|
|
|
|
<ul className="rd-menu rd-navbar-dropdown">
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="properties-grid.html">
|
|
Properties Grid
|
|
</a>
|
|
</li>
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="properties-grid-2.html">
|
|
Properties Grid 2
|
|
</a>
|
|
</li>
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="properties-list.html">
|
|
Properties List
|
|
</a>
|
|
</li>
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="submit-property.html">
|
|
Submit property
|
|
</a>
|
|
</li>
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="single-property.html">
|
|
Single Property
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="about-us.html">
|
|
About Us
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="blog.html">
|
|
Blog
|
|
</a>
|
|
|
|
<ul className="rd-menu rd-navbar-dropdown">
|
|
<li className="rd-dropdown-item">
|
|
<a className="rd-dropdown-link" href="blog-post.html">
|
|
Blog post
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="#">
|
|
Pages
|
|
</a>
|
|
<HeaderDropdown>
|
|
<HeaderDropdownGroup>
|
|
<div>
|
|
<form>
|
|
<div className="form-wrap">
|
|
<input type="text" id="search" className="form-input" />
|
|
<label className="form-label" htmlFor="search">
|
|
Search
|
|
</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div className="mt-2">
|
|
<HeaderFeaturedHomes />
|
|
</div>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup title="Future Residents">
|
|
<HeaderDropdownMenu
|
|
list={[
|
|
{
|
|
title: "Our Rentals",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Application Process",
|
|
child: [
|
|
{
|
|
title: "Before You Apply",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Rental Criteria",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Before You Apply",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup title="Current Residents">
|
|
<HeaderDropdownMenu
|
|
list={[
|
|
{
|
|
title: "Moving In",
|
|
child: [
|
|
{
|
|
title: "What To Be Done Prior",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Next Steps (keys, utilities, etc)",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Common Questions",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Welcome home",
|
|
child: [
|
|
{
|
|
title: "Payment",
|
|
href: "#",
|
|
},
|
|
{
|
|
title: "Utilities",
|
|
href: "#",
|
|
},
|
|
{
|
|
title: "Maintenance",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Moving Out",
|
|
child: [
|
|
{
|
|
title: "What To Be Done Prior",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Next Steps (keys, utilities, etc)",
|
|
href: "/#",
|
|
},
|
|
{
|
|
title: "Common Questions",
|
|
href: "/#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</HeaderDropdownGroup>
|
|
<HeaderDropdownGroup className="flex! pr-4!">
|
|
<div className="flex flex-col self-end!">
|
|
<a className="button button-secondary" href="/">
|
|
FAQ
|
|
</a>
|
|
<a className="button button-primary mt-2!" href="/">
|
|
APPLY NOW
|
|
</a>
|
|
</div>
|
|
</HeaderDropdownGroup>
|
|
</HeaderDropdown>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="contact-us.html">
|
|
Contact Us
|
|
</a>
|
|
</li> */}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|