Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | 4x 4x 4x | import * as React from "react";
import { palette } from "@palette";
import Box from "@mui/material/Box";
import { Text } from "@common/Text";
import { ITextProps } from "@common/Text/Text";
interface ITrailingProps {
pageTotal: number;
total: number;
totalAmount?: boolean;
}
const style = {
display: "flex",
flexDirection: "column",
px: "16px",
py: "2px",
backgroundColor: "transparent",
};
const rowStyle = {
display: "flex",
justifyContent: "flex-end",
alignItems: "flex-end",
};
export const Trailing: React.FC<ITrailingProps> = ({
pageTotal,
total = 0,
}) => {
return (
<Box sx={style}>
<Box sx={rowStyle}>
<BottomText fontSize={14} text="Page Total" paddingRight={4} />
<BottomText fontSize={14} text={`${pageTotal.toLocaleString("en-US")} USD`} />
</Box>
</Box>
);
};
function BottomText({
children,
text,
...rest
}: ITextProps & { text: string }) {
return (
<Text
fontSize="12px"
fontWeight="regular"
color={palette.neutral[80]}
{...rest}
>
{text}
{children}
</Text>
);
}
|