modal fix
This commit is contained in:
ArtChaos189
parent
494d750534
commit
9bdf5bf678
@ -17,6 +17,8 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
|
||||
|
||||
if (!quiz) return null;
|
||||
|
||||
console.log(quiz);
|
||||
|
||||
const handleCopyNumber = () => {
|
||||
navigator.clipboard.writeText(quiz.config.info.phonenumber);
|
||||
};
|
||||
|
||||
@ -17,7 +17,7 @@ import { enqueueSnackbar } from "notistack";
|
||||
import { useQuestionsStore } from "@root/questions/store";
|
||||
import { setQuestions } from "@root/questions/actions";
|
||||
import { questionApi } from "@api/question";
|
||||
import { ApologyPage } from "./ApologyPage"
|
||||
import { ApologyPage } from "./ApologyPage";
|
||||
|
||||
export const ViewPage = () => {
|
||||
const quiz = useCurrentQuiz();
|
||||
@ -48,15 +48,15 @@ export const ViewPage = () => {
|
||||
}
|
||||
}, [quiz?.config.startpage.favIcon]);
|
||||
|
||||
const filteredQuestions = (
|
||||
questions.filter(({ type }) => type) as AnyTypedQuizQuestion[]
|
||||
).sort((previousItem, item) => previousItem.page - item.page);
|
||||
const filteredQuestions = (questions.filter(({ type }) => type) as AnyTypedQuizQuestion[]).sort(
|
||||
(previousItem, item) => previousItem.page - item.page
|
||||
);
|
||||
|
||||
|
||||
console.log(questions)
|
||||
console.log(questions);
|
||||
|
||||
if (visualStartPage === undefined) return <></>;
|
||||
if (questions.length === 0 || (questions.length === 1 && questions[0].type === "result")) return <ApologyPage message="Нет созданных вопросов"/>
|
||||
if (questions.length === 0 || (questions.length === 1 && questions[0].type === "result"))
|
||||
return <ApologyPage message="Нет созданных вопросов" />;
|
||||
return (
|
||||
<Box>
|
||||
{!visualStartPage ? (
|
||||
|
||||
@ -71,7 +71,7 @@ export default function EditPage() {
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down(660));
|
||||
const [mobileSidebar, setMobileSidebar] = useState<boolean>(false);
|
||||
const quizConfig = quiz?.config;
|
||||
const disableTest = quiz === undefined ? true : (quiz.config.type === null)
|
||||
const disableTest = quiz === undefined ? true : quiz.config.type === null;
|
||||
|
||||
useEffect(() => {
|
||||
if (editQuizId === null) navigate("/list");
|
||||
@ -81,49 +81,44 @@ export default function EditPage() {
|
||||
() => () => {
|
||||
resetEditConfig();
|
||||
cleanQuestions();
|
||||
updateModalInfoWhyCantCreate(false)
|
||||
updateModalInfoWhyCantCreate(false);
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
|
||||
|
||||
const updateQuestionHint = useDebouncedCallback((questions: AnyTypedQuizQuestion[]) => {
|
||||
|
||||
const problems: any = {}
|
||||
const problems: any = {};
|
||||
|
||||
questions.forEach((question) => {
|
||||
//Если не участвует в ветвлении, или безтиповый, или резулт - он нам не интересен
|
||||
if (question.type === null
|
||||
|| question.type === "result"
|
||||
|| question.content.rule.parentId.length === 0) return
|
||||
if (question.type === null || question.type === "result" || question.content.rule.parentId.length === 0) return;
|
||||
|
||||
//если есть дети, но нет дефолта - логическая ошибка. Так нельзя
|
||||
if (question.content.rule.children.length > 0 && question.content.rule.default.length === 0) {
|
||||
problems[question.content.id] = {
|
||||
name: question.title,
|
||||
problems: ["Не выбран дефолтный вопрос"]
|
||||
}
|
||||
problems: ["Не выбран дефолтный вопрос"],
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
console.log(problems);
|
||||
|
||||
useUiTools.setState({ whyCantCreatePublic: problems });
|
||||
|
||||
useUiTools.setState({ whyCantCreatePublic: problems })
|
||||
if (Object.keys(problems).length > 0) {
|
||||
updateQuiz(quiz?.id, (state) => { state.status = "stop" })
|
||||
updateCanCreatePublic(false)
|
||||
updateQuiz(quiz?.id, (state) => {
|
||||
state.status = "stop";
|
||||
});
|
||||
updateCanCreatePublic(false);
|
||||
} else {
|
||||
updateCanCreatePublic(true)
|
||||
updateCanCreatePublic(true);
|
||||
}
|
||||
|
||||
|
||||
}, 600);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
updateQuestionHint(questions)
|
||||
updateQuestionHint(questions);
|
||||
}, [questions]);
|
||||
|
||||
|
||||
async function handleLogoutClick() {
|
||||
const [, logoutError] = await logout();
|
||||
@ -137,7 +132,7 @@ export default function EditPage() {
|
||||
navigate("/");
|
||||
}
|
||||
|
||||
if (!quizConfig) return <></>
|
||||
if (!quizConfig) return <></>;
|
||||
return (
|
||||
<>
|
||||
{/*хедер*/}
|
||||
@ -366,7 +361,7 @@ export default function EditPage() {
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{!canCreatePublic && quiz.config.type !== "form" ?
|
||||
{!canCreatePublic && quiz.config.type !== "form" ? (
|
||||
<Button
|
||||
variant="contained"
|
||||
// disabled
|
||||
@ -376,11 +371,13 @@ export default function EditPage() {
|
||||
height: "34px",
|
||||
minWidth: "130px",
|
||||
}}
|
||||
onClick={() => Object.keys(whyCantCreatePublic).length === 0 ? () => {} : updateModalInfoWhyCantCreate(true)}
|
||||
onClick={() =>
|
||||
Object.keys(whyCantCreatePublic).length === 0 ? null : updateModalInfoWhyCantCreate(true)
|
||||
}
|
||||
>
|
||||
Тестовый просмотр
|
||||
</Button>
|
||||
:
|
||||
) : (
|
||||
<a href={`/view`} target="_blank" rel="noreferrer" style={{ textDecoration: "none" }}>
|
||||
<Button
|
||||
variant="contained"
|
||||
@ -394,7 +391,7 @@ export default function EditPage() {
|
||||
Тестовый просмотр
|
||||
</Button>
|
||||
</a>
|
||||
}
|
||||
)}
|
||||
|
||||
<Button
|
||||
variant="outlined"
|
||||
@ -407,26 +404,31 @@ export default function EditPage() {
|
||||
color: quiz?.status === "start" ? "#FFFFFF" : theme.palette.brightPurple.main,
|
||||
}}
|
||||
onClick={
|
||||
Object.keys(whyCantCreatePublic).length === 0 ?
|
||||
() => updateQuiz(quiz?.id, (state) => {
|
||||
state.status = quiz?.status === "start" ? "stop" : "start";
|
||||
})
|
||||
:
|
||||
() => updateModalInfoWhyCantCreate(true)
|
||||
}
|
||||
Object.keys(whyCantCreatePublic).length === 0
|
||||
? () =>
|
||||
updateQuiz(quiz?.id, (state) => {
|
||||
state.status = quiz?.status === "start" ? "stop" : "start";
|
||||
})
|
||||
: () => updateModalInfoWhyCantCreate(true)
|
||||
}
|
||||
>
|
||||
{quiz?.status === "start" ? "Стоп" : "Старт"}
|
||||
</Button>
|
||||
{quiz?.status === "start" && <Box
|
||||
component={Link}
|
||||
sx={{
|
||||
color: "#7e2aea",
|
||||
fontSize: "14px"
|
||||
}}
|
||||
target="_blank" to={"https://hbpn.link/" + quiz.qid}>https://hbpn.link/{quiz.qid}
|
||||
</Box>}
|
||||
{quiz?.status === "start" ? "Стоп" : "Старт"}
|
||||
</Button>
|
||||
{quiz?.status === "start" && (
|
||||
<Box
|
||||
component={Link}
|
||||
sx={{
|
||||
color: "#7e2aea",
|
||||
fontSize: "14px",
|
||||
}}
|
||||
target="_blank"
|
||||
to={"https://hbpn.link/" + quiz.qid}
|
||||
>
|
||||
https://hbpn.link/{quiz.qid}
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box >
|
||||
<ModalInfoWhyCantCreate />
|
||||
</>
|
||||
);
|
||||
|
||||
@ -1,240 +1,247 @@
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
ButtonBase,
|
||||
Link,
|
||||
Paper,
|
||||
Typography,
|
||||
useMediaQuery,
|
||||
useTheme,
|
||||
} from "@mui/material";
|
||||
import { Box, Button, ButtonBase, Link, Paper, Typography, useMediaQuery, useTheme } from "@mui/material";
|
||||
import { useCurrentQuiz } from "@root/quizes/hooks";
|
||||
import YoutubeEmbedIframe from "./YoutubeEmbedIframe";
|
||||
import { QuizStartpageAlignType, QuizStartpageType } from "@model/quizSettings";
|
||||
import { notReachable } from "../../utils/notReachable";
|
||||
import { useUADevice } from "../../utils/hooks/useUADevice";
|
||||
|
||||
|
||||
export default function QuizPreviewLayout() {
|
||||
const theme = useTheme();
|
||||
const quiz = useCurrentQuiz();
|
||||
const { isMobileDevice } = useUADevice();
|
||||
const theme = useTheme();
|
||||
const quiz = useCurrentQuiz();
|
||||
const { isMobileDevice } = useUADevice();
|
||||
|
||||
if (!quiz) return null;
|
||||
if (!quiz) return null;
|
||||
|
||||
const handleCopyNumber = () => {
|
||||
navigator.clipboard.writeText(quiz.config.info.phonenumber);
|
||||
};
|
||||
const handleCopyNumber = () => {
|
||||
navigator.clipboard.writeText(quiz.config.info.phonenumber);
|
||||
};
|
||||
|
||||
const background = quiz.config.startpage.background.type === "image"
|
||||
? quiz.config.startpage.background.desktop
|
||||
? (
|
||||
const background =
|
||||
quiz.config.startpage.background.type === "image" ? (
|
||||
quiz.config.startpage.background.desktop ? (
|
||||
<img
|
||||
src={quiz.config.startpage.background.desktop}
|
||||
alt=""
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
objectFit: "cover",
|
||||
}}
|
||||
/>
|
||||
) : null
|
||||
) : quiz.config.startpage.background.type === "video" ? (
|
||||
quiz.config.startpage.background.video ? (
|
||||
<YoutubeEmbedIframe videoUrl={quiz.config.startpage.background.video} />
|
||||
) : null
|
||||
) : null;
|
||||
|
||||
return (
|
||||
<Paper className="quiz-preview-draghandle" sx={{ height: "100%" }}>
|
||||
<QuizPreviewLayoutByType
|
||||
quizHeaderBlock={
|
||||
<>
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: "20px",
|
||||
}}
|
||||
>
|
||||
{quiz.config.startpage.logo && (
|
||||
<img
|
||||
src={quiz.config.startpage.background.desktop}
|
||||
alt=""
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
objectFit: "cover",
|
||||
}}
|
||||
src={quiz.config.startpage.logo}
|
||||
style={{
|
||||
height: "30px",
|
||||
maxWidth: "50px",
|
||||
objectFit: "cover",
|
||||
}}
|
||||
alt=""
|
||||
/>
|
||||
)
|
||||
: null
|
||||
: quiz.config.startpage.background.type === "video"
|
||||
? quiz.config.startpage.background.video
|
||||
? (
|
||||
<YoutubeEmbedIframe videoUrl={quiz.config.startpage.background.video} />
|
||||
)}
|
||||
<Typography sx={{ fontSize: "12px" }}>{quiz.config.info.orgname}</Typography>
|
||||
</Box>
|
||||
</>
|
||||
}
|
||||
quizMainBlock={
|
||||
<>
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
gap: "10px",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems:
|
||||
quiz.config.startpageType === "expanded" && quiz.config.startpage.position === "center"
|
||||
? "center"
|
||||
: "start",
|
||||
}}
|
||||
>
|
||||
<Typography sx={{ fontWeight: "bold" }}>{quiz.name}</Typography>
|
||||
<Typography sx={{ fontSize: "12px" }}>{quiz.config.startpage.description}</Typography>
|
||||
<Box>
|
||||
<Button
|
||||
variant="contained"
|
||||
sx={{
|
||||
fontSize: "16px",
|
||||
padding: "10px 15px",
|
||||
}}
|
||||
>
|
||||
{quiz.config.startpage.button.trim() ? quiz.config.startpage.button : "Пройти тест"}
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box>
|
||||
{quiz.config.info.clickable ? (
|
||||
isMobileDevice ? (
|
||||
<Link href={`tel:${quiz.config.info.phonenumber}`}>
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
</Link>
|
||||
) : (
|
||||
<ButtonBase onClick={handleCopyNumber}>
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
</ButtonBase>
|
||||
)
|
||||
: null
|
||||
: null;
|
||||
|
||||
return (
|
||||
<Paper className="quiz-preview-draghandle" sx={{ height: "100%" }}>
|
||||
<QuizPreviewLayoutByType
|
||||
quizHeaderBlock={<>
|
||||
<Box sx={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: "20px",
|
||||
}}>
|
||||
{quiz.config.startpage.logo && (
|
||||
<img
|
||||
src={quiz.config.startpage.logo}
|
||||
style={{
|
||||
height: "30px",
|
||||
maxWidth: "50px",
|
||||
objectFit: "cover",
|
||||
}}
|
||||
alt=""
|
||||
/>
|
||||
)}
|
||||
<Typography sx={{ fontSize: "12px" }}>
|
||||
{quiz.config.info.orgname}
|
||||
</Typography>
|
||||
</Box>
|
||||
</>}
|
||||
quizMainBlock={<>
|
||||
<Box sx={{
|
||||
display: "flex",
|
||||
gap: "10px",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: (quiz.config.startpageType === "expanded" && quiz.config.startpage.position === "center")
|
||||
? "center"
|
||||
: "start",
|
||||
}}>
|
||||
<Typography sx={{ fontWeight: "bold" }}>{quiz.name}</Typography>
|
||||
<Typography sx={{ fontSize: "12px" }}>
|
||||
{quiz.config.startpage.description}
|
||||
</Typography>
|
||||
<Box>
|
||||
<Button
|
||||
variant="contained"
|
||||
sx={{
|
||||
fontSize: "16px",
|
||||
padding: "10px 15px",
|
||||
}}
|
||||
>
|
||||
{quiz.config.startpage.button.trim() ? quiz.config.startpage.button : "Пройти тест"}
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box>
|
||||
{quiz.config.info.clickable ? (
|
||||
isMobileDevice ? (
|
||||
<Link href={`tel:${quiz.config.info.phonenumber}`}>
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
</Link>
|
||||
) : (
|
||||
<ButtonBase onClick={handleCopyNumber}>
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
</ButtonBase>
|
||||
)
|
||||
) : (
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
)}
|
||||
<Typography sx={{ fontSize: "12px" }}>
|
||||
{quiz.config.info.law}
|
||||
</Typography>
|
||||
</Box>
|
||||
</>}
|
||||
backgroundBlock={background}
|
||||
startpageType={quiz.config.startpageType}
|
||||
alignType={quiz.config.startpage.position}
|
||||
/>
|
||||
</Paper>
|
||||
);
|
||||
) : (
|
||||
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
|
||||
{quiz.config.info.phonenumber}
|
||||
</Typography>
|
||||
)}
|
||||
<Typography sx={{ fontSize: "12px" }}>{quiz.config.info.law}</Typography>
|
||||
</Box>
|
||||
</>
|
||||
}
|
||||
backgroundBlock={background}
|
||||
startpageType={quiz.config.startpageType}
|
||||
alignType={quiz.config.startpage.position}
|
||||
/>
|
||||
</Paper>
|
||||
);
|
||||
}
|
||||
|
||||
function QuizPreviewLayoutByType({ quizHeaderBlock, quizMainBlock, backgroundBlock, startpageType, alignType }: {
|
||||
quizHeaderBlock: JSX.Element;
|
||||
quizMainBlock: JSX.Element;
|
||||
backgroundBlock: JSX.Element | null;
|
||||
startpageType: QuizStartpageType;
|
||||
alignType: QuizStartpageAlignType;
|
||||
function QuizPreviewLayoutByType({
|
||||
quizHeaderBlock,
|
||||
quizMainBlock,
|
||||
backgroundBlock,
|
||||
startpageType,
|
||||
alignType,
|
||||
}: {
|
||||
quizHeaderBlock: JSX.Element;
|
||||
quizMainBlock: JSX.Element;
|
||||
backgroundBlock: JSX.Element | null;
|
||||
startpageType: QuizStartpageType;
|
||||
alignType: QuizStartpageAlignType;
|
||||
}) {
|
||||
const theme = useTheme();
|
||||
const isTablet = useMediaQuery(theme.breakpoints.down(630));
|
||||
const theme = useTheme();
|
||||
const isTablet = useMediaQuery(theme.breakpoints.down(630));
|
||||
|
||||
switch (startpageType) {
|
||||
case null:
|
||||
case "standard": {
|
||||
return (
|
||||
<Box sx={{
|
||||
display: "flex",
|
||||
flexDirection: alignType === "left" ? "row" : "row-reverse",
|
||||
flexGrow: 1,
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}>
|
||||
<Box sx={{
|
||||
width: !isTablet ? "40%" : "100%",
|
||||
padding: "16px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: !isTablet ? "flex-start" : "center",
|
||||
}}>
|
||||
{quizHeaderBlock}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
<Box sx={{
|
||||
width: "60%",
|
||||
}}>
|
||||
{backgroundBlock}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
case "expanded": {
|
||||
return (
|
||||
<Box sx={{
|
||||
position: "relative",
|
||||
display: "flex",
|
||||
justifyContent: startpageAlignTypeToJustifyContent[alignType],
|
||||
flexGrow: 1,
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}>
|
||||
<Box sx={{
|
||||
width: "40%",
|
||||
position: "relative",
|
||||
padding: "16px",
|
||||
zIndex: 2,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: alignType === "center" ? "center" : "start",
|
||||
}}>
|
||||
{quizHeaderBlock}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
<Box sx={{
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
top: 0,
|
||||
height: "100%",
|
||||
width: "100%",
|
||||
zIndex: 1,
|
||||
}}>
|
||||
{backgroundBlock}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
case "centered": {
|
||||
return (
|
||||
<Box sx={{
|
||||
padding: "16px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center",
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}>
|
||||
{quizHeaderBlock}
|
||||
{backgroundBlock &&
|
||||
<Box>
|
||||
{backgroundBlock}
|
||||
</Box>
|
||||
}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
default: notReachable(startpageType);
|
||||
switch (startpageType) {
|
||||
case null:
|
||||
case "standard": {
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
flexDirection: alignType === "left" ? "row" : "row-reverse",
|
||||
flexGrow: 1,
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
width: !isTablet ? "40%" : "100%",
|
||||
padding: "16px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: !isTablet ? "flex-start" : "center",
|
||||
}}
|
||||
>
|
||||
{quizHeaderBlock}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
width: "60%",
|
||||
}}
|
||||
>
|
||||
{backgroundBlock}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
case "expanded": {
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
position: "relative",
|
||||
display: "flex",
|
||||
justifyContent: startpageAlignTypeToJustifyContent[alignType],
|
||||
flexGrow: 1,
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
width: "40%",
|
||||
position: "relative",
|
||||
padding: "16px",
|
||||
zIndex: 2,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: alignType === "center" ? "center" : "start",
|
||||
}}
|
||||
>
|
||||
{quizHeaderBlock}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
<Box
|
||||
sx={{
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
top: 0,
|
||||
height: "100%",
|
||||
width: "100%",
|
||||
zIndex: 1,
|
||||
}}
|
||||
>
|
||||
{backgroundBlock}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
case "centered": {
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
padding: "16px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center",
|
||||
height: "100%",
|
||||
"&::-webkit-scrollbar": { width: 0 },
|
||||
}}
|
||||
>
|
||||
{quizHeaderBlock}
|
||||
{backgroundBlock && <Box>{backgroundBlock}</Box>}
|
||||
{quizMainBlock}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
default:
|
||||
notReachable(startpageType);
|
||||
}
|
||||
}
|
||||
|
||||
const startpageAlignTypeToJustifyContent: Record<QuizStartpageAlignType, "start" | "center" | "end"> = {
|
||||
left: "start",
|
||||
center: "center",
|
||||
right: "end",
|
||||
left: "start",
|
||||
center: "center",
|
||||
right: "end",
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user