69 lines
1.6 KiB
TypeScript
69 lines
1.6 KiB
TypeScript
|
|
||
|
|
import React from 'react'
|
||
|
|
import styles from './dashboard.module.css'
|
||
|
|
import Bank from './Bank'
|
||
|
|
import Graph from './Graph'
|
||
|
|
import { AiOutlineBank } from 'react-icons/ai';
|
||
|
|
import { BiRupee } from 'react-icons/bi';
|
||
|
|
|
||
|
|
|
||
|
|
export default function Dashboard() {
|
||
|
|
return (
|
||
|
|
<div className={styles.main}>
|
||
|
|
<div className={styles.banks}>
|
||
|
|
<div
|
||
|
|
className={styles.title}
|
||
|
|
>
|
||
|
|
<AiOutlineBank
|
||
|
|
className={styles.banksLogo}
|
||
|
|
size={25}
|
||
|
|
/>
|
||
|
|
Banks
|
||
|
|
</div>
|
||
|
|
<Bank
|
||
|
|
bankLogoSrc="/sbi.svg"
|
||
|
|
bankName="SBI"
|
||
|
|
bankBalance="27,932"
|
||
|
|
/>
|
||
|
|
<Bank
|
||
|
|
bankLogoSrc="/icici.svg"
|
||
|
|
bankName="ICICI"
|
||
|
|
bankBalance="7,932"
|
||
|
|
/>
|
||
|
|
<Bank
|
||
|
|
bankLogoSrc="/hdfc.svg"
|
||
|
|
bankName="HDFC"
|
||
|
|
bankBalance="2,58,630"
|
||
|
|
/>
|
||
|
|
<Bank
|
||
|
|
bankLogoSrc="/axis.svg"
|
||
|
|
bankName="Axis"
|
||
|
|
bankBalance="55,410"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div className={styles.totalBalance}>
|
||
|
|
<div
|
||
|
|
className={styles.title}
|
||
|
|
>
|
||
|
|
<div className={styles.rupeeHolder}>
|
||
|
|
<BiRupee
|
||
|
|
className={styles.rupeeLogo}
|
||
|
|
size={20}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
Total Balance
|
||
|
|
</div>
|
||
|
|
<div className={styles.totalBalanceAmountHolder}>
|
||
|
|
<div>₹</div>
|
||
|
|
<div className={styles.amount}>3,49,904</div>
|
||
|
|
</div>
|
||
|
|
<div className={styles.message}>
|
||
|
|
↑20% compared to previous month
|
||
|
|
</div>
|
||
|
|
<Graph />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|