diff --git a/src/app/SetPassword/page.tsx b/src/app/SetPassword/page.tsx
index a7859fd..a3ca3f3 100644
--- a/src/app/SetPassword/page.tsx
+++ b/src/app/SetPassword/page.tsx
@@ -1,13 +1,13 @@
"use client";
import React, { useState, useEffect } from "react";
-import { Text, Button, TextInput, PasswordInput, Title, Card, Box, Image, Group } from "@mantine/core";
+import { Text, Button, TextInput, PasswordInput, Title, Card, Box, Image, Group, Grid, Container, Stack } from "@mantine/core";
import { notifications } from "@mantine/notifications";
import { Providers } from "@/app/providers";
import { useRouter } from "next/navigation";
import NextImage from "next/image";
import logo from '@/app/image/logo1.jpg';
-import changePwdImage from '@/app/image/set_log_pass.jpg';
-import { IconLock, IconLogout, IconRefresh } from '@tabler/icons-react';
+import changePwdImage from '@/app/image/forget_password.jpg';
+import { IconLock, IconLogout, IconPhone, IconRefresh } from '@tabler/icons-react';
import { generateCaptcha } from '@/app/captcha';
import { sendOtp, verifyOtp } from "../_util/otp";
//const [showOtpField, setShowOtpField] = useState(false);
@@ -25,7 +25,7 @@ export default function SetLoginPwd() {
const [countdown, setCountdown] = useState(60);
const [timerActive, setTimerActive] = useState(false);
const icon = ;
- const [generateOtp, setGenerateOtp] = useState("");
+ // const [generateOtp, setGenerateOtp] = useState("");
const [step, setStep] = useState<"form" | "otp" | "final">("form");
const [otpValidated, setOtpValidated] = useState(false);
@@ -165,7 +165,6 @@ export default function SetLoginPwd() {
});
return;
-
}
const token = localStorage.getItem("access_token");
@@ -235,59 +234,162 @@ export default function SetLoginPwd() {
}, []);
if (authorized) {
- return (
-
-
-
+
+ {/* Header */}
+
-
+
+
+ fontFamily: "Roboto",
+ color: "white",
+ marginBottom: 2,
+ fontSize: "clamp(0.9rem, 2.5vw, 1.25rem)",
+ lineHeight: 1.3
+ }}>
THE KANGRA CENTRAL CO-OPERATIVE BANK LTD.
- } variant="subtle" onClick={handleLogout}>Logout
+
+ Head Office: Dharmshala, District Kangra (H.P), Pin: 176215
+
-
-
-
-
-
- Set Login Password
-
+
+ {/* Main Content */}
+
+
+
+ {/* Image Column */}
+
+
+
+
+ Welcome to KCCB Internet Banking
+
+
+ Secure your account with a strong password
+
+
+
+
+
+ {/* Form Column */}
+
+
+ {/* Decorative top bar */}
+
+
+
+
+
+ Set Login Password
+
+
+ Create a strong password to secure your account
+
+
+
+
e.preventDefault()}
onCut={(e) => e.preventDefault()}
readOnly={captchaValidate}
+ styles={{
+ input: {
+ borderRadius: "8px",
+ border: "2px solid #e9ecef"
+ }
+ }}
/>
+
setConfirmPassword(e.currentTarget.value)}
onCopy={(e) => e.preventDefault()}
onPaste={(e) => e.preventDefault()}
onCut={(e) => e.preventDefault()}
readOnly={captchaValidate}
- />
-
- e.preventDefault()}
- onContextMenu={(e) => e.preventDefault()}>
- {captcha}
-
-
-
-
- setCaptchaInput(e.currentTarget.value)}
- withAsterisk
- readOnly={captchaValidate}
/>
-
- {captchaValidate && (
+
+ {/* CAPTCHA Section */}
+
+ Verification Code
+
+ e.preventDefault()}
+ onContextMenu={(e) => e.preventDefault()}
+ >
+ {captcha}
+
+ }
+ >
+ Refresh
+
+
+ setCaptchaInput(e.currentTarget.value)}
+ withAsterisk
+ size="md"
+ readOnly={captchaValidate}
+ styles={{
+ input: {
+ borderRadius: "8px"
+ }
+ }}
+ />
+
+
+ {/* OTP Section */}
+ {captchaValidate && (
+
}
value={otp}
maxLength={6}
onChange={(e) => setOtp(e.currentTarget.value)}
withAsterisk
+ size="md"
style={{ flex: 1 }}
+ styles={{
+ input: {
+ borderRadius: "8px",
+ letterSpacing: "4px"
+ }
+ }}
/>
{timerActive ? (
-
- Resend OTP will be enabled in 00:{countdown < 10 ? `0${countdown}` : countdown} min
+
+ Resend in 00:{countdown < 10 ? `0${countdown}` : countdown}
) : (
}
+ style={{ marginBottom: "4px" }}
>
Resend
)}
- )}
-
+
+ )}
+
-
-
-
- Note: Password must contain at least one capital letter(A-Z), one digit(0-9), one special symbol(e.g.,@,#,$), and be 8-15 characters long.
-
-
+
+ {/* Note Box */}
+
+
+ Password Requirements:
+
+
+ • Minimum 8 characters, maximum 15 characters
+ • At least 1 uppercase letter (A-Z)
+ • At least 1 number (0-9)
+ • At least 1 special character (e.g., @, #, $)
+
+
+
-
-
-
-
- © 2025 The Kangra Central Co-Operative Bank Ltd.
-
-
-
-
+
+ {/* Header */}
+
-
+
+
+ fontFamily: "Roboto",
+ color: "white",
+ marginBottom: 2,
+ fontSize: "clamp(0.9rem, 2.5vw, 1.25rem)",
+ lineHeight: 1.3
+ }}>
THE KANGRA CENTRAL CO-OPERATIVE BANK LTD.
- } variant="subtle" onClick={handleLogout}>Logout
-
+
+ Head Office: Dharmshala, District Kangra (H.P), Pin: 176215
+
-
-
-
-
-
- router.push("/login")}
- style={{
- position: 'absolute', top: '1rem', right: '2rem', cursor: 'pointer', fontWeight: 500, color: '#7091ecff', textDecoration: 'underline'
- }}> Skip now
+ }
+ variant="subtle"
+ onClick={handleLogout}
+ visibleFrom="md"
+ >
+ Logout
+
+
- Set Transaction Password
-
-
-
-
- Note: Password must contain at least one capital letter(A-Z), one digit(0-9), one special symbol(e.g.,@,#,$), and be 8-15 characters long.
-
-
+ {/* Note Box */}
+
+
+ Password Requirements:
+
+
+ • Minimum 8 characters, maximum 15 characters
+ • At least 1 uppercase letter (A-Z)
+ • At least 1 number (0-9)
+ • At least 1 special character (e.g., @, #, $)
+
+
+
-
-
-
-
- © 2025 Kangra Central Co-Operative Bank
-
-
-