frontAnswerer/lib/components/ViewPublicationPage/tools/PrevButton.tsx

import { Button, useTheme } from "@mui/material";
import { useRootContainerSize } from "../../../contexts/RootContainerWidthContext";
import { quizThemes } from "@utils/themes/Publication/themePublication";
import { useQuizData } from "@contexts/QuizDataContext";

interface Props {
    isPreviousButtonEnabled: boolean,
    moveToPrevQuestion: () => void,
}

export default function PrevButton({ isPreviousButtonEnabled, moveToPrevQuestion }: Props) {
    const theme = useTheme();
    const { settings } = useQuizData();
    const isMobileMini = useRootContainerSize() < 382;
    return (
        <Button
            disabled={!isPreviousButtonEnabled}
            variant="contained"
            sx={{
                ml: "auto",
                fontSize: "16px",
                padding: "10px 15px",
                color: quizThemes[settings.cfg.theme].isLight ? theme.palette.primary.main : "#FFFFFF",
                border: quizThemes[settings.cfg.theme].isLight ? `1px solid ${theme.palette.primary.main}` : "1px solid #9A9AAF",
                background: quizThemes[settings.cfg.theme].isLight ? "#FFFFFF" : "#FFFFFF26",
                "&:hover": {
                    color: "#FFFFFF",
                    border: `1px solid ${theme.palette.primary.dark}`,
                },
                "&:disabled": {
                    background: quizThemes[settings.cfg.theme].isLight ? "#F2F3F7" : "#FFFFFF26"
                },
            }}
            onClick={moveToPrevQuestion}
        >
            {isMobileMini ? "←" : "← Назад"}
        </Button>
    );
}