tomosa.sarkar/IB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat : update login page

Browse Source
This commit is contained in:
Tomosa Sarkar
2025-06-26 18:26:46 +05:30
parent a86cb87da0
commit 49dae3624f
1 changed files with 31 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/app/login/page.tsx
View File

@@ -1,6 +1,6 @@
"use client" "use client"
import React from "react"; import React, { useState } from "react";
import { Text, Button, Paper, TextInput, MantineProvider, Image, Box, Anchor, PasswordInput, Title, Checkbox, Card, Group, Flex, Stack } from "@mantine/core"; import { Text, Button, Paper, TextInput, MantineProvider, Image, Box, Anchor, PasswordInput, Title, Checkbox, Card, Group, Flex, Stack } from "@mantine/core";
import myImage from '@/app/image/ebanking.jpg'; import myImage from '@/app/image/ebanking.jpg';
import bgImage from '@/app/image/media.jpg'; import bgImage from '@/app/image/media.jpg';
@@ -8,7 +8,13 @@ import frontPage from '@/app/image/ib_front_page.jpg'
import NextImage from 'next/image'; import NextImage from 'next/image';
import { Providers } from "@/app/providers"; import { Providers } from "@/app/providers";
export default function Demo() { export default function Login() {
const [CIF, SetCIF] = useState('');
const [psw, SetPsw] = useState('');
async function handleLogin() {
}
return ( return (
<Providers> <Providers>
<div <div
@@ -68,8 +74,10 @@ export default function Demo() {
/> />
</div> </div>
<div style={{ flex: 1, backgroundColor: "#c1e0f0", display: "flex", justifyContent: 'center', alignItems: 'center' }}> <div style={{ flex: 1, backgroundColor: "#c1e0f0", display: "flex", justifyContent: 'center', alignItems: 'center' }}>
<Card shadow="lg" padding="xl" radius="md" style={{ width: 480, height: 400, backgroundColor: '#f0f0f0', <Card shadow="lg" padding="xl" radius="md" style={{
borderRadius: "12px", boxShadow: "0 2px 10px rgba(0,0,0,0.1)", }}> width: 480, height: 400, backgroundColor: '#f0f0f0',
borderRadius: "12px", boxShadow: "0 2px 10px rgba(0,0,0,0.1)",
}}>
<Title order={5} style={{ marginLeft: 10 }}>Welcome To KCC Bank</Title> <Title order={5} style={{ marginLeft: 10 }}>Welcome To KCC Bank</Title>
<Title order={1} style={{ marginLeft: 10, color: "#000066" }}>Internet Banking</Title> <Title order={1} style={{ marginLeft: 10, color: "#000066" }}>Internet Banking</Title>
<br></br> <br></br>
@@ -77,18 +85,33 @@ export default function Demo() {
<Flex justify="center" gap="md" > <Flex justify="center" gap="md" >
<form> <form>
<TextInput <TextInput
label="CIF Number" label="User ID"
placeholder="Enter your CIF no" placeholder="Enter your CIF no"
type="numeric"
maxLength={11}
inputMode="numeric"
pattern="\d*"
value={CIF}
onInput={(e) => {
const input =e.currentTarget.value.replace(/\D/g,'');
if(input.length<=11)
{
SetCIF(input);
}
}}
style={{ flex: 1 }} style={{ flex: 1 }}
required
/> />
<br></br> <br></br>
<TextInput <PasswordInput
label="Password" label="Password"
placeholder="Enter your password" placeholder="Enter your password"
style={{ flex: 1 }} style={{ flex: 1 }}
required
/> />
{/* <br></br> */} {/* <br></br> */}
<Button fullWidth variant="filled" mt="md" style={{width:100,align:"center",marginLeft:40}}>Login</Button> <Button fullWidth variant="filled" mt="md" style={{ width: 100, align: "center", marginLeft: 40 }}>Login</Button>
</form> </form>
</Flex> </Flex>
</Box> </Box>