62 lines
1.6 KiB
JavaScript
Executable File
62 lines
1.6 KiB
JavaScript
Executable File
/*!
|
|
|
|
=========================================================
|
|
* Argon Dashboard Chakra PRO - v1.0.0
|
|
=========================================================
|
|
|
|
* Product Page: https://www.creative-tim.com/product/argon-dashboard-chakra-pro
|
|
* Copyright 2022 Creative Tim (https://www.creative-tim.com/)
|
|
|
|
* Designed and Coded by Simmmple & Creative Tim
|
|
|
|
=========================================================
|
|
|
|
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
|
|
*/
|
|
|
|
import {
|
|
Box,
|
|
Button,
|
|
Flex,
|
|
Icon,
|
|
Spacer,
|
|
Text,
|
|
useColorModeValue,
|
|
} from "@chakra-ui/react";
|
|
import React from "react";
|
|
|
|
function InvoicesRow(props) {
|
|
const textColor = useColorModeValue("gray.700", "white");
|
|
const { date, code, price, format, logo } = props;
|
|
|
|
return (
|
|
<Flex my={{ sm: "1rem", xl: "10px" }} alignItems="center">
|
|
<Flex direction="column">
|
|
<Text fontSize="md" color={textColor} fontWeight="bold">
|
|
{date}
|
|
</Text>
|
|
<Text fontSize="sm" color="gray.400" fontWeight="semibold" me="16px">
|
|
{code}
|
|
</Text>
|
|
</Flex>
|
|
<Spacer />
|
|
<Box me="12px">
|
|
<Text fontSize="md" color="gray.400" fontWeight="semibold">
|
|
{price}
|
|
</Text>
|
|
</Box>
|
|
<Button p="0px" bg="transparent" variant="no-effects">
|
|
<Flex alignItems="center" p="12px">
|
|
<Icon as={logo} w="20px" h="auto" me="5px" />
|
|
<Text fontSize="md" color={textColor} fontWeight="bold">
|
|
{format}
|
|
</Text>
|
|
</Flex>
|
|
</Button>
|
|
</Flex>
|
|
);
|
|
}
|
|
|
|
export default InvoicesRow;
|