Correction in Login Password text box design.

src/pages/authentication/LoginPage.jsx

@@ -19,13 +19,13 @@ const LoginPage = () => {
 
   const loginSchema = IsLoginWithOTP
     ? z.object({
-        username: z.string().email({ message: "Valid email required" }),
+      username: z.string().email({ message: "Valid email required" }),
-      })
+    })
     : z.object({
-        username: z.string().email({ message: "Valid email required" }),
+      username: z.string().email({ message: "Valid email required" }),
-        password: z.string().min(1, { message: "Password required" }),
+      password: z.string().min(1, { message: "Password required" }),
-        rememberMe: z.boolean(),
+      rememberMe: z.boolean(),
-      });
+    });
 
   const {
     register,
@@ -114,18 +114,18 @@ const LoginPage = () => {
               <label className="form-label" htmlFor="password">
                 Password
               </label>
-              <div className="input-group input-group-merge">
+              <div className="input-group input-group-merge d-flex align-items-center border rounded px-2">
                 <input
                   type={hidepass ? "password" : "text"}
                   autoComplete="true"
                   id="password"
                   {...register("password")}
-                  className="form-control"
+                  className="form-control form-control-xl border-0 shadow-none"
                   placeholder="••••••••••••"
                 />
                 <button
                   type="button"
-                  className="btn border-top border-end border-bottom"
+                  className="btn btn-link p-0 ms-2 "
                   onClick={() => setHidepass(!hidepass)}
                   style={{
                     borderTopLeftRadius: 0,
@@ -150,6 +150,7 @@ const LoginPage = () => {
               )}
             </div>
 
+
             <div className="mb-3 d-flex justify-content-between">
               <div className="form-check d-flex">
                 <input