434 lines
19 KiB
TypeScript
434 lines
19 KiB
TypeScript
export default function Header() {
|
|
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</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</a>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<div className="rd-navbar-aside-item">
|
|
<div className="block-inline">
|
|
<button
|
|
className="unit unit-spacing-xs align-items-center"
|
|
data-rd-navbar-toggle="#navbar-login-register"
|
|
>
|
|
<span className="unit-left">
|
|
<span className="icon text-middle mdi mdi-login"></span>
|
|
</span>
|
|
<span className="unit-body">
|
|
<span>Login</span>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
<div className="rd-navbar-popup bg-gray-12" id="navbar-login-register">
|
|
<div className="tabs-custom tabs-horizontal tabs-line" id="navbar-tabs">
|
|
<ul className="nav nav-tabs">
|
|
<li className="nav-item" role="presentation">
|
|
<a className="nav-link active" href="#navbar-tabs-1" data-toggle="tab">
|
|
Login
|
|
</a>
|
|
</li>
|
|
<li className="nav-item" role="presentation">
|
|
<a className="nav-link" href="#navbar-tabs-2" data-toggle="tab">
|
|
Register
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div className="tab-content">
|
|
<div className="tab-pane fade show active" id="navbar-tabs-1">
|
|
<form className="rd-form form-1">
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="navbar-login-email"
|
|
type="email"
|
|
name="email"
|
|
data-constraints="@Email @Required"
|
|
/>
|
|
<label className="form-label" htmlFor="navbar-login-email">
|
|
E-mail
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="navbar-login-password"
|
|
type="password"
|
|
name="password"
|
|
data-constraints="@Required"
|
|
/>
|
|
<label className="form-label" htmlFor="navbar-login-password">
|
|
Password
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<button className="button button-sm button-primary button-block" type="submit">
|
|
Sign in
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div className="tab-pane fade" id="navbar-tabs-2">
|
|
<form className="rd-form form-1">
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="register-name"
|
|
type="text"
|
|
name="username"
|
|
data-constraints="@Required"
|
|
/>
|
|
<label className="form-label" htmlFor="register-name">
|
|
Username
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="register-email"
|
|
type="email"
|
|
name="email"
|
|
data-constraints="@Email @Required"
|
|
/>
|
|
<label className="form-label" htmlFor="register-email">
|
|
E-mail
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="register-password"
|
|
type="password"
|
|
name="password"
|
|
data-constraints="@Required"
|
|
/>
|
|
<label className="form-label" htmlFor="register-password">
|
|
Password
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<input
|
|
className="form-input"
|
|
id="register-password-confirm"
|
|
type="password"
|
|
name="password"
|
|
data-constraints="@Required"
|
|
/>
|
|
<label className="form-label" htmlFor="register-password-confirm">
|
|
Confirm Password
|
|
</label>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<button className="button button-sm button-primary button-block" type="submit">
|
|
Create an Account
|
|
</button>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<div className="text-decoration-lines">
|
|
<span className="text-decoration-lines-content">or enter with</span>
|
|
</div>
|
|
</div>
|
|
<div className="form-wrap">
|
|
<div className="button-group">
|
|
<a
|
|
className="button button-facebook button-icon button-icon-only"
|
|
href="#"
|
|
aria-label="Facebook"
|
|
>
|
|
<span className="icon mdi mdi mdi-facebook"></span>
|
|
</a>
|
|
<a
|
|
className="button button-twitter button-icon button-icon-only"
|
|
href="#"
|
|
aria-label="Twitter"
|
|
>
|
|
<span className="icon mdi mdi-twitter"></span>
|
|
</a>
|
|
<a
|
|
className="button button-google button-icon button-icon-only"
|
|
href="#"
|
|
aria-label="Google+"
|
|
>
|
|
<span className="icon mdi mdi-google"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</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 lg:flex lg:flex-col lg:items-center">
|
|
<a className="brand" href="index.html">
|
|
<img
|
|
className="brand-logo-dark"
|
|
src="images/logo-default-142x41.png"
|
|
alt=""
|
|
width="142"
|
|
height="41"
|
|
srcSet="images/logo-default-284x82.png 2x"
|
|
/>
|
|
<img
|
|
className="brand-logo-light"
|
|
src="images/logo-inverse-121x61.png"
|
|
alt=""
|
|
width="121"
|
|
height="61"
|
|
srcSet="images/logo-inverse-284x82.png 2x"
|
|
/>
|
|
</a>
|
|
<h3 className="text-colorHeaderText! font-montserrat! font-semibold! hidden lg:inline">
|
|
Dynamic Realty
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
<div className="rd-navbar-nav-wrap">
|
|
<ul className="rd-navbar-nav">
|
|
<li className="rd-nav-item active">
|
|
<a className="rd-nav-link" href="index.html">
|
|
HOME
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="index.html">
|
|
RENTAL PORTAL
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="index.html">
|
|
LISTINGS FOR SALE
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="index.html">
|
|
LISTINGS FOR RENT
|
|
</a>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="index.html">
|
|
BLOGS
|
|
</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>
|
|
|
|
<ul className="rd-menu rd-navbar-megamenu">
|
|
<li className="rd-megamenu-item">
|
|
<h6 className="rd-megamenu-title">Pages 1</h6>
|
|
<ul className="rd-megamenu-list">
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="agents.html">
|
|
Agents
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="agent-single-page.html">
|
|
Agent Single Page
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="careers.html">
|
|
Careers
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="gallery.html">
|
|
Gallery
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li className="rd-megamenu-item">
|
|
<h6 className="rd-megamenu-title">Pages 2</h6>
|
|
<ul className="rd-megamenu-list">
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="search-results.html">
|
|
Search results
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="coming-soon.html">
|
|
Coming Soon
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="404.html">
|
|
404
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="privacy-policy.html">
|
|
Privacy Policy
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li className="rd-megamenu-item">
|
|
<h6 className="rd-megamenu-title">Elements</h6>
|
|
<ul className="rd-megamenu-list">
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="typography.html">
|
|
Typography
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="buttons.html">
|
|
Buttons
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="forms.html">
|
|
Forms
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="tabs-and-accordions.html">
|
|
Tabs and accordions
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="progress-bars.html">
|
|
Progress bars
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="tables.html">
|
|
Tables
|
|
</a>
|
|
</li>
|
|
<li className="rd-megamenu-list-item">
|
|
<a className="rd-megamenu-list-link" href="grid-system.html">
|
|
Grid System
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li className="rd-nav-item">
|
|
<a className="rd-nav-link" href="contact-us.html">
|
|
Contact Us
|
|
</a>
|
|
</li> */}
|
|
</ul>
|
|
<div className="rd-navbar-main-item">
|
|
<a className="button button-sm button-primary" href="#">
|
|
BOOK APPOINTMENT
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|