diff --git a/React/src/pages/components/Main.js b/React/src/pages/components/Main.js
new file mode 100644
index 0000000..1e3d367
--- /dev/null
+++ b/React/src/pages/components/Main.js
@@ -0,0 +1,11 @@
+import React from 'react';
+
+const Main = ({ Component }) => {
+  return (
+    <div className="flex flex-col items-center justify-center h-3/4">
+      <Component />
+    </div>
+  );
+};
+
+export default Main;
diff --git a/React/src/pages/login.js b/React/src/pages/login.js
index 7ad840a..32f720c 100644
--- a/React/src/pages/login.js
+++ b/React/src/pages/login.js
@@ -1,28 +1,26 @@
-import React from 'react'
-import { signinRedirect } from '../services/userService'
-import { Redirect } from 'react-router-dom'
-import { useSelector } from 'react-redux'
-import Navbar from './components/Navbar'
-import VehicleRegisterForm from './components/VehicleRegisterForm'
+import React from 'react';
+import { signinRedirect } from '../services/userService';
+import { Redirect } from 'react-router-dom';
+import { useSelector } from 'react-redux';
+import Navbar from './components/Navbar';
+import Main from './components/Main';
+import VehicleRegisterForm from './components/VehicleRegisterForm';
 
 function Login() {
-  const user = useSelector(state => state.auth.user)
+  const user = useSelector((state) => state.auth.user);
 
   function login() {
-    signinRedirect()
+    signinRedirect();
   }
 
-  return (
-    (user) ?
-      (<Redirect to={'/'} />)
-      :
-      (
-        <div>
-          <Navbar />
-          <VehicleRegisterForm />
-         </div>
-      )
-  )
+  return user ? (
+    <Redirect to={'/'} />
+  ) : (
+    <div className="h-screen">
+      <Navbar />
+      <Main Component={VehicleRegisterForm} />
+    </div>
+  );
 }
 
-export default Login
+export default Login;