From 0eee9a752ea2423010d7c7daddd54bf16eb3d03d Mon Sep 17 00:00:00 2001
From: Kartik Sharma <kartik.sharma@marcoaiot.com>
Date: Wed, 10 Sep 2025 12:21:01 +0530
Subject: [PATCH] =?UTF-8?q?Password=20Field=20UI=20Not=20Proper=20?=
 =?UTF-8?q?=E2=80=93=20White=20Background=20Not=20Covering=20Full=20Field?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/authentication/LoginPage.jsx | 34 +++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/src/pages/authentication/LoginPage.jsx b/src/pages/authentication/LoginPage.jsx
index 9240e33d..11777078 100644
--- a/src/pages/authentication/LoginPage.jsx
+++ b/src/pages/authentication/LoginPage.jsx
@@ -106,7 +106,7 @@ const LoginPage = () => {
           {/* Password */}
           {!IsLoginWithOTP && (
             <>
-              <div className="mb-3 text-start">
+              {/* <div className="mb-3 text-start">
                 <label htmlFor="password" className="form-label">
                   Password
                 </label>
@@ -135,6 +135,38 @@ const LoginPage = () => {
                     {errors.password.message}
                   </div>
                 )}
+              </div> */}
+
+               <div className="mb-3 form-password-toggle text-start">
+                <label htmlFor="password" className="form-label">
+                  Password
+                </label>
+
+                <div className="input-group input-group-merge">
+                  <input
+                    type={hidepass ? "password" : "text"}
+                    autoComplete="new-password"
+                    id="password"
+                    className="form-control form-control-xl shadow-none"
+                    name="password"
+                    {...register("password")}
+                    placeholder="••••••••••••"
+                    aria-describedby="password"
+                  />
+                  <span className="input-group-text cursor-pointer border-start-0">
+                    <button
+                      type="button"
+                      className="btn btn-link p-0"
+                      onClick={() => setHidepass(!hidepass)}
+                    >
+                      {hidepass ? (
+                        <i className="bx bx-hide fs-5" />
+                      ) : (
+                        <i className="bx bx-show fs-5" />
+                      )}
+                    </button>
+                  </span>
+                </div>
               </div>
 
               {/* Remember Me + Forgot Password */}