This commit is contained in:
omkieit 2024-08-28 20:04:35 +05:30
parent 2b4f9762d7
commit 541cf63eba
10 changed files with 979 additions and 623 deletions

75
ef-ui/dist/assets/index-A1qbMXnH.js vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -27,7 +27,7 @@
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css"> <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<!-- fonts --> <!-- fonts -->
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;800&family=Sen:wght@400;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;800&family=Sen:wght@400;700;800&display=swap" rel="stylesheet">
<script type="module" crossorigin src="/assets/index-CliYtdA_.js"></script> <script type="module" crossorigin src="/assets/index-A1qbMXnH.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BPvgi06w.css"> <link rel="stylesheet" crossorigin href="/assets/index-BPvgi06w.css">
</head> </head>

View File

@ -1,5 +1,7 @@
import { BrowserRouter, Routes, Route } from "react-router-dom"; import { BrowserRouter, Routes, Route } from "react-router-dom";
import Home from "./components/Home"; import Home from "./components/Home";
import About from "./components/About";
import Contact from "./components/Contact";
const App = () => { const App = () => {
@ -7,6 +9,8 @@ const App = () => {
<BrowserRouter> <BrowserRouter>
<Routes> <Routes>
<Route path="/" element={<Home />}></Route> <Route path="/" element={<Home />}></Route>
<Route path="/about" element={<About />}></Route>
<Route path="/contact" element={<Contact/>}></Route>
</Routes> </Routes>
</BrowserRouter> </BrowserRouter>
) )

View File

@ -0,0 +1,50 @@
import Footer from "./Footer"
import Navbar from "./Navbar"
const About = () => {
return (
<>
<Navbar />
<div className="about_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-6">
<h1 className="about_taital">About Us</h1>
<p className="about_text">
There are many variations of passages of Lorem Ipsum
available, but the majority have suffered alteration in some
form, by injected humour, or randomised words which don't look
even slightly believable. If you are going to use a passage of
Lorem Ipsum, you need to be sure there isn't anything
embarrassing hidden in the middle of text. All{" "}
</p>
<div className="read_bt_1">
<a href="#">Read More</a>
</div>
</div>
<div className="col-md-6">
<div className="about_img">
<div className="video_bt">
<div className="play_icon">
<img src="images/play-icon.png" />
</div>
</div>
</div>
</div>
</div>
</div>
<br />
<br />
</div>
<Footer />
</>
)
}
export default About

View File

@ -0,0 +1,74 @@
import Footer from "./Footer"
import Navbar from "./Navbar"
const Contact = () => {
return (
<>
<Navbar />
{/* contact section start */}
<div className="contact_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-12">
<h1 className="contact_taital">Contact Us</h1>
</div>
</div>
</div>
<div className="container-fluid">
<div className="contact_section_2">
<div className="row">
<div className="col-md-6">
<form action>
<div className="mail_section_1">
<input
type="text"
className="mail_text"
placeholder="Name"
name="Name"
/>
<input
type="text"
className="mail_text"
placeholder="Phone Number"
name="Phone Number"
/>
<input
type="text"
className="mail_text"
placeholder="Email"
name="Email"
/>
<textarea
className="massage-bt"
placeholder="Massage"
rows={5}
id="comment"
name="Massage"
defaultValue={""}
/>
<div className="send_bt">
<a href="#">SEND</a>
</div>
</div>
</form>
</div>
<div className="col-md-6 padding_left_15">
<div className="contact_img">
<img src="images/contact-img.png" />
</div>
</div>
</div>
</div>
</div>
</div>
{/* contact section end */}
<Footer />
</>
)
}
export default Contact

View File

@ -0,0 +1,172 @@
const Footer = () => {
const currentYear = new Date().getFullYear();
return (
<>
<div className="header_top_section">
<div className="container">
<div className="row">
<div className="col-sm-12">
<div className="header_top_main">
<div className="call_text">
<a href="#">
<i className="fa fa-phone" aria-hidden="true" />{" "}
+01-40-114-6855
</a>
</div>
<div className="call_text_2">
<a href="#">
<i className="fa fa-envelope" aria-hidden="true" />{" "}
support@estatesfunding.com
</a>
</div>
<div className="call_text_1">
<a href="#">
<i className="fa fa-map-marker" aria-hidden="true" />{" "}
Mordern Tawon Mosco
</a>
</div>
</div>
</div>
</div>
</div>
</div>
{/*
<div className="footer_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-12">
<div className="location_text">
<ul>
<li>
<a href="#">
<span className="padding_15">
<i className="fa fa-mobile" aria-hidden="true" />
</span>{" "}
<br />
Call +01 1234567890
</a>
</li>
<li className="active">
<a href="#">
<span className="padding_15">
<i className="fa fa-envelope" aria-hidden="true" />
</span>{" "}
<br />
demo@gmail.com
</a>
</li>
<li>
<a href="#">
<span className="padding_15">
<i className="fa fa-map-marker" aria-hidden="true" />
</span>{" "}
<br />
Location
</a>
</li>
</ul>
</div>
</div>
</div>
<div className="footer_section_2">
<div className="row">
<div className="col-md-4">
<h2 className="useful_text">QUICK LINKS</h2>
<div className="footer_menu">
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="about.html">About</a>
</li>
<li>
<a href="services.html">Services</a>
</li>
<li>
<a href="projects.html">Projects</a>
</li>
<li>
<a href="contact.html">Contact Us</a>
</li>
</ul>
</div>
</div>
<div className="col-md-4">
<h2 className="useful_text">SIGN UP TO OUR NEWSLETTER</h2>
<div className="form-group">
<textarea
className="update_mail"
placeholder="Enter Your Email"
rows={5}
id="comment"
name="Enter Your Email"
defaultValue={""}
/>
<div className="subscribe_bt">
<a href="#">Subscribe</a>
</div>
</div>
</div>
</div>
</div>
<div className="social_icon">
<ul>
<li>
<a href="#">
<i className="fa fa-facebook" aria-hidden="true" />
</a>
</li>
<li>
<a href="#">
<i className="fa fa-twitter" aria-hidden="true" />
</a>
</li>
<li>
<a href="#">
<i className="fa fa-linkedin" aria-hidden="true" />
</a>
</li>
<li>
<a href="#">
<i className="fa fa-instagram" aria-hidden="true" />
</a>
</li>
</ul>
</div>
</div>
</div> */}
<div className="copyright_section">
<div className="container">
<div className="row">
<div className="col-sm-12">
<p className="copyright_text">
{currentYear} All Rights Reserved.
</p>
</div>
</div>
</div>
</div>
</>
);
};
export default Footer;

View File

@ -1,91 +1,19 @@
import Footer from "./Footer";
import logo from "../logo.png" import Navbar from "./Navbar";
const Home = () => { const Home = () => {
return ( return (
<> <>
<Navbar />
<br />
<br />
<br />
<br />
<br />
<div> <div>
<div className="header_top_section">
<div className="container">
<div className="row">
<div className="col-sm-12">
<div className="header_top_main">
<div className="call_text"><a href="#"><i className="fa fa-phone" aria-hidden="true" /> +01-40-114-6855</a></div>
<div className="call_text_2"><a href="#"><i className="fa fa-envelope" aria-hidden="true" /> demo@gmail.com</a></div>
<div className="call_text_1"><a href="#"><i className="fa fa-map-marker" aria-hidden="true" /> Mordern Tawon Mosco</a></div>
</div>
</div>
</div>
</div>
</div>
{/* header top section start */}
{/* header section start */}
<div className="header_section"> <div className="header_section">
<div className="container-fluid">
<nav className="navbar navbar-expand-lg navbar-light bg-light">
<div>
<img
src={logo}
alt="logo"
width="75"
height="75"
className="img-fluid"
/>
<p
style={{
display: "inline-block",
fontStyle: "italic",
fontSize: "14px",
color: "white",
}}
>
{/* Only Portal of Certified Realtor Lender and Borrowers */}
</p>
</div>
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon" />
</button>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
<ul className="navbar-nav ml-auto">
<li className="nav-item active">
<a className="nav-link" href="index.html">Home</a>
</li>
<li className="nav-item">
<a className="nav-link" href="services.html">Services</a>
</li>
<li className="nav-item">
<a className="nav-link" href="about.html">About</a>
</li>
<li className="nav-item">
<a className="nav-link" href="projects.html">Project</a>
</li>
<li className="nav-item">
<a className="nav-link" href="blog.html">Blog</a>
</li>
<li className="nav-item">
<a className="nav-link" href="testimonial.html">Testimonial</a>
</li>
<li className="nav-item">
<a className="nav-link" href="contact.html">Contact Us</a>
</li>
</ul>
<form className="form-inline my-2 my-lg-0">
<div className="login_text">
<ul>
<li><a href="#">Login</a></li>
<li><a href="#"><i className="fa fa-user" aria-hidden="true" /></a></li>
</ul>
</div>
<div className="quote_btn"><a href="#">Get A Quote</a></div>
</form>
</div>
</nav>
</div>
{/* banner section start */}
<div className="banner_section layout_padding"> <div className="banner_section layout_padding">
<div id="my_slider" className="carousel slide" data-ride="carousel"> <div id="my_slider" className="carousel slide" data-ride="carousel">
<div className="carousel-inner"> <div className="carousel-inner">
@ -94,11 +22,21 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-sm-12"> <div className="col-sm-12">
<div className="banner_taital_main"> <div className="banner_taital_main">
<h1 className="banner_taital">BUILDER CONSTRUCTION SERVICES</h1> <h1 className="banner_taital">
<p className="banner_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna </p> BUILDER CONSTRUCTION SERVICES
</h1>
<p className="banner_text">
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore et
dolore magna{" "}
</p>
<div className="btn_main"> <div className="btn_main">
<div className="started_text active"><a href="#">Contact US</a></div> <div className="started_text active">
<div className="started_text"><a href="#">About Us</a></div> <a href="#">Contact US</a>
</div>
<div className="started_text">
<a href="#">About Us</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -110,11 +48,21 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-sm-12"> <div className="col-sm-12">
<div className="banner_taital_main"> <div className="banner_taital_main">
<h1 className="banner_taital">BUILDER CONSTRUCTION SERVICES</h1> <h1 className="banner_taital">
<p className="banner_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna </p> BUILDER CONSTRUCTION SERVICES
</h1>
<p className="banner_text">
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore et
dolore magna{" "}
</p>
<div className="btn_main"> <div className="btn_main">
<div className="started_text active"><a href="#">Contact US</a></div> <div className="started_text active">
<div className="started_text"><a href="#">About Us</a></div> <a href="#">Contact US</a>
</div>
<div className="started_text">
<a href="#">About Us</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -126,11 +74,20 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-sm-12"> <div className="col-sm-12">
<div className="banner_taital_main"> <div className="banner_taital_main">
<h1 className="banner_taital">BUILDER CONSTRUCTION SERVICES</h1> <h1 className="banner_taital">
<p className="banner_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna </p> BUILDER CONSTRUCTION SERVICES
</h1>
<p className="banner_text">
Lorem ipsum dolor sit amet, consectetur adipiscing
elit, sed do eiusmod tempor incididunt ut labore et
dolore magna{" "}
</p>
<div className="btn_main"> <div className="btn_main">
<div className="started_text active"><a href="#">Contact US</a></div> <div className="started_text active">
<div className="started_text"><a href="#">About Us</a></div> <a href="#">Contact US</a>
</div>
<div className="started_text">
<a href="#">About Us</a>
</div> </div>
</div> </div>
</div> </div>
@ -138,16 +95,28 @@ const Home = () => {
</div> </div>
</div> </div>
</div> </div>
<a className="carousel-control-prev" href="#my_slider" role="button" data-slide="prev"> </div>
<a
className="carousel-control-prev"
href="#my_slider"
role="button"
data-slide="prev"
>
<i className="fa fa-angle-left" /> <i className="fa fa-angle-left" />
</a> </a>
<a className="carousel-control-next" href="#my_slider" role="button" data-slide="next"> <a
className="carousel-control-next"
href="#my_slider"
role="button"
data-slide="next"
>
<i className="fa fa-angle-right" /> <i className="fa fa-angle-right" />
</a> </a>
</div> </div>
</div> </div>
{/* banner section end */} {/* banner section end */}
</div> </div>
{/* header section end */} {/* header section end */}
{/* services section start */} {/* services section start */}
<div className="services_section layout_padding"> <div className="services_section layout_padding">
@ -155,41 +124,76 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-sm-12"> <div className="col-sm-12">
<h1 className="services_taital">Our Services</h1> <h1 className="services_taital">Our Services</h1>
<p className="services_text_1">ssages of Lorem Ipsum available, but the majority have suffered alteration</p> <p className="services_text_1">
ssages of Lorem Ipsum available, but the majority have
suffered alteration
</p>
</div> </div>
</div> </div>
<div className="services_section_2"> <div className="services_section_2">
<div className="row"> <div className="row">
<div className="col-lg-3 col-sm-6"> <div className="col-lg-3 col-sm-6">
<div className="box_main active"> <div className="box_main active">
<div className="service_img"><img src="images/icon-1.png" /></div> <div className="service_img">
<img src="images/icon-1.png" />
</div>
<h4 className="development_text">Construction Services</h4> <h4 className="development_text">Construction Services</h4>
<p className="services_text">fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using L</p> <p className="services_text">
<div className="readmore_bt"><a href="#">Read More</a></div> fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of
using L
</p>
<div className="readmore_bt">
<a href="#">Read More</a>
</div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-sm-6"> <div className="col-lg-3 col-sm-6">
<div className="box_main"> <div className="box_main">
<div className="service_img"><img src="images/icon-2.png" /></div> <div className="service_img">
<img src="images/icon-2.png" />
</div>
<h4 className="development_text">Building Modeling</h4> <h4 className="development_text">Building Modeling</h4>
<p className="services_text">fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using L</p> <p className="services_text">
<div className="readmore_bt"><a href="#">Read More</a></div> fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of
using L
</p>
<div className="readmore_bt">
<a href="#">Read More</a>
</div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-sm-6"> <div className="col-lg-3 col-sm-6">
<div className="box_main"> <div className="box_main">
<div className="service_img"><img src="images/icon-3.png" /></div> <div className="service_img">
<img src="images/icon-3.png" />
</div>
<h4 className="development_text">Pre construction</h4> <h4 className="development_text">Pre construction</h4>
<p className="services_text">fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using L</p> <p className="services_text">
<div className="readmore_bt"><a href="#">Read More</a></div> fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of
using L
</p>
<div className="readmore_bt">
<a href="#">Read More</a>
</div>
</div> </div>
</div> </div>
<div className="col-lg-3 col-sm-6"> <div className="col-lg-3 col-sm-6">
<div className="box_main"> <div className="box_main">
<div className="service_img"><img src="images/icon-4.png" /></div> <div className="service_img">
<img src="images/icon-4.png" />
</div>
<h4 className="development_text">Management</h4> <h4 className="development_text">Management</h4>
<p className="services_text">fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using L</p> <p className="services_text">
<div className="readmore_bt"><a href="#">Read More</a></div> fact that a reader will be distracted by the readable
content of a page when looking at its layout. The point of
using L
</p>
<div className="readmore_bt">
<a href="#">Read More</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -197,26 +201,7 @@ const Home = () => {
</div> </div>
</div> </div>
{/* services section end */} {/* services section end */}
{/* about sectuion start */}
<div className="about_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-6">
<h1 className="about_taital">About Us</h1>
<p className="about_text">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All </p>
<div className="read_bt_1"><a href="#">Read More</a></div>
</div>
<div className="col-md-6">
<div className="about_img">
<div className="video_bt">
<div className="play_icon"><img src="images/play-icon.png" /></div>
</div>
</div>
</div>
</div>
</div>
</div>
{/* about sectuion end */}
{/* projects section start */} {/* projects section start */}
<div className="projects_section layout_padding"> <div className="projects_section layout_padding">
<div className="container"> <div className="container">
@ -227,22 +212,38 @@ const Home = () => {
<div className="nav-tabs-wrapper"> <div className="nav-tabs-wrapper">
<ul className="nav " data-tabs="tabs"> <ul className="nav " data-tabs="tabs">
<li className="nav-item"> <li className="nav-item">
<a className="nav-link active" href="#" data-toggle="tab">Category filter</a> <a
className="nav-link active"
href="#"
data-toggle="tab"
>
Category filter
</a>
</li> </li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link " href="#" data-toggle="tab">All</a> <a className="nav-link " href="#" data-toggle="tab">
All
</a>
</li> </li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link " href="#" data-toggle="tab">Paintingl</a> <a className="nav-link " href="#" data-toggle="tab">
Paintingl
</a>
</li> </li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link " href="#" data-toggle="tab">Reconstructionl</a> <a className="nav-link " href="#" data-toggle="tab">
Reconstructionl
</a>
</li> </li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link " href="#" data-toggle="tab">Repairsl</a> <a className="nav-link " href="#" data-toggle="tab">
Repairsl
</a>
</li> </li>
<li className="nav-item"> <li className="nav-item">
<a className="nav-link " href="#" data-toggle="tab">Residentall</a> <a className="nav-link " href="#" data-toggle="tab">
Residentall
</a>
</li> </li>
</ul> </ul>
</div> </div>
@ -254,50 +255,93 @@ const Home = () => {
<div className="container"> <div className="container">
<div className="pets_section"> <div className="pets_section">
<div className="pets_section_2"> <div className="pets_section_2">
<div id="main_slider" className="carousel slide" data-ride="carousel"> <div
id="main_slider"
className="carousel slide"
data-ride="carousel"
>
<div className="carousel-inner"> <div className="carousel-inner">
<div className="carousel-item active"> <div className="carousel-item active">
<div className="row"> <div className="row">
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-1.png" alt className="image" /> <img
src="images/img-1.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-2.png" alt className="image" /> <img
src="images/img-2.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-3.png" alt className="image" /> <img
src="images/img-3.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
</div> </div>
@ -306,44 +350,83 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-1.png" alt className="image" /> <img
src="images/img-1.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-2.png" alt className="image" /> <img
src="images/img-2.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-3.png" alt className="image" /> <img
src="images/img-3.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
</div> </div>
@ -352,44 +435,83 @@ const Home = () => {
<div className="row"> <div className="row">
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-1.png" alt className="image" /> <img
src="images/img-1.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-2.png" alt className="image" /> <img
src="images/img-2.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
<div className="col-md-4"> <div className="col-md-4">
<div className="container_main"> <div className="container_main">
<img src="images/img-3.png" alt className="image" /> <img
src="images/img-3.png"
alt
className="image"
/>
<div className="overlay"> <div className="overlay">
<div className="text"> <div className="text">
<h4 className="some_text"><i className="fa fa-link" aria-hidden="true" /></h4> <h4 className="some_text">
<i
className="fa fa-link"
aria-hidden="true"
/>
</h4>
</div> </div>
</div> </div>
</div> </div>
<div className="project_main"> <div className="project_main">
<h2 className="work_text">Home Work</h2> <h2 className="work_text">Home Work</h2>
<p className="dummy_text">alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use</p> <p className="dummy_text">
alteration in some form, by injected humour, or
randomised words which don't look even slightly
believable. If you are going to use
</p>
</div> </div>
</div> </div>
</div> </div>
@ -402,186 +524,17 @@ const Home = () => {
</div> </div>
</div> </div>
{/* projects section end */} {/* projects section end */}
{/* testimonial section start */}
<div className="testimonial_section layout_padding">
<div className="container"> <Footer />
<div id="costum_slider" className="carousel slide" data-ride="carousel">
<div className="carousel-inner">
<div className="carousel-item active">
<div className="row">
<div className="col-md-12">
<h1 className="testimonial_taital">Testimonial</h1>
<div className="testimonial_section_2">
<h2 className="client_name_text">Molik <span style={{"float":"right"}}><img src="images/quick-icon.png" /></span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
<div className="testimonial_section_2">
<h2 className="client_name_text"><img src="images/quick-icon.png" /> <span style={{"float":"right"}}>jeaanson</span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
</div>
</div>
</div>
<div className="carousel-item">
<div className="row">
<div className="col-md-12">
<h1 className="testimonial_taital">Testimonial</h1>
<div className="testimonial_section_2">
<h2 className="client_name_text">Molik <span style={{"float":"right"}}><img src="images/quick-icon.png" /></span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
<div className="testimonial_section_2">
<h2 className="client_name_text"><img src="images/quick-icon.png" /> <span style={{"float":"right"}}>jeaanson</span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
</div>
</div>
</div>
<div className="carousel-item">
<div className="row">
<div className="col-md-12">
<h1 className="testimonial_taital">Testimonial</h1>
<div className="testimonial_section_2">
<h2 className="client_name_text">Molik <span style={{"float":"right"}}><img src="images/quick-icon.png" /></span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
<div className="testimonial_section_2">
<h2 className="client_name_text"><img src="images/quick-icon.png" /> <span style={{"float":"right"}}>jeaanson</span></h2>
<p className="textimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugia</p>
</div>
</div>
</div>
</div>
</div>
<a className="carousel-control-prev" href="#costum_slider" role="button" data-slide="prev">
<i className="fa fa-angle-left" />
</a>
<a className="carousel-control-next" href="#costum_slider" role="button" data-slide="next">
<i className="fa fa-angle-right" />
</a>
</div>
</div>
</div>
{/* testimonial section end */}
{/* contact section start */}
<div className="contact_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-12">
<h1 className="contact_taital">Contact Us</h1>
</div>
</div>
</div>
<div className="container-fluid">
<div className="contact_section_2">
<div className="row">
<div className="col-md-6">
<form action>
<div className="mail_section_1">
<input type="text" className="mail_text" placeholder="Name" name="Name" />
<input type="text" className="mail_text" placeholder="Phone Number" name="Phone Number" />
<input type="text" className="mail_text" placeholder="Email" name="Email" />
<textarea className="massage-bt" placeholder="Massage" rows={5} id="comment" name="Massage" defaultValue={""} />
<div className="send_bt"><a href="#">SEND</a></div>
</div>
</form>
</div>
<div className="col-md-6 padding_left_15">
<div className="contact_img"><img src="images/contact-img.png" /></div>
</div>
</div>
</div>
</div>
<div className="map_main">
<div className="map-responsive">
<iframe src="https://www.google.com/maps/embed/v1/place?key=AIzaSyA0s1a7phLN0iaD6-UE7m4qP-z21pH0eSc&q=Eiffel+Tower+Paris+France" width={600} height={600} frameBorder={0} style={{"border":"0","width":"100%"}} allowFullScreen />
</div>
</div>
</div>
{/* contact section end */}
{/* footer section start */}
<div className="footer_section layout_padding">
<div className="container">
<div className="row">
<div className="col-md-12">
<div className="location_text">
<ul>
<li>
<a href="#"><span className="padding_15"><i className="fa fa-mobile" aria-hidden="true" /></span> <br />Call +01 1234567890</a>
</li>
<li className="active">
<a href="#"><span className="padding_15"><i className="fa fa-envelope" aria-hidden="true" /></span> <br />demo@gmail.com</a>
</li>
<li>
<a href="#"><span className="padding_15"><i className="fa fa-map-marker" aria-hidden="true" /></span> <br />Location</a>
</li>
</ul>
</div>
</div>
</div>
<div className="footer_section_2">
<div className="row">
<div className="col-md-4">
<h2 className="useful_text">QUICK LINKS</h2>
<div className="footer_menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="testimonial.html">Testimonial</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
</div>
<div className="col-md-4">
<h2 className="useful_text">Work Portfolio</h2>
<p className="lorem_text">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem</p>
</div>
<div className="col-md-4">
<h2 className="useful_text">SIGN UP TO OUR NEWSLETTER</h2>
<div className="form-group">
<textarea className="update_mail" placeholder="Enter Your Email" rows={5} id="comment" name="Enter Your Email" defaultValue={""} />
<div className="subscribe_bt"><a href="#">Subscribe</a></div>
</div>
</div>
</div>
</div>
<div className="social_icon">
<ul>
<li>
<a href="#"><i className="fa fa-facebook" aria-hidden="true" /></a>
</li>
<li>
<a href="#"><i className="fa fa-twitter" aria-hidden="true" /></a>
</li>
<li>
<a href="#"><i className="fa fa-linkedin" aria-hidden="true" /></a>
</li>
<li>
<a href="#"><i className="fa fa-instagram" aria-hidden="true" /></a>
</li>
</ul>
</div>
</div>
</div>
{/* footer section end */}
{/* copyright section start */} {/* copyright section start */}
<div className="copyright_section">
<div className="container">
<div className="row">
<div className="col-sm-12">
<p className="copyright_text">2019 All Rights Reserved. Design by <a href="https://html.design" rel="nofollow">HTML.DESIGN</a> Distribution by <a href="https://themewagon.com">ThemeWagon</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</> </>
) );
} };
export default Home export default Home;

View File

@ -0,0 +1,96 @@
import { NavLink } from "react-router-dom";
import logo from "../logo.png";
const Navbar = () => {
return (
<>
<div className="container-fluid p-0 m-0">
<nav
className="navbar navbar-expand-lg w-100"
style={{
backgroundColor: "#000000",
position: "fixed", // Make the navbar fixed at the top
top: 0,
left: 0,
right: 0,
zIndex: 1000, // Ensure the navbar is above other elements
}}
>
<div className="container-fluid d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<img
src={logo}
alt="logo"
width="75"
height="75"
className="img-fluid"
/>
<p
style={{
display: "inline-block",
fontStyle: "italic",
fontSize: "14px",
color: "white",
margin: "0 0 0 10px",
}}
>
{/* Only Portal of Certified Realtor Lender and Borrowers */}
</p>
</div>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
<ul className="navbar-nav ml-auto">
<li className="nav-item active">
<NavLink to="/" className="nav-link">
Home
</NavLink>
</li>
<li className="nav-item">
<NavLink to="/services" className="nav-link">
Services
</NavLink>
</li>
<li className="nav-item">
<NavLink to="/about" className="nav-link">
About
</NavLink>
</li>
<li className="nav-item">
<NavLink to="/projects" className="nav-link">
Project
</NavLink>
</li>
<li className="nav-item">
<NavLink to="/contact" className="nav-link">
Contact Us
</NavLink>
</li>
</ul>
<form className="form-inline my-2 my-lg-0">
<div className="login_text">
<ul>
<li>
<a href="#">Login</a>
</li>
<li>
<a href="#">
<i className="fa fa-user" aria-hidden="true" />
</a>
</li>
</ul>
</div>
<div className="quote_btn">
<a href="#">Get A Quote</a>
</div>
</form>
</div>
</div>
</nav>
</div>
</>
);
};
export default Navbar;

7
ef-ui/src/navbar.css Normal file
View File

@ -0,0 +1,7 @@
.header_section {
background-image: none !important;
}
.navbar {
background-image: none !important;
}