login with google width fixed

Priyaaa1 · Jul 30, 2024 · e0a7c58 · e0a7c58
1 parent af200e2
commit e0a7c58
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 6 deletions.
diff --git a/src/Components/Login/Login.css b/src/Components/Login/Login.css
@@ -102,4 +102,9 @@ p a:hover {
 .eye:hover {
   color: #007efc;
   cursor: pointer;
-}
+}
+.google-login-wrapper {
+  width: 100%; 
+  display: flex;
+  justify-content: center;
+}
diff --git a/src/Components/Login/Login.jsx b/src/Components/Login/Login.jsx
@@ -63,6 +63,7 @@ const Login = () => {
         <div className="login-container">
           <h2>Login</h2>
           <div className="input">
+            <label>Email</label>
             <input
               type="email"
               placeholder="Email"
@@ -78,7 +79,7 @@ const Login = () => {
               }}
             />
             {warnings.email && <p style={{ color: "red" }} className="warningmsg">{warnings.email}</p>}
-
+            <label>Password</label>
             <input
               type={ isVisible ? "text" : "password"}
               className="pasword"
@@ -105,10 +106,13 @@ const Login = () => {
           <p>
             Don't have an account? <NavLink to="/signup">Sign up</NavLink>
           </p>
-          <GoogleLogin
-            onSuccess={handleGoogleLoginSuccess}
-            onError={handleGoogleLoginFailure}
-          />
+          <div className="google-login-wrapper">
+            <GoogleLogin
+              onSuccess={handleGoogleLoginSuccess}
+              onError={handleGoogleLoginFailure}
+            />
+          </div>
+
         </div>
       </div>
     </GoogleOAuthProvider>