Working on a new layout and facing some alignment issues. Here is the design I'm trying to achieve https://i.sstatic.net/MOKO7.png
However, my current layout looks like this https://i.sstatic.net/Rdww8.png
I've included the code below for your reference. Please let me know what I'm doing wrong and how I can fix it...
line,
}) {
return (
<Row
width="35em"
>
<Text
color="#73737D"
fontSize="14px"
>
{line}
</Text>
<Box
marginLeft="5em"
display="flex"
flexDirection="row"
justifyContent="center"
alignItems="center"
width="2em"
>
<CheckBox />
</Box>
</Row>
);
}