foldbank-mock/web/app/components/RecurringPayment.tsx
Ameya Shenoy b911b667cc
feat: components
Signed-off-by: Ameya Shenoy <shenoy.ameya@gmail.com>
2023-03-18 20:20:45 +05:30

29 lines
891 B
TypeScript

import React from 'react'
import styles from './recurringPayment.module.css'
import { BsTriangleFill, BsYoutube, BsCalendar2Date } from 'react-icons/bs'
import { RiHome7Fill } from 'react-icons/ri'
export default function RecurringPayment(props) {
return (
<div className={styles.recurringPayment}>
<div className={styles.recurringPaymentTop}>
<div className={styles.recurringPaymentTopLeft}>
<RiHome7Fill
className={styles.paymentIcon}
size={50}
/>
<div className={styles.paymentTitle}>{props.title}</div>
</div>
<BsCalendar2Date
className={styles.paymentIcon}
size={50}
/>
</div>
<div className={styles.recurringPaymentBottom}>
<div>Due in {props.due_in_days} days</div>
<div>{props.amount} · monthly</div>
</div>
</div>
)
}