Clean up html
This commit is contained in:
Olu Amey
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 7.9 KiB |
@@ -1,331 +0,0 @@
|
||||
import React , {useState, useEffect} from 'react'
|
||||
import { HashLink as Link } from 'react-router-hash-link';
|
||||
import Design from '../HomeMain/Design/Main'
|
||||
import Work from '../HomeMain/Work/Main'
|
||||
import Testimonial from '../HomeMain/Testimonial/Main'
|
||||
import AboutApp from '../HomeMain/AboutApp/Main'
|
||||
import Trusted from '../HomeMain/Trusted/Main'
|
||||
import Pricing from '../HomeMain/Pricing/Main'
|
||||
import Faq from '../HomeMain/Faq/Main'
|
||||
import Interface from '../HomeMain/Interface/Main'
|
||||
import Download from '../HomeMain/Download/Main'
|
||||
import Story from '../HomeMain/Story/Main'
|
||||
|
||||
|
||||
const Main = ({setnavbar,setfooter,setbrdcum}) => {
|
||||
|
||||
const [ytShow , setytShow] = useState (false)
|
||||
useEffect(() => {
|
||||
setfooter({f2 : true})
|
||||
setnavbar({n3 : true})
|
||||
setbrdcum({b2 : true})
|
||||
localStorage.setItem("navbar","darkhome")
|
||||
|
||||
}, [])
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
|
||||
{/* <div className="home-dark-block">
|
||||
<header style={{position : "fixed"}}>
|
||||
<div className="container">
|
||||
<nav className="navbar navbar-expand-lg">
|
||||
<Link to="/" className="navbar-brand">
|
||||
<img src="assets/images/logo.png" alt="image" />
|
||||
</Link>
|
||||
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<div className={`toggle-wrap ${mobile && "active"}`} onClick = {() => setmobile(true)}>
|
||||
<span className="toggle-bar" onClick = {() => setmobile(false)}></span>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<div className={`collapse navbar-collapse ${mobile && "show"}`}>
|
||||
<ul className="navbar-nav ml-auto">
|
||||
<li className="nav-item has_dropdown">
|
||||
<Link to="#" className="nav-link" >Home</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu">
|
||||
<ul>
|
||||
<li><Link to="/">Home Defoult</Link></li>
|
||||
<li><Link to="/home-dark">Home Dark Hero</Link></li>
|
||||
<li><Link to="/home-wave">Home Wave </Link></li>
|
||||
<li><Link to="/home-gredient">Home Gredient</Link></li>
|
||||
<li><Link to="/home-video">Home Video</Link></li>
|
||||
<li><Link to="/home-video2">Home Video 2</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#features" className="nav-link">Features</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#how_it_work" className="nav-link">How it works</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown">
|
||||
<Link to="#" className="nav-link">Pages</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu">
|
||||
<ul>
|
||||
<li><Link to="/about">About Us</Link></li>
|
||||
<li><Link to="/review">Reviews</Link></li>
|
||||
<li><Link to="/contact">Contact Us</Link></li>
|
||||
<li><Link to="/faq">Faq</Link></li>
|
||||
<li><Link to="/sign-in">Sign In</Link></li>
|
||||
<li><Link to="/sign-up">Sign Up</Link></li>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/pricing" className="nav-link">Pricing</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown">
|
||||
<Link to="#" className="nav-link">Blog</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu">
|
||||
<ul>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link" >Contact</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link dark_btn">GET STARTED</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
</div> */}
|
||||
<section className="banner_section homedark-banner">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<span className="banner_shape1"> <img src="assets/images/banner-shape-one1.png" alt="image" /> </span>
|
||||
<span className="banner_shape2"> <img src="assets/images/banner-shape2two.png" alt="image" /> </span>
|
||||
<span className="banner_shape3"> <img src="assets/images/banner-shapethree3.png" alt="image" /> </span>
|
||||
|
||||
<div className="col-lg-8 col-md-12 mx-auto" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="banner_text">
|
||||
<h1>Best way to manage your customers easily.</h1>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and setting indus orem Ipsum has been the industrys standard dummy text ever.
|
||||
</p>
|
||||
</div>
|
||||
<div className="yt_video" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="thumbnil">
|
||||
<a className="popup-youtube play-button" onClick = {() => setytShow(true)} data-url="#" data-toggle="modal" data-target="#myModal" title="XJj2PbenIsU">
|
||||
<span className="play_btn">
|
||||
<img src="assets/images/play_icon.png" alt="image" />
|
||||
<div className="waves-block">
|
||||
<div className="waves wave-1"></div>
|
||||
<div className="waves wave-2"></div>
|
||||
<div className="waves wave-3"></div>
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="container-fluid" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="banner_images">
|
||||
<div className="row d-flex justify-content-center">
|
||||
<div className="col-md-2 col-lg-2 col-sm-4 col-xs-4 d-none d-lg-block">
|
||||
<div className="banner_screen screen1">
|
||||
<img className="moving_position_animatin" src="assets/images/hero-image-5.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4 col-lg-2 col-sm-4 col-xs-4">
|
||||
<div className="banner_screen screen2">
|
||||
<img className="moving_animation" src="assets/images/hero-image-4.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4 col-lg-3 col-sm-4 col-xs-4">
|
||||
<div className="banner_screen screen3">
|
||||
<img className="moving_position_animatin" src="assets/images/hero-image-1.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4 col-lg-2 col-sm-4 col-xs-4">
|
||||
<div className="banner_screen screen4">
|
||||
<img className="moving_animation" src="assets/images/hero-image-2.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-2 col-lg-2 col-sm-4 col-xs-4 d-none d-lg-block">
|
||||
<div className="banner_screen screen5">
|
||||
<img className="moving_position_animatin" src="assets/images/hero-image-3.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am download_section homedark-download">
|
||||
<div className="container">
|
||||
<ul className="app_btn" data-aos="fade-in" data-aos-duration="1500">
|
||||
<li>
|
||||
<a href="#" className="app_store">
|
||||
<img className="blue_img" src="assets/images/appstore_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/appstore_white.png" alt="image" />
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<img className="blue_img" src="assets/images/googleplay_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/googleplay_white.png" alt="image" />
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am statistic_section">
|
||||
<div className="container">
|
||||
<ul className="app_statstic" id="counter" >
|
||||
<div className="col-md-3 col-lg-3 col-sm-6 col-xs-12" data-aos="fade-up" data-aos-duration="1000">
|
||||
<li>
|
||||
<div className="icon">
|
||||
<img src="assets/images/download-dark.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<p><span className="counter-value" data-count="17">0</span><span>M+</span></p>
|
||||
<p>Download</p>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<div className="col-md-3 col-lg-3 col-sm-6 col-xs-12 " data-aos="fade-up" data-aos-duration="1200">
|
||||
<li>
|
||||
<div className="icon">
|
||||
<img src="assets/images/followers-dark.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<p><span className="counter-value" data-count="08">0 </span><span>M+</span></p>
|
||||
<p>Followers</p>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<div className="col-md-3 col-lg-3 col-sm-6 col-xs-12 " data-aos="fade-up" data-aos-duration="1400">
|
||||
<li>
|
||||
<div className="icon">
|
||||
<img src="assets/images/reviews-dark.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<p><span className="counter-value" data-count="2300">1500</span><span>+</span></p>
|
||||
<p>Reviews</p>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<div className="col-md-3 col-lg-3 col-sm-6 col-xs-12 " data-aos="fade-up" data-aos-duration="1600">
|
||||
<li>
|
||||
<div className="icon">
|
||||
<img src="assets/images/countries-dark.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<p><span className="counter-value" data-count="150">0</span><span>+</span></p>
|
||||
<p>Countries</p>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am features_section homedark-features" id="features">
|
||||
<div className="container">
|
||||
<div className="features_inner">
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="300">
|
||||
<h2><span>Features</span> that makes app different!</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy</p>
|
||||
</div>
|
||||
<div className="features_block">
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="feature_box" data-aos="fade-up" data-aos-duration="1500">
|
||||
<div className="image">
|
||||
<img src="assets/images/features1.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Secure data</h4>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="feature_box" data-aos="fade-up" data-aos-duration="1700">
|
||||
<div className="image">
|
||||
<img src="assets/images/features2.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Automate everything</h4>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4">
|
||||
<div className="feature_box" data-aos="fade-up" data-aos-duration="1900">
|
||||
<div className="image">
|
||||
<img src="assets/images/features3.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Secure data</h4>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe standard dummy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
< AboutApp dark = {true}/>
|
||||
<Design />
|
||||
<Work dark = {true}/>
|
||||
<Testimonial />
|
||||
<Trusted />
|
||||
<Pricing />
|
||||
<Faq/>
|
||||
<Interface/>
|
||||
<Download />
|
||||
<Story />
|
||||
{ytShow &&
|
||||
<>
|
||||
<div className="modal fade youtube-video show" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-modal="true" style={{paddingRight: "17px", display: "block"}}>
|
||||
<div className="modal-dialog" role="document">
|
||||
<div className="modal-content">
|
||||
<button id="close-video" type="button" className="button btn btn-default text-right" data-dismiss="modal">
|
||||
<i className="icofont-close-line-circled" onClick={() => setytShow(false)}></i>
|
||||
</button>
|
||||
<div className="modal-body">
|
||||
<div id="video-container" className="video-container">
|
||||
<iframe id="youtubevideo" src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1&mute=1" width="640" height="360" frameborder="0" allowfullscreen=""></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div className="modal-footer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="purple_backdrop"></div>
|
||||
</>}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Main
|
||||
@@ -1,197 +0,0 @@
|
||||
import { HashLink as Link } from 'react-router-hash-link';
|
||||
import React , {useState,useEffect} from 'react'
|
||||
import Trusted from '../HomeMain/Trusted/Main'
|
||||
import Features from '../HomeMain/Features/Main'
|
||||
import AboutApp from '../HomeMain/AboutApp/Main'
|
||||
import Design from '../HomeMain/Design/Main'
|
||||
import Testimonial from '../HomeMain/Testimonial/Main'
|
||||
import Pricing from '../HomeMain/Pricing/Main'
|
||||
import Faq from '../HomeMain/Faq/Main'
|
||||
import Interface from '../HomeMain/Interface/Main'
|
||||
import Download from '../HomeMain/Download/Main'
|
||||
import Story from '../HomeMain/Story/Main'
|
||||
|
||||
const Main = ({setnavbar,setfooter,setbrdcum}) => {
|
||||
const [ytShow , setytShow] = useState (false)
|
||||
|
||||
useEffect(() => {
|
||||
setfooter({f1 : true})
|
||||
setnavbar({n6 : true})
|
||||
setbrdcum({b3 : true})
|
||||
localStorage.setItem("navbar","homevideo")
|
||||
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className="banner_section home-video">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-12" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="banner_text">
|
||||
<h1>apper</h1>
|
||||
<h2>Best way to <span>manage your customers.</span></h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and setting indus orem Ipsum has been the industrys.
|
||||
</p>
|
||||
</div>
|
||||
<ul className="app_btn">
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/appstore_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/appstore_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/googleplay_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/googleplay_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="used_app">
|
||||
<ul>
|
||||
<li><img src="assets/images/used01.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used02.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used03.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used04.png" alt="image" /></li>
|
||||
</ul>
|
||||
<p>12M + <br/> used this app</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-12" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="banner_image">
|
||||
<img src="assets/images/hero-image.png" alt="image" />
|
||||
<div className="yt_video" >
|
||||
<div className="thumbnil">
|
||||
<a className="popup-youtube play-button" data-url="#" onClick={() => setytShow(true)} data-toggle="modal" data-target="#myModal" title="XJj2PbenIsU">
|
||||
<span className="play_btn">
|
||||
<img src="assets/images/play_icon.png" alt="image" />
|
||||
<div className="waves-block">
|
||||
<div className="waves wave-1"></div>
|
||||
<div className="waves wave-2"></div>
|
||||
<div className="waves wave-3"></div>
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<Trusted />
|
||||
<Features video = {true} />
|
||||
<AboutApp video = {true}/>
|
||||
<Design />
|
||||
<section className="row_am how_it_works video-work" id="how_it_work">
|
||||
<div className="container">
|
||||
<div className="how_it_inner">
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="300">
|
||||
<h2><span>How it works</span> - 3 easy steps</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe
|
||||
standard dummy.</p>
|
||||
</div>
|
||||
<div className="step_block">
|
||||
|
||||
<div className="row ">
|
||||
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/secure.png" alt="image" />
|
||||
<div className="step_number">
|
||||
<h3>01</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="step_text" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>Download app</h4>
|
||||
<div className="app_icon">
|
||||
<Link to="#"><i className="icofont-brand-android-robot"></i></Link>
|
||||
<Link to="#"><i className="icofont-brand-apple"></i></Link>
|
||||
<Link to="#"><i className="icofont-brand-windows"></i></Link>
|
||||
</div>
|
||||
<p>Download App either for Windows, Mac or Android</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/abt_functional.png" alt="image" />
|
||||
<div className="step_number">
|
||||
<h3>02</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="step_text step2" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>Create account</h4>
|
||||
<span>14 days free trial</span>
|
||||
<p>Sign up free for App account. One account for all devices.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/communication.png" alt="image" />
|
||||
<div className="step_number">
|
||||
<h3>03</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="step_text step3" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>It’s done, enjoy the app</h4>
|
||||
<span>Have any questions check our FAQs</span>
|
||||
<p>Get most amazing app experience, Explore and share the app</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
<Testimonial />
|
||||
<Pricing video = {true}/>
|
||||
<Faq/>
|
||||
<Interface/>
|
||||
<Download />
|
||||
<Story/>
|
||||
{ytShow &&
|
||||
<>
|
||||
<div className="modal fade youtube-video show" id="myModal" tabIndex="-1" role="dialog" aria-labelledby="myModalLabel" aria-modal="true" style={{paddingRight: "17px", display: "block"}}>
|
||||
<div className="modal-dialog" role="document">
|
||||
<div className="modal-content">
|
||||
<button id="close-video" type="button" className="button btn btn-default text-right" data-dismiss="modal">
|
||||
<i className="icofont-close-line-circled" onClick={() => setytShow(false)}></i>
|
||||
</button>
|
||||
<div className="modal-body">
|
||||
<div id="video-container" className="video-container">
|
||||
<iframe id="youtubevideo" src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1&mute=1" width="640" height="360" frameBorder="0" allowFullScreen=""></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div className="modal-footer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="purple_backdrop"></div>
|
||||
</>}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Main
|
||||
@@ -1,240 +0,0 @@
|
||||
import React , { useState , useEffect} from 'react'
|
||||
import { HashLink as Link } from 'react-router-hash-link';
|
||||
import Trusted from '../HomeMain/Trusted/Main'
|
||||
import AboutApp from '../HomeMain/AboutApp/Main'
|
||||
import Design from '../HomeMain/Design/Main'
|
||||
import Testimonial from '../HomeMain/Testimonial/Main'
|
||||
import Pricing from '../HomeMain/Pricing/Main'
|
||||
import Faq from '../HomeMain/Faq/Main'
|
||||
import Interface from '../HomeMain/Interface/Main'
|
||||
import Download from '../HomeMain/Download/Main'
|
||||
import Story from '../HomeMain/Story/Main'
|
||||
|
||||
const Main = ({setfooter,setnavbar,setbrdcum}) => {
|
||||
|
||||
const [ytShow , setytShow] = useState (false)
|
||||
useEffect(() => {
|
||||
setfooter({f4 : true})
|
||||
setnavbar({n4 : true})
|
||||
setbrdcum({b4 : true})
|
||||
localStorage.setItem("navbar","homevideotwo")
|
||||
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className="banner_section home-video-two">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-7 col-md-12" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="banner_text">
|
||||
<h1>Best way to manage your customers.</h1>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and setting indus orem Ipsum has been the industrys.
|
||||
</p>
|
||||
</div>
|
||||
<ul className="app_btn">
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/appstore_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/appstore_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/googleplay_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/googleplay_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="used_app">
|
||||
<ul>
|
||||
<li><img src="assets/images/used01.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used02.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used03.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used04.png" alt="image" /></li>
|
||||
</ul>
|
||||
<p>12M + <br/> used this app</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-4 col-md-12" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="banner_image">
|
||||
<div className="yt_video" >
|
||||
<div className="thumbnil">
|
||||
<a className="popup-youtube play-button" onClick={() => setytShow(true)} data-url="#" data-toggle="modal" data-target="#myModal" title="XJj2PbenIsU">
|
||||
<span className="play_btn">
|
||||
<img src="assets/images/play_icon.png" alt="image" />
|
||||
<div className="waves-block">
|
||||
<div className="waves wave-1"></div>
|
||||
<div className="waves wave-2"></div>
|
||||
<div className="waves wave-3"></div>
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section className="row_am features_section features-video" id="features">
|
||||
<div className="container">
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
||||
<h2><span>Features</span> that makes app different!</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe
|
||||
standard dummy.</p>
|
||||
</div>
|
||||
<div className="feature_detail">
|
||||
<div className="left_data feature_box">
|
||||
<div className="data_block block1" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="icon">
|
||||
<img src="assets/images/secure.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Secure data</h4>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and type setting indus ideas.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="data_block block2" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="icon">
|
||||
<img src="assets/images/step2.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Fully functional</h4>
|
||||
<p>Simply dummy text of the printing and typesetting indus lorem Ipsum is dummy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="right_data feature_box">
|
||||
<div className="data_block block3" data-aos="fade-left" data-aos-duration="1500">
|
||||
<div className="icon">
|
||||
<img src="assets/images/step3.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>Live chat</h4>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and type setting indus ideas.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="data_block block4" data-aos="fade-left" data-aos-duration="1500">
|
||||
<div className="icon">
|
||||
<img src="assets/images/abt_support.png" alt="image" />
|
||||
</div>
|
||||
<div className="text">
|
||||
<h4>24-7 Support</h4>
|
||||
<p>Simply dummy text of the printing and typesetting indus lorem Ipsum is dummy.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="feature_img" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
|
||||
<img src="assets/images/features_frame.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<AboutApp video = {true} />
|
||||
<Design />
|
||||
<section className="row_am how_it_works video-work-two" id="how_it_work">
|
||||
<div className="container">
|
||||
<div className="how_it_inner">
|
||||
<div className="section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="300">
|
||||
<h2>How it works - 3 easy steps</h2>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and typese tting <br/> indus orem Ipsum has beenthe
|
||||
standard dummy.</p>
|
||||
</div>
|
||||
<div className="step_block">
|
||||
<div className="row ">
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/step1.png" alt="image"/>
|
||||
<div className="step_number">
|
||||
<h3>01</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div className="step_text" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>Download app</h4>
|
||||
<div className="app_icon">
|
||||
<Link to="#"><i className="icofont-brand-android-robot"></i></Link>
|
||||
<Link to="#"><i className="icofont-brand-apple"></i></Link>
|
||||
<Link to="#"><i className="icofont-brand-windows"></i></Link>
|
||||
</div>
|
||||
<p>Download App either for Windows, Mac or Android</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/step2.png" alt="image" />
|
||||
<div className="step_number">
|
||||
<h3>02</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div className="step_text step2" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>Create account</h4>
|
||||
<span>14 days free trial</span>
|
||||
<p>Sign up free for App account. One account for all devices.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-4 col-sm-12">
|
||||
<div className="step_box">
|
||||
<div className="step_img" data-aos="fade-left" data-aos-duration="1500">
|
||||
<img src="assets/images/step3.png" alt="image" />
|
||||
<div className="step_number">
|
||||
<h3>03</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div className="step_text step3" data-aos="fade-right" data-aos-duration="1500">
|
||||
<h4>It’s done, enjoy the app</h4>
|
||||
<span>Have any questions check our FAQs</span>
|
||||
<p>Get most amazing app experience, Explore and share the app</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<Testimonial />
|
||||
<Trusted />
|
||||
<Pricing video = {true}/>
|
||||
<Faq/>
|
||||
<Interface/>
|
||||
<Download />
|
||||
<Story/>
|
||||
{ytShow &&
|
||||
<>
|
||||
<div className="modal fade youtube-video show" id="myModal" tabIndex="-1" role="dialog" aria-labelledby="myModalLabel" aria-modal="true" style={{paddingRight: "17px", display: "block"}}>
|
||||
<div className="modal-dialog" role="document">
|
||||
<div className="modal-content">
|
||||
<button id="close-video" type="button" className="button btn btn-default text-right" data-dismiss="modal">
|
||||
<i className="icofont-close-line-circled" onClick={() => setytShow(false)}></i>
|
||||
</button>
|
||||
<div className="modal-body">
|
||||
<div id="video-container" className="video-container">
|
||||
<iframe id="youtubevideo" src="https://www.youtube.com/embed/tgbNymZ7vqY?autoplay=1&mute=1" width="640" height="360" frameBorder="0" allowFullScreen=""></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div className="modal-footer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="purple_backdrop"></div>
|
||||
</>}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Main
|
||||
@@ -1,236 +0,0 @@
|
||||
|
||||
import { HashLink as Link } from 'react-router-hash-link';
|
||||
import React , { useState ,useEffect } from 'react'
|
||||
import Trusted from '../HomeMain/Trusted/Main'
|
||||
import Features from '../HomeMain/Features/Main'
|
||||
import AboutApp from '../HomeMain/AboutApp/Main'
|
||||
import Design from '../HomeMain/Design/Main'
|
||||
import Work from '../HomeMain/Work/Main'
|
||||
import Testimonial from '../HomeMain/Testimonial/Main'
|
||||
import Pricing from '../HomeMain/Pricing/Main'
|
||||
import Faq from '../HomeMain/Faq/Main'
|
||||
import Interface from '../HomeMain/Interface/Main'
|
||||
import Download from '../HomeMain/Download/Main'
|
||||
import Story from '../HomeMain/Story/Main'
|
||||
|
||||
const Main = ({setnavbar , setfooter , setbrdcum }) => {
|
||||
|
||||
useEffect(() => {
|
||||
setfooter({f5 : true})
|
||||
setbrdcum({b1 : true})
|
||||
setnavbar({n4 : true})
|
||||
localStorage.setItem("navbar","homewave")
|
||||
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* <header className="white_header fix_style fixed header-wave">
|
||||
<div className="container">
|
||||
<nav className="navbar navbar-expand-lg">
|
||||
<Link to="/" className="navbar-brand">
|
||||
<img src="assets/images/footer_logo.png" alt="image" />
|
||||
</Link>
|
||||
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
|
||||
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<div className={`toggle-wrap ${mobile && "active"}`} onClick={() => setmobile(mobile === true ? false : true)}>
|
||||
<span className="toggle-bar"></span>
|
||||
</div>
|
||||
</button>
|
||||
<div className="collapse navbar-collapse" >
|
||||
<ul className="navbar-nav ml-auto">
|
||||
<li className="nav-item has_dropdown" >
|
||||
<Link to="#" className="nav-link" >Home</Link>
|
||||
<span className="drp_btn" ><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu">
|
||||
<ul>
|
||||
<li><Link to="/">Home Defoult</Link></li>
|
||||
<li><Link to="/home-dark">Home Dark Hero</Link></li>
|
||||
<li><Link to="/home-wave">Home Wave </Link></li>
|
||||
<li><Link to="/home-gredient">Home Gredient</Link></li>
|
||||
<li><Link to="/home-video">Home Video</Link></li>
|
||||
<li><Link to="/home-video2">Home Video 2</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#features" className="nav-link">Features</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#how_it_work" className="nav-link">How it works</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown" >
|
||||
<Link to="#" className="nav-link">Pages</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu" >
|
||||
<ul>
|
||||
<li><Link to="/about">About Us</Link></li>
|
||||
<li><Link to="/review">Reviews</Link></li>
|
||||
<li><Link to="/contact">Contact Us</Link></li>
|
||||
<li><Link to="/faq">Faq</Link></li>
|
||||
<li><Link to="/sign-in">Sign In</Link></li>
|
||||
<li><Link to="/sign-up">Sign Up</Link></li>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/pricing" className="nav-link">Pricing</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown" >
|
||||
<Link to="#" className="nav-link">Blog</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu">
|
||||
<ul>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link" >Contact</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link dark_btn">GET STARTED</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className={`collapse navbar-collapse mobile-screen ${mobile && "show"}`} >
|
||||
<ul className="navbar-nav ml-auto">
|
||||
<li className="nav-item has_dropdown" onClick={() => setShow(show === true ? false : true)}>
|
||||
<Link to="#" className="nav-link" >Home</Link>
|
||||
<span className="drp_btn" ><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu" style={{ display: show ? "block" : "none" }}>
|
||||
<ul>
|
||||
<li><Link to="/">Home Defoult</Link></li>
|
||||
<li><Link to="/home-dark">Home Dark Hero</Link></li>
|
||||
<li><Link to="/home-wave">Home Wave </Link></li>
|
||||
<li><Link to="/home-gredient">Home Gredient</Link></li>
|
||||
<li><Link to="/home-video">Home Video</Link></li>
|
||||
<li><Link to="/home-video2">Home Video 2</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#features" className="nav-link">Features</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link smooth to="#how_it_work" className="nav-link">How it works</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown" onClick={() => setShow1(show1 === true ? false : true)}>
|
||||
<Link to="#" className="nav-link">Pages</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu" style={{ display: show1 ? "block" : "none" }}>
|
||||
<ul>
|
||||
<li><Link to="/about">About Us</Link></li>
|
||||
<li><Link to="/review">Reviews</Link></li>
|
||||
<li><Link to="/contact">Contact Us</Link></li>
|
||||
<li><Link to="/faq">Faq</Link></li>
|
||||
<li><Link to="/sign-in">Sign In</Link></li>
|
||||
<li><Link to="/sign-up">Sign Up</Link></li>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/pricing" className="nav-link">Pricing</Link>
|
||||
</li>
|
||||
<li className="nav-item has_dropdown" onClick={() => setShow2(show2 === true ? false : true)}>
|
||||
<Link to="#" className="nav-link">Blog</Link>
|
||||
<span className="drp_btn"><i className="icofont-rounded-down"></i></span>
|
||||
<div className="sub_menu" style={{ display: show2 ? "block" : "none" }}>
|
||||
<ul>
|
||||
<li><Link to="/blog">Blog List</Link></li>
|
||||
<li><Link to="/blog-single">Blog Single</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link" >Contact</Link>
|
||||
</li>
|
||||
<li className="nav-item">
|
||||
<Link to="/contact" className="nav-link dark_btn">GET STARTED</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header> */}
|
||||
<section className="banner_section home-wave">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-6 col-md-12" data-aos="fade-right" data-aos-duration="1500">
|
||||
<div className="banner_text">
|
||||
<h1>Best way to manage your customers.</h1>
|
||||
<p>Lorem Ipsum is simply dummy text of the printing and setting indus orem Ipsum has been the industrys.
|
||||
</p>
|
||||
</div>
|
||||
<ul className="app_btn">
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/appstore_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/appstore_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="#">
|
||||
<img className="blue_img" src="assets/images/googleplay_blue.png" alt="image" />
|
||||
<img className="white_img" src="assets/images/googleplay_white.png" alt="image" />
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="used_app">
|
||||
<ul>
|
||||
<li><img src="assets/images/used01.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used02.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used03.png" alt="image" /></li>
|
||||
<li><img src="assets/images/used04.png" alt="image" /></li>
|
||||
</ul>
|
||||
<p>12M + <br/> used this app</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6 col-md-12" data-aos="fade-in" data-aos-duration="1500">
|
||||
<div className="banner_image">
|
||||
<img className="moving_animation" src="assets/images/banner-image.png" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="banner_shape1"> <img src="assets/images/banner-shape1.png" alt="image" /> </span>
|
||||
<span className="banner_shape2"> <img src="assets/images/banner-shape2.png" alt="image" /> </span>
|
||||
<span className="banner_shape3"> <img src="assets/images/banner-shape3.png" alt="image" /> </span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="home-wave-bottom">
|
||||
<svg className="waves" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto">
|
||||
<defs>
|
||||
<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
|
||||
</defs>
|
||||
<g className="parallax">
|
||||
<use xlinkHref="#gentle-wave" x="48" y="0" fill="rgba(255,255,255,0.7" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.5)" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.3)" />
|
||||
<use xlinkHref="#gentle-wave" x="48" y="7" fill="#f6f4fe" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</section>
|
||||
<Trusted />
|
||||
<Features />
|
||||
<AboutApp />
|
||||
<Design />
|
||||
<Work />
|
||||
<Testimonial />
|
||||
<Pricing/>
|
||||
<Faq/>
|
||||
<Interface/>
|
||||
<Download />
|
||||
<Story/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Main
|
||||
+87
-105
@@ -1,114 +1,96 @@
|
||||
import React , { useEffect, useState } from 'react'
|
||||
import { Route, Routes , useLocation} from 'react-router-dom'
|
||||
import Navbar from '../component/Navbar/Main'
|
||||
import Footer from '../component/Footer/Main'
|
||||
import Home from '../component/Home/Main'
|
||||
import AboutUs from '../component/AboutUs/Main'
|
||||
import Review from '../component/Pages/Review/Main'
|
||||
import Contact from '../component/Contact/Main'
|
||||
import Faq from '../component/Pages/Faq/Main'
|
||||
import SignIn from '../component/Pages/SignIn/Main'
|
||||
import SignUp from '../component/Pages/SignUp/Main'
|
||||
import Pricing from '../component/Pricing/Main'
|
||||
import Blog from '../component/Blog/Blog/Main'
|
||||
import BlogSingle from '../component/Blog/BlogSingle/Main'
|
||||
import HomeDark from '../component/HomeDark/Main'
|
||||
import HomeWave from '../component/HomeWave/Main'
|
||||
//import HomeGredient from '../component/HomeGredient/Main'
|
||||
import HomeVideo from '../component/HomeVideo/Main'
|
||||
import HomeVideoTwo from '../component/HomeVideoTwo/Main'
|
||||
|
||||
|
||||
import Terms from '../component/Terms/Main'
|
||||
import Privacy from '../component/Privacy/Main'
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { Route, Routes, useLocation } from "react-router-dom";
|
||||
import Navbar from "../component/Navbar/Main";
|
||||
import Footer from "../component/Footer/Main";
|
||||
import Home from "../component/Home/Main";
|
||||
import AboutUs from "../component/AboutUs/Main";
|
||||
import Review from "../component/Pages/Review/Main";
|
||||
import Contact from "../component/Contact/Main";
|
||||
import Faq from "../component/Pages/Faq/Main";
|
||||
import SignIn from "../component/Pages/SignIn/Main";
|
||||
import SignUp from "../component/Pages/SignUp/Main";
|
||||
import Pricing from "../component/Pricing/Main";
|
||||
import Blog from "../component/Blog/Blog/Main";
|
||||
import BlogSingle from "../component/Blog/BlogSingle/Main";
|
||||
|
||||
import Terms from "../component/Terms/Main";
|
||||
import Privacy from "../component/Privacy/Main";
|
||||
|
||||
const Routing = () => {
|
||||
const [homepage, sethomepage] = useState(false);
|
||||
const location = useLocation();
|
||||
|
||||
const [homepage, sethomepage] = useState(false)
|
||||
const location = useLocation();
|
||||
useEffect(() => {
|
||||
if (location.pathname === "/sign-in" || location.pathname === "/sign-up") {
|
||||
sethomepage(false);
|
||||
} else {
|
||||
sethomepage(true);
|
||||
}
|
||||
}, [location]);
|
||||
|
||||
useEffect(() => {
|
||||
if (location.pathname === "/sign-in" || location.pathname === "/sign-up" ){
|
||||
sethomepage(false)
|
||||
}else{
|
||||
sethomepage(true)
|
||||
}
|
||||
}, [location])
|
||||
const [footerpage, setfooterpage] = useState(false);
|
||||
useEffect(() => {
|
||||
if (location.pathname === "/sign-in" || location.pathname === "/sign-up") {
|
||||
setfooterpage(false);
|
||||
} else {
|
||||
setfooterpage(true);
|
||||
}
|
||||
}, [location]);
|
||||
|
||||
const [footerpage, setfooterpage] = useState(false)
|
||||
useEffect(() => {
|
||||
if (location.pathname === "/sign-in" || location.pathname === "/sign-up" ){
|
||||
setfooterpage(false)
|
||||
}else{
|
||||
setfooterpage(true)
|
||||
}
|
||||
}, [location])
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem("navbar") === "darkhome") {
|
||||
setfooter({ f2: true });
|
||||
setnavbar({ n3: true });
|
||||
setbrdcum({ b2: true });
|
||||
} else if (localStorage.getItem("navbar") === "home") {
|
||||
setfooter({ f1: true });
|
||||
setnavbar({ n2: true });
|
||||
setbrdcum({ b1: true });
|
||||
} else {
|
||||
setfooter({ f1: true });
|
||||
setnavbar({ n2: true });
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
if (localStorage.getItem("navbar") === "darkhome") {
|
||||
setfooter({f2 : true})
|
||||
setnavbar({n3 : true})
|
||||
setbrdcum({b2 : true})
|
||||
}
|
||||
else if (localStorage.getItem("navbar") === "home"){
|
||||
setfooter({f1 : true})
|
||||
setnavbar({n2 : true})
|
||||
setbrdcum({b1 : true})
|
||||
}
|
||||
else if (localStorage.getItem("navbar") === "homewave"){
|
||||
setfooter({f5 : true})
|
||||
setbrdcum({b1 : true})
|
||||
setnavbar({n4 : true})
|
||||
}
|
||||
else if (localStorage.getItem("navbar") === "homevideo"){
|
||||
setfooter({f1 : true})
|
||||
setnavbar({n6 : true})
|
||||
setbrdcum({b3 : true})
|
||||
}
|
||||
else if (localStorage.getItem("navbar") === "homevideotwo"){
|
||||
setfooter({f4 : true})
|
||||
setnavbar({n4 : true})
|
||||
setbrdcum({b4 : true})
|
||||
} else {
|
||||
setfooter({f1 : true})
|
||||
setnavbar({n2 : true})
|
||||
}
|
||||
}, [])
|
||||
|
||||
const [footer, setfooter] = useState({ f1: true });
|
||||
const [navbar, setnavbar] = useState({ n1: true });
|
||||
const [brdcum, setbrdcum] = useState({ n1: true });
|
||||
|
||||
const [footer , setfooter] = useState({f1 : true})
|
||||
const [navbar , setnavbar] = useState({n1 : true})
|
||||
const [brdcum , setbrdcum] = useState({n1 : true})
|
||||
|
||||
return (
|
||||
<>
|
||||
{homepage && <Navbar navbar = {navbar}/>}
|
||||
<Routes>
|
||||
<Route path="/" element={<Home setfooter = {setfooter} setnavbar = {setnavbar} setbrdcum = {setbrdcum}/>} />
|
||||
<Route path="/about" element={< AboutUs setnavbar = {setnavbar} brdcum = {brdcum}/>} />
|
||||
<Route path="/review" element={< Review setnavbar = {setnavbar} brdcum = {brdcum} />} />
|
||||
<Route path="/contact" element={< Contact brdcum = {brdcum}/>} />
|
||||
<Route path="/faq" element={< Faq brdcum = {brdcum} />} />
|
||||
<Route path="/sign-in" element={< SignIn />} />
|
||||
<Route path="/sign-up" element={< SignUp />} />
|
||||
<Route path="/pricing" element={< Pricing brdcum = {brdcum}/>} />
|
||||
<Route path="/blog" element={< Blog brdcum = {brdcum}/>} />
|
||||
<Route path="/blog-single" element={< BlogSingle brdcum = {brdcum}/>} />
|
||||
|
||||
<Route path="/home-dark" element={< HomeDark setfooter = {setfooter} setnavbar = {setnavbar} setbrdcum = {setbrdcum}/>} />
|
||||
<Route path="/home-wave" element={< HomeWave setfooter = {setfooter} setnavbar = {setnavbar} setbrdcum = {setbrdcum}/>} />
|
||||
<Route path="/home-video" element={< HomeVideo setfooter = {setfooter} setnavbar = {setnavbar} setbrdcum = {setbrdcum}/>} />
|
||||
<Route path="/home-video2" element={< HomeVideoTwo setfooter = {setfooter} setnavbar = {setnavbar} setbrdcum = {setbrdcum}/>} />
|
||||
return (
|
||||
<>
|
||||
{homepage && <Navbar navbar={navbar} />}
|
||||
<Routes>
|
||||
<Route
|
||||
path="/"
|
||||
element={
|
||||
<Home
|
||||
setfooter={setfooter}
|
||||
setnavbar={setnavbar}
|
||||
setbrdcum={setbrdcum}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
<Route
|
||||
path="/about"
|
||||
element={<AboutUs setnavbar={setnavbar} brdcum={brdcum} />}
|
||||
/>
|
||||
<Route
|
||||
path="/review"
|
||||
element={<Review setnavbar={setnavbar} brdcum={brdcum} />}
|
||||
/>
|
||||
<Route path="/contact" element={<Contact brdcum={brdcum} />} />
|
||||
<Route path="/faq" element={<Faq brdcum={brdcum} />} />
|
||||
<Route path="/sign-in" element={<SignIn />} />
|
||||
<Route path="/sign-up" element={<SignUp />} />
|
||||
<Route path="/pricing" element={<Pricing brdcum={brdcum} />} />
|
||||
<Route path="/blog" element={<Blog brdcum={brdcum} />} />
|
||||
<Route path="/blog-single" element={<BlogSingle brdcum={brdcum} />} />
|
||||
<Route path="/terms" element={<Terms brdcum={brdcum} />} />
|
||||
<Route path="/privacy" element={<Privacy brdcum={brdcum} />} />
|
||||
</Routes>
|
||||
{footerpage && <Footer footer={footer} />}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
<Route path="/terms" element={< Terms brdcum = {brdcum} />} />
|
||||
<Route path="/privacy" element={< Privacy brdcum = {brdcum} />} />
|
||||
|
||||
</Routes>
|
||||
{footerpage && <Footer footer = {footer}/>}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Routing
|
||||
export default Routing;
|
||||
|
||||
Reference in New Issue
Block a user