updated 😜

This commit is contained in:
2024-09-05 16:10:43 +05:30
parent 7a0084794b
commit 4f10229aa7
5 changed files with 97 additions and 3 deletions

View File

@@ -1,6 +1,9 @@
import { Box } from "@chakra-ui/react";
import { Box, Button, HStack, Image, Text, VStack } from "@chakra-ui/react";
import React from "react";
import MiniHeader from "../Components/MiniHeader";
import logo_card from "../assets/logo_card.svg";
import TRANSCORP_LOGO from "../assets/TRANSCORP_LOGO.svg";
import RuPay from '../assets/rupayImg.png'
const Expenses = () => {
return (
@@ -9,6 +12,69 @@ const Expenses = () => {
title={"Manage Expenses"}
subTitle={"Lorem ipsum dolor sit amet, consectetur adipiscing elit."}
/>
<HStack justifyContent={"start"} w={"100%"} h={"500px"} gap={4}>
<VStack
// bg="linear-gradient(230deg, #6311CB, #481566, #851d70, #a71c71, #df2274)"
bg="linear-gradient(230deg, purple, #390A74, #390A74, #390A74, #390A74)"
alignItems={"start"}
justifyContent={"space-between"}
height={"100%"}
w={320}
rounded={"xl"}
p={4}
boxShadow={"md"}
position={"relative"}
>
<Box width={"100%"} display={"flex"} justifyContent={"space-between"}>
<Image w={28} src={logo_card} />
<Image w={28} src={TRANSCORP_LOGO} me={0.5} />
</Box>
<VStack
width={"100%"}
display={"flex"}
alignItems={"start"}
justifyContent={"space-between"}
>
<Text color={"#fff"}>1234 5678 1234 5678</Text>
<Button
size={"sm"}
rounded={"full"}
bg={"#ffffff30"}
fontSize={"sm"}
px={6}
border={"1px solid #fff"}
_hover={{ opacity: 0.8 }}
_active={{ opacity: 1 }}
color={"#fff"}
>
Tap to view details
</Button>
</VStack>
<Box width={"100%"} display={"flex"} justifyContent={"end"}>
{/* <Image w={32} src={logo_card} /> */}
<Image w={28} src={RuPay} me={0.5} />
</Box>
<Text
position={"absolute"}
top={28}
right={-6}
transform="rotate(270deg)"
fontSize={'sm'}
color={"#9E9E9E"}
>
Valid in india
</Text>
</VStack>
<VStack bg={"pink"} height={"100%"} w={"50%"} rounded={"xl"}></VStack>
<VStack bg={"purple"} height={"100%"} w={"27%"} rounded={"xl"}></VStack>
</HStack>
</Box>
);
};

View File

@@ -4,6 +4,7 @@ import {
Divider,
HStack,
Icon,
Radio,
Tag,
TagLabel,
Text,
@@ -51,8 +52,9 @@ const Report = () => {
// const extractedArray = reportsHistory.map((item)=>({ }))
const extractedArray = reportsHistory.map((item, index) => ({
Name: <Text as={'span'} display={'flex'} gap={2} alignItems={'center'}>
<Icon as={PiReceipt} boxSize={8} p={1.5} bg={index % 2 === 0 ? "#6311cb14" : "#fff"} rounded={'full'} />{item?.name}</Text>,
Name: <Radio colorScheme='purple' value='1'><Text as={'span'} display={'flex'} gap={2} alignItems={'center'}>
<Icon as={PiReceipt} boxSize={8} p={1.5} bg={index % 2 === 0 ? "#6311cb14" : "#fff"} rounded={'full'} />{item?.name}</Text></Radio>,
"Last Update":
item?.lastUpdated,
"Report type": item?.reportType,

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

13
src/assets/logo_card.svg Normal file
View File

@@ -0,0 +1,13 @@
<svg width="81" height="33" viewBox="0 0 81 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M32.9669 10.7619C31.5777 10.9704 30.5078 11.4171 29.5974 12.1617C28.628 12.954 27.9895 14.1036 27.7886 15.432C27.7472 15.694 27.7354 16.2004 27.7531 16.6531C27.8004 17.8861 28.0841 18.6962 28.7994 19.6493C29.7807 20.9598 31.3885 21.752 33.422 21.9307C35.6802 22.1213 37.7787 21.4303 39.0378 20.0841C40.0013 19.0596 40.3737 18.1065 40.4269 16.5637C40.4506 15.8906 40.4387 15.5868 40.356 15.1937C39.9895 13.3709 38.7245 11.9056 36.9156 11.2146C36.023 10.8691 35.4496 10.7738 34.2378 10.7559C33.6348 10.744 33.0674 10.75 32.9669 10.7619ZM35.6151 12.5668C37.1225 12.9659 38.1984 14.0679 38.4407 15.4558C38.5412 16.0455 38.4821 17.213 38.3225 17.6538C37.9796 18.6247 37.359 19.3336 36.4723 19.7684C35.7215 20.1318 35.2191 20.2271 34.0605 20.2211C33.1738 20.2152 33.0378 20.2033 32.5531 20.0544C31.093 19.6076 30.1708 18.6903 29.8339 17.3679C29.7275 16.9569 29.7156 15.9144 29.8102 15.3962C29.8398 15.2056 29.9876 14.8005 30.1294 14.5027C30.3422 14.0619 30.4664 13.8951 30.8329 13.5437C31.4654 12.9301 32.0861 12.6502 33.2329 12.4298C33.3156 12.4179 33.7826 12.4119 34.2674 12.4238C34.9294 12.4357 35.2723 12.4715 35.6151 12.5668Z" fill="white"/>
<path d="M61.3891 11.0891C61.058 11.2559 60.8984 11.518 60.8984 11.9112C60.8984 12.2686 60.9989 12.4949 61.2531 12.7094C61.7674 13.1501 62.7191 13.0489 63.0679 12.5187C63.2511 12.2507 63.2511 11.8099 63.0738 11.4942C62.8019 11.0117 61.9566 10.8032 61.3891 11.0891Z" fill="white"/>
<path d="M75.2916 11.3449C75.0434 11.4521 74.801 11.7559 74.7537 12.0061C74.6887 12.3695 74.7774 12.6375 75.0552 12.9115C75.6286 13.4596 76.6158 13.3762 76.9291 12.7447C77.1537 12.3159 76.9882 11.744 76.5567 11.4581C76.3498 11.3211 76.2315 11.2913 75.8887 11.2734C75.6227 11.2675 75.404 11.2913 75.2916 11.3449Z" fill="white"/>
<path d="M79.0327 11.3807C78.749 11.4641 78.5243 11.6726 78.4239 11.9466C78.1401 12.6912 78.8317 13.4238 79.7362 13.3285C80.6406 13.2332 80.9539 12.2444 80.2682 11.6368C79.949 11.3509 79.4583 11.2496 79.0327 11.3807Z" fill="white"/>
<path d="M65.0947 12.2561C65.0947 12.6433 65.1243 13.924 65.1538 15.1034C65.1834 16.2828 65.2248 18.2247 65.2425 19.422C65.2602 20.6193 65.2898 21.7094 65.3075 21.8464L65.3371 22.1025H66.2297H67.1223L67.0809 19.9462L67.0336 17.7958L70.2908 17.8375L73.5479 17.8852L73.5124 17.087C73.4888 16.6224 73.4415 16.2769 73.406 16.2531C73.3705 16.2292 72.7676 16.2054 72.0701 16.2054C71.3725 16.2054 69.942 16.1875 68.9016 16.1637L67.0041 16.128L66.9568 14.6984C66.9331 13.918 66.9391 13.2509 66.9686 13.2271C66.9923 13.2032 68.4819 13.2151 70.2671 13.2509C72.0582 13.2926 73.5361 13.3045 73.5597 13.2866C73.5834 13.2688 73.5893 12.9114 73.5656 12.5003L73.5302 11.7498L72.6375 11.7141C71.6385 11.6783 66.2652 11.5592 65.5558 11.5592H65.0947V12.2561Z" fill="white"/>
<path d="M54.6374 12.613C54.5015 13.036 54.33 13.5244 54.265 13.7091L54.1527 14.0367L53.2956 14.2392L52.4443 14.4358V14.8349V15.234L53.2778 15.2697C53.7389 15.2876 54.1231 15.3174 54.135 15.3293C54.1468 15.3412 54.1704 16.3002 54.1941 17.4618C54.2236 19.2428 54.2473 19.6419 54.3419 20.0351C54.5369 20.875 54.9685 21.4349 55.6896 21.8042C56.2039 22.0603 56.7241 22.1676 57.5221 22.1676C58.2433 22.1735 58.6571 22.114 59.3074 21.9293C59.9872 21.7327 59.9517 21.7863 59.9517 20.9762C59.9517 20.589 59.934 20.2614 59.9162 20.2376C59.8926 20.2197 59.8216 20.2376 59.7507 20.2853C59.4138 20.5056 58.9172 20.6248 58.1724 20.6546C57.2325 20.6963 56.8778 20.6069 56.4995 20.2376C56.0798 19.8325 56.0502 19.6658 56.0088 17.3188L55.9734 15.3055L57.8414 15.3471L59.7152 15.3888V14.7277C59.7152 14.3643 59.6916 14.0545 59.662 14.0367C59.6325 14.0128 58.7931 13.9831 57.8 13.9592L55.9911 13.9235L55.9793 13.0836C55.9734 12.619 55.9675 12.1603 55.9616 12.065L55.9556 11.8863L55.4295 11.8684L54.8975 11.8565L54.6374 12.613Z" fill="white"/>
<path d="M47.213 13.6203C47.148 13.6322 46.947 13.6739 46.7697 13.7097C45.8594 13.8943 44.8131 14.6389 44.2397 15.5026C44.1628 15.6277 44.0741 15.729 44.0564 15.729C44.0328 15.729 44.0209 15.2822 44.0209 14.7283V13.7335L43.0929 13.7156L42.1589 13.6978V15.175C42.1589 15.9911 42.1411 18.3619 42.1175 20.4467L42.082 24.2471H43.0338H43.9914V22.0133C43.9914 20.7862 44.0091 19.7795 44.0387 19.7795C44.0623 19.7855 44.1569 19.9106 44.2515 20.0595C44.6948 20.7624 45.617 21.5308 46.3382 21.8048C47.4554 22.2277 48.8091 22.1801 49.8081 21.6738C50.6948 21.227 51.3805 20.4169 51.7175 19.3924C51.8652 18.9516 51.8771 18.8384 51.883 17.933C51.883 17.1348 51.8593 16.8786 51.7707 16.5629C51.4514 15.455 50.7125 14.5317 49.7845 14.073C49.5066 13.936 49.1224 13.7812 48.9273 13.7275C48.5786 13.6382 47.4495 13.5608 47.213 13.6203ZM47.8337 15.0797C49.1106 15.2822 49.9322 16.2294 50.0505 17.647C50.1214 18.4631 49.8731 19.2375 49.3588 19.8093C48.549 20.7028 47.1658 20.8756 45.948 20.2263C45.2091 19.8332 44.6594 19.2315 44.1865 18.3082L43.9323 17.8079L44.2397 17.2063C44.8308 16.0387 45.7943 15.2584 46.8465 15.0797C47.2781 15.0082 47.3963 15.0082 47.8337 15.0797Z" fill="white"/>
<path d="M61.2103 15.7636C61.2339 16.7465 61.2694 18.5573 61.2871 19.7904L61.3285 22.042H62.2448H63.1551L63.1196 21.1008C63.1019 20.5886 63.0723 19.0934 63.0546 17.783C63.0369 16.4725 63.0073 15.0846 62.9896 14.7033L62.9541 14.0004L62.7058 14.0481C62.3807 14.1017 61.8191 14.1017 61.4645 14.0362L61.1748 13.9826L61.2103 15.7636Z" fill="white"/>
<path d="M75.1029 15.0558C75.1206 15.5085 75.1856 17.2895 75.2388 19.011L75.3452 22.1502L75.6408 22.1859C75.8063 22.2038 76.2024 22.2217 76.5216 22.2217H77.095V21.7749C77.095 21.3639 76.8762 15.0498 76.8408 14.5078C76.829 14.2457 76.8585 14.2516 76.2556 14.3529C76.0664 14.3886 75.8359 14.3886 75.7235 14.3588C75.6171 14.335 75.4221 14.2933 75.2979 14.2695L75.0674 14.2278L75.1029 15.0558Z" fill="white"/>
<path d="M78.7092 14.7584C78.7328 15.0146 78.8038 16.7777 78.8747 18.6779C78.9456 20.5781 79.0166 22.1507 79.0402 22.1745C79.058 22.1924 79.4599 22.2222 79.9269 22.2341L80.7722 22.252L80.7368 21.2691C80.6954 20.1612 80.6185 18.3741 80.5181 15.9974C80.4826 15.1099 80.4412 14.3772 80.4294 14.3653C80.4176 14.3474 80.2107 14.3653 79.9742 14.407C79.6373 14.4546 79.4718 14.4546 79.1644 14.3891C78.9516 14.3415 78.7565 14.3057 78.7269 14.2998C78.6974 14.2998 78.6915 14.5023 78.7092 14.7584Z" fill="white"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.4688 0.298735C8.91207 0.298735 3.28392 4.30495 0.863514 10.0207C3.07895 11.1596 4.61106 13.4552 4.67588 16.1175C4.76876 10.1917 9.5648 5.41677 15.4676 5.41677C21.4284 5.41677 26.2607 10.2861 26.2607 16.2927C26.2607 22.2994 21.4284 27.1687 15.4676 27.1687C9.56508 27.1687 4.76921 22.3942 4.67589 16.4688C4.61127 19.1312 3.0793 21.4269 0.863949 22.5659C3.2846 28.2811 8.91246 32.2869 15.4688 32.2869C22.0255 32.2869 27.6537 28.2806 30.0741 22.5648C27.8124 21.4001 26.2641 19.0295 26.2641 16.2944C26.2641 13.5589 27.813 11.1879 30.0752 10.0234C27.6554 4.30622 22.0265 0.298735 15.4688 0.298735Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
src/assets/rupayImg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB