frontPanel/src/pages/startPage/stepOne.tsx

72 lines
2.7 KiB
TypeScript
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { Box, Button, useTheme } from "@mui/material";
import CreationCard from "@ui_kit/CreationCard";
import quizCreationImage1 from "../../assets/quiz-creation-1.png";
import quizCreationImage2 from "../../assets/quiz-creation-2.png";
import { useParams } from "react-router-dom";
import { quizStore } from "@root/quizes";
export default function StepOne() {
const params = Number(useParams().quizId);
const theme = useTheme();
const { listQuizes, updateQuizesList } = quizStore();
return (
<Box
sx={{
overflowX: "scroll",
padding: "0 5px 15px",
"&::-webkit-scrollbar": { width: 0 },
}}
>
<Box
sx={{
minWidth: "720px",
display: "flex",
gap: "20px",
mt: "60px",
}}
>
<Button
variant="text"
data-cy="create-quiz-card"
onClick={() => {
let SPageClone = listQuizes[params].config;
SPageClone.type = "quize";
updateQuizesList(params, { config: SPageClone });
}}
>
<CreationCard
header="Создание квиз-опроса"
text="У стартовой страницы одна ключевая задача - заинтересовать посетителя пройти квиз. С ней сложно ошибиться, сформулируйте суть предложения и подберите живую фотографию, остальное мы сделаем за вас"
image={quizCreationImage1}
border={
listQuizes[params].config.type === "quize"
? "1px solid #7E2AEA"
: "none"
}
/>
</Button>
<Button
variant="text"
onClick={() => {
let SPageClone = listQuizes[params].config;
SPageClone.type = "form";
updateQuizesList(params, { config: SPageClone });
}}
>
<CreationCard
header="Создание анкеты"
text="У стартовой страницы одна ключевая задача - заинтересовать посетителя пройти квиз. С ней сложно ошибиться, сформулируйте суть предложения и подберите живую фотографию, остальное мы сделаем за вас"
image={quizCreationImage2}
border={
listQuizes[params].config.type === "form"
? "1px solid #7E2AEA"
: "none"
}
/>
</Button>
</Box>
</Box>
);
}