Added maintenance page

Author: lakshya-20

src/Components/Screens/Maintenance.js

@@ -0,0 +1,27 @@
+import React from 'react';
+
+const Maintenance = () => {
+    return (
+        <div className="container text-center">
+            <div className="m-top-wrapper">
+                <h2 className="">
+                    We'll Be Back Soon
+                </h2>
+                <span>
+                    V Transfer is down for maintenance and expect
+                    <br/>
+                    to back online in a few days.
+                </span>
+            </div>
+            <div className="m-middle-wrapper">
+                <img 
+                    src="https://res.cloudinary.com/code-gambit/image/upload/v1630442215/Web%20App/Software-maintenance-services_bwekc3.png"
+                    alt="Maintenance"
+                    className="maintenance-image"
+                />
+            </div>
+        </div>
+    );
+};
+
+export default Maintenance;

src/Routing.js

@@ -5,6 +5,7 @@ import { AuthContext } from "./Context/Contexts/AuthContext";
 import Download from "./Components/Screens/Download";
 import Authenticate from "./Components/Screens/Authentication";
 import { Loading } from "./Components/Loading";
+import Maintenance from "./Components/Screens/Maintenance";
 
 const HomePage = lazy(() => import("./Components/Screens/Homepage"));
 const Dashboard = lazy(() => import("./Components/Screens/Dashboard"));
@@ -30,6 +31,7 @@ const Routing = () => {
       history.push("/dashboard");
     }
   }
+  history.push("/maintenance");
   return (
     <ErrorBoundary>
       <Suspense fallback={<Loading />}>
@@ -41,6 +43,7 @@ const Routing = () => {
             <Route exact path="/profile" component={Profile} />
             <Route exact path="/about" component={About} />
             <Route exact path="/:urlId" component={Download} />
+            <Route exact path="/maintenance" component={Maintenance} />
             <Route>
               <Redirect to="/dashboard" /> <HomePage />
             </Route>
@@ -49,7 +52,8 @@ const Routing = () => {
           <Switch>
             <Route exact path="/about" component={About} />
             <Route exact path="/authenticate" component={Authenticate} />
-            <Route exact path="/:urlId" component={Download} />
+            <Route exact path="/maintenance" component={Maintenance} />
+            <Route exact path="/:urlId" component={Download} />            
             <Route exact path="/" component={HomePage} />
           </Switch>
         )}

src/index.css

@@ -125,6 +125,13 @@ a{
 .top-wrapper h1{
   max-width: 80%;
 }
+
+.maintenance-image{
+  width: 800px;
+  max-width: 80%;
+  max-height: 100%;
+}
+
 @media screen and (max-width: 680px) {
   .url-card-wrapper:hover{
     transform: none;