import { Box, Typography, useTheme } from "@mui/material";


interface Props {
    bigText: string;
    text: string;
    flex: string;
}

export default function Infographics({ bigText, text, flex }: Props) {
    const theme = useTheme();

    return (
        <Box
            sx={{
                flex,
            }}
        >
            <Typography
                variant="infographic"
                color={theme.palette.custom.brightPurple.main}
                sx={{
                    whiteSpace: "nowrap",
                }}
            >{bigText}</Typography>
            <Typography sx={{ maxWidth: "10em" }}>{text}</Typography>
        </Box>
    );
}