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 59 60 61 62 63 64 65 66 | 32x 32x 27x 27x 54x 189x 54x | import {
ONB_BA_DOCUMENTS,
REBRANDED_BA_TITLES,
REBRANDED_UPLOAD_BA_TITLES,
} from "@features/GiveOnboarding/pages/Bank/Statement/const";
import { Stack, styled } from "@mui/material";
import GiveText from "@shared/Text/GiveText";
const steps = [ONB_BA_DOCUMENTS.step_2, ONB_BA_DOCUMENTS.step_3];
type Props = {
stepCount?: number;
isUploadStatement?: boolean;
};
export const GiveDocumentUploadDisclaimer = ({
stepCount = 1,
isUploadStatement,
}: Props) => {
const titles = isUploadStatement
? REBRANDED_UPLOAD_BA_TITLES
: REBRANDED_BA_TITLES;
return (
<Stack gap="32px" sx={{ paddingTop: "20px" }}>
{steps.map((step, idx) => (
<Stack gap="20px" key={idx}>
<GiveText variant="bodyM">
{titles[`step_${idx + stepCount + 1}`]}
</GiveText>
<Stack gap="12px">
<GiveText variant="bodyS" color="warning">
{step.info}
</GiveText>
<StyledList>
{step.list.map((el, i) => (
<li key={i}>
<GiveText variant="bodyS" lineHeight={"20px"}>
{el}
</GiveText>
</li>
))}
</StyledList>
</Stack>
</Stack>
))}
</Stack>
);
};
const StyledList = styled("ul")(({ theme }) => ({
margin: 0,
paddingLeft: "24px",
display: "flex",
flexDirection: "column",
gap: "8px",
"& li": {
"::marker": {
marginRight: "8px",
fontSize: "18px",
lineHeight: "18px",
color: theme.palette.neutral[80],
},
},
}));
|