added app download route

src/App.js

@@ -1,7 +1,18 @@
 import Routes from './Routes';
+import { Redirect, useLocation } from 'react-router-dom';
 
 function App() {
-    return <Routes />;
+    const {pathname} = useLocation()
+
+    return (
+        <>
+        {pathname.startsWith('/@') ? 
+        <Redirect to='/app' />
+        :
+        <Routes />
+        }
+        </>
+    );
 }
 
 export default App;

src/Routes.js

@@ -16,6 +16,7 @@ import UseCases from './components/UseCases';
 import Privacy from './components/Service/Privacy';
 import Terms from './components/Service/Terms';
 import FAQ from './components/FAQ/Index';
+import AppDownload from './components/AppDownload/AppDownload';
 
 function Routes() {
   const [loading, setLoading] = useState(true);
@@ -35,27 +36,26 @@ function Routes() {
         </div>
       )}
       <div className={`appie-visible ${loading === false ? 'active' : ''}`}>
-        <Router>
-          <ScrollToTop>
-            <Switch>
-              {/*<Route exact path="/" component={HomeSix} />*/}
+        <ScrollToTop>
+          <Switch>
+            {/*<Route exact path="/" component={HomeSix} />*/}
 
-              <Route exact path="/" component={HomeOne} />
-              <Route exact path="/news" component={News} />
-              <Route exact path="/blog" component={News} />
-              <Route exact path="/use-cases" component={UseCases} />
-              <Route exact path="/news/single-news" component={SingleNews} />
-              <Route exact path="/service" component={Service} />
-              <Route exact path="/terms" component={Terms} />
-              <Route exact path="/privacy" component={Privacy} />
-              <Route exact path="/about-us" component={AboutUs} />
-              <Route exact path="/contact" component={Contact} />
-              <Route exact path="/faq" component={FAQ} />
-              <Route exact path="/error" component={Error} />
-              <Route component={Error} />
-            </Switch>
-          </ScrollToTop>
-        </Router>
+            <Route exact path="/" component={HomeOne} />
+            <Route exact path="/news" component={News} />
+            <Route exact path="/blog" component={News} />
+            <Route exact path="/use-cases" component={UseCases} />
+            <Route exact path="/news/single-news" component={SingleNews} />
+            <Route exact path="/service" component={Service} />
+            <Route exact path="/terms" component={Terms} />
+            <Route exact path="/privacy" component={Privacy} />
+            <Route exact path="/about-us" component={AboutUs} />
+            <Route exact path="/contact" component={Contact} />
+            <Route exact path="/faq" component={FAQ} />
+            <Route exact path="/error" component={Error} />
+            <Route exact path="/app" component={AppDownload} />
+            <Route component={Error} />
+          </Switch>
+        </ScrollToTop>
       </div>
     </>
   );

src/assets/css/main.css

@@ -5903,6 +5903,22 @@ blockquote cite {
 
 .appie-error-area {
   padding-top: 250px;
+  width: 100%;
+  min-height: 100vh;
+  background: url("../images/wrenchng-page-notfound.jpg") center/cover;
+  position: relative;
+  /* z-index: 1; */
+}
+
+.appie-error-area::before{
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: #cdcdcd;
+  opacity: 0.8;
 }
 
 .appie-error-content span {

src/components/AppDownload/AppDownload.js

@@ -0,0 +1,9 @@
+import React from 'react'
+
+export default function AppDownload() {
+  return (
+    <div>
+        <div className='vh-100 d-flex justify-content-center align-items-center'>App Download Content Here</div>
+    </div>
+  )
+}

src/index.js

@@ -1,5 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import { BrowserRouter as Router } from 'react-router-dom';
+
 import App from './App';
 import './assets/css/bootstrap.min.css';
 import './assets/css/custom-animated.css';
@@ -12,7 +14,9 @@ import './assets/css/style.css';
 
 ReactDOM.render(
     <React.StrictMode>
-        <App />
+        <Router>
+            <App />
+        </Router>
     </React.StrictMode>,
     document.getElementById('root')
 );