feat: home page update

This commit is contained in:
2025-07-04 16:45:27 +05:30
parent 6970d1af0c
commit 4b3e89673b
5 changed files with 36 additions and 16 deletions

View File

@@ -6,7 +6,7 @@ import { IconBook, IconBuildingBank, IconCurrencyRupee, IconEye, IconHome, IconL
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { Providers } from "../providers";
import myImage from '@/app/image/ebanking.jpg';
import logo from '@/app/image/logo.jpg';
import NextImage from 'next/image';
export default function Home() {
@@ -50,11 +50,16 @@ export default function Home() {
style={{
backgroundColor: "#e6ffff", width: "100%", height: '100vh',
}}>
<Box style={{ position: 'relative', width: '100%', height: '11%' }}>
<Box style={{
position: 'relative', width: '100%', height: '11%',
display: "flex",
justifyContent: "flex-start",
background: "linear-gradient(15deg,rgba(2, 163, 85, 1) 55%, rgba(101, 101, 184, 1) 100%)",
}}>
<Image
// radius="md"
fit="cover"
src={myImage}
src={logo}
component={NextImage}
alt="ebanking"
style={{ width: "100%", height: "100%" }}
@@ -109,9 +114,9 @@ export default function Home() {
<Switch size="md" onLabel="ON" offLabel="OFF" checked={showBalance}
onChange={(event) => setShowBalance(event.currentTarget.checked)} />
</Group>
<div style={{ flex: 1, display: "flex", alignItems: "center", justifyContent: "flex-start", marginLeft: '20px'}}>
<div style={{ flex: 1, display: "flex", alignItems: "center", justifyContent: "flex-start", marginLeft: '20px' }}>
<Group grow gap="xl">
<Paper p="md" radius="md" style={{ backgroundColor: '#c1e0f0', width: 350}}>
<Paper p="md" radius="md" style={{ backgroundColor: '#c1e0f0', width: 350 }}>
<Group gap='xs'>
<IconBuildingBank size={25} />
@@ -142,7 +147,7 @@ export default function Home() {
</Title>
<Button fullWidth mt="xs">Get Statement</Button>
</Paper>
<Paper p="md" radius="md" style={{ backgroundColor: '#c1e0f0', width: 350}}>
<Paper p="md" radius="md" style={{ backgroundColor: '#c1e0f0', width: 350 }}>
<Group gap='xs'>
<IconBuildingBank size={25} />
@@ -173,7 +178,7 @@ export default function Home() {
</Title>
<Button fullWidth mt="xs">Get Statement</Button>
</Paper>
<Paper p="md" radius="md" style={{ width: 300,backgroundColor: '#FFFFFF', marginLeft: '130px', border: '1px solid grey' }}>
<Paper p="md" radius="md" style={{ width: 300, backgroundColor: '#FFFFFF', marginLeft: '130px', border: '1px solid grey' }}>
<Title order={5} mb="sm">Important Links</Title>
{/* <Title order={5} mb="sm" style={{ textAlign: 'center' }}>Loan EMI Calculator</Title> */}
<Stack gap="xs">

BIN
src/app/image/logo.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

BIN
src/app/image/logo1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View File

@@ -9,7 +9,7 @@ import vision from '@/app/image/vision.jpg';
export default function CustomCarousel() {
const scrollRef = useRef<HTMLDivElement>(null);
const images = [DICGC, objective, vision];
const images = [DICGC,vision,objective];
const [currentIndex, setCurrentIndex] = useState(0);
const scrollToIndex = (index: number) => {
@@ -40,7 +40,7 @@ export default function CustomCarousel() {
}, [currentIndex]);
return (
<Box style={{ position: 'relative', width: '100%', overflow: 'hidden' }}>
<Box style={{ position: 'relative', width: '60%', overflow: 'hidden',backgroundColor:"white" }}>
{/* Scrollable container */}
<Box
ref={scrollRef}
@@ -61,7 +61,7 @@ export default function CustomCarousel() {
minWidth: '100%',
maxWidth: '100%',
borderRadius: '8px',
backgroundColor: '#f2f2f2',
backgroundColor: 'white',
}}
>
<Image

View File

@@ -5,7 +5,7 @@ import { notifications } from "@mantine/notifications";
import { Providers } from "@/app/providers";
import { useRouter } from "next/navigation";
import NextImage from "next/image";
import myImage from '@/app/image/ebanking.jpg';
import logo from '@/app/image/logo.jpg';
import frontPage from '@/app/image/ib_front_page.jpg';
import dynamic from 'next/dynamic';
@@ -86,20 +86,26 @@ export default function Login() {
return (
<Providers>
<div style={{ backgroundColor: "#f8f9fa", width: "100%", height: "auto", paddingTop: "5%" }}>
<Box style={{ position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100 }}>
<Box style={{
position: 'fixed', width: '100%', height: '12%', top: 0, left: 0, zIndex: 100,
display: "flex",
justifyContent: "flex-start",
background: "linear-gradient(15deg,rgba(2, 163, 85, 1) 55%, rgba(101, 101, 184, 1) 100%)",
// border: "1px solid black"
}}>
<Image
fit="cover"
src={myImage}
src={logo}
component={NextImage}
alt="ebanking"
style={{ width: "100%", height: "100%" }}
style={{ width: "40%", height: "100%", objectFit: "contain", marginLeft: 0 }}
/>
<Text
style={{
position: 'absolute',
top: '50%',
left: '64%',
color: 'black',
color: 'white',
textShadow: '1px 1px 2px blue',
}}
>
@@ -271,9 +277,18 @@ export default function Login() {
height: '50vh',
textAlign: "left",
marginTop: 10,
// border: "1px solid blue"
display: "flex",
border: "1px solid blue"
}}>
<ClientCarousel />
<Box style={{ width: "40%", border: "1px solid black", textAlign: "center" }}>
<Title order={2}>Security Notes :</Title>
<br></br>
<Text size="lg">When you Login,Your User Id and Password travels in an encrypted and highly secured mode .</Text>
<br></br>
<Text size="lg" fs="italic">For more information on Products and Services, Please Visit</Text>
<Text c="blue" td="underline">http://www.kccb.in/</Text>
</Box>
</Box>
<Box
component="footer"