106 lines
3.5 KiB
React
106 lines
3.5 KiB
React
import Link from "next/link"
|
|
|
|
export default function Header() {
|
|
return (
|
|
<header className="header">
|
|
<div className="container d-flex justify-content-between align-items-center">
|
|
{/* LOGO */}
|
|
<a href="index.html">
|
|
<img src="assets/images/logo.png" alt="" />
|
|
</a>
|
|
{/* NAV */}
|
|
<nav className="nav">
|
|
<ul>
|
|
<li>
|
|
<a href="project.html">Projects</a>
|
|
</li>
|
|
{/* SERVICES DROPDOWN */}
|
|
<li className="services-menu">
|
|
<a href="#">
|
|
Services
|
|
<span className="arrow" />
|
|
</a>
|
|
<div className="mega-menu">
|
|
{/* LEFT LIST */}
|
|
<div className="menu-left">
|
|
<h2> Services</h2>
|
|
<div className="separator"></div>
|
|
<ul>
|
|
<li data-img="img1" className="active">
|
|
<a href="Visualization_interior.html">
|
|
3D Visualization and <br /> Interior Design{" "}
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img2">
|
|
<a href="Kitchen_bath.html">
|
|
Kitchen & Bath Remodelling
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img3">
|
|
<a href="Interior_remodelling.html">
|
|
Interior Remodelling
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img4">
|
|
<a href="outdoor_living.html">
|
|
Outdoor Living & Kitchens
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img5">
|
|
<a href="Smart_home.html">
|
|
Smart Home & <br /> Technology
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img6">
|
|
<a href="approval,_documentation.html">
|
|
Approval, Documentation, <br /> and Project Supervision
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
<li data-img="img7">
|
|
<a href="Sunroomsenclosures.html">
|
|
Sunrooms & Enclosures
|
|
<img src="assets/images/arrownext.png" alt="" />
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{/* RIGHT IMAGE */}
|
|
<div className="menu-right">
|
|
<img
|
|
id="serviceImage"
|
|
src="assets/images/menuimages1.png"
|
|
alt=""
|
|
style={{ opacity: 1 }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<a href="process">Our Process</a>
|
|
</li>
|
|
<li>
|
|
<a href="about">About Us</a>
|
|
</li>
|
|
<li>
|
|
<a href="blog">blog</a>
|
|
</li>
|
|
<li>
|
|
<a href="contact">Contact</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
{/* CTA */}
|
|
<a href="contact" className="btn-primary-custom">
|
|
Get a Quote
|
|
</a>
|
|
</div>
|
|
</header>
|
|
|
|
)
|
|
} |