Фикс верстки на экране Backup

This commit is contained in:
RoyceDa
2026-02-17 12:12:21 +02:00
parent d857be6948
commit b63c87f23c
2 changed files with 32 additions and 23 deletions

View File

@@ -5,6 +5,7 @@ import { useState, useEffect } from "react";
interface TextChainProps {
text: string;
mt?: MantineSize;
withoutPaper?: boolean;
}
export function TextChain(props : TextChainProps) {
@@ -26,31 +27,41 @@ export function TextChain(props : TextChainProps) {
});
}, [text]);
const grid = (
<SimpleGrid cols={3} spacing="xs">
{text.split(" ").map((v, i) => {
return (
<Box
key={i}
className={classes.wordBox}
style={{
opacity: mounted[i] ? 1 : 0,
transform: mounted[i] ? 'scale(1)' : 'scale(0.9)',
transition: 'opacity 300ms ease, transform 300ms ease',
}}
>
<Text size="xs" c="dimmed" mr={4}>{i + 1}.</Text>
<Text size="sm" fw={500}>{v}</Text>
</Box>
);
})}
</SimpleGrid>
);
return (
!props.withoutPaper ? (
<Box mt={props.mt}>
<Box className={classes.displayArea}>
<Text size="sm" mb="md" c="dimmed">
Your seed phrase:
</Text>
<SimpleGrid cols={3} spacing="xs">
{text.split(" ").map((v, i) => {
return (
<Box
key={i}
className={classes.wordBox}
style={{
opacity: mounted[i] ? 1 : 0,
transform: mounted[i] ? 'scale(1)' : 'scale(0.9)',
transition: 'opacity 300ms ease, transform 300ms ease',
}}
>
<Text size="xs" c="dimmed" mr={4}>{i + 1}.</Text>
<Text size="sm" fw={500}>{v}</Text>
</Box>
);
})}
</SimpleGrid>
{grid}
</Box>
</Box>
) : (
<Box mt={props.mt}>
{grid}
</Box>
)
)
}