diff --git a/src/pages/Questions/QuestionSwitchWindowTool.tsx b/src/pages/Questions/QuestionSwitchWindowTool.tsx
index 10f89bae..b0b4ab3c 100644
--- a/src/pages/Questions/QuestionSwitchWindowTool.tsx
+++ b/src/pages/Questions/QuestionSwitchWindowTool.tsx
@@ -13,11 +13,13 @@ import { deleteTimeoutedQuestions } from "@utils/deleteTimeoutedQuestions";
interface Props {
openBranchingPage: boolean;
setOpenBranchingPage: (a: boolean) => void;
+ widthMain: number;
}
export const QuestionSwitchWindowTool = ({
openBranchingPage,
setOpenBranchingPage,
+ widthMain,
}: Props) => {
const { questions } = useQuestionsStore.getState();
const theme = useTheme();
@@ -54,6 +56,7 @@ export const QuestionSwitchWindowTool = ({
)}
diff --git a/src/pages/Questions/QuestionsPage.tsx b/src/pages/Questions/QuestionsPage.tsx
index 5e16966b..115523de 100755
--- a/src/pages/Questions/QuestionsPage.tsx
+++ b/src/pages/Questions/QuestionsPage.tsx
@@ -32,11 +32,13 @@ import { useNavigate } from "react-router-dom";
interface Props {
openBranchingPage: boolean;
setOpenBranchingPage: (a: boolean) => void;
+ widthMain: number;
}
export default function QuestionsPage({
openBranchingPage,
setOpenBranchingPage,
+ widthMain,
}: Props) {
const theme = useTheme();
const { openedModalSettingsId } = useUiTools();
@@ -86,6 +88,7 @@ export default function QuestionsPage({
void;
+ widthMain: number;
}
export const SwitchBranchingPanel = ({
openBranchingPage,
setOpenBranchingPage,
+ widthMain,
}: Props) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(660));
const isTablet = useMediaQuery(theme.breakpoints.down(1446));
-
return openBranchingPage ? (
- {isTablet || (
+ {widthMain > 1216 && (
(false);
const [nextStep, setNextStep] = useState(0);
@@ -94,6 +95,21 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
setCurrentStep(index);
};
+ const [widthMain, setWidthMain] = useState(null);
+ const mainBlock = useRef(0);
+
+ const observer = useRef(
+ new ResizeObserver((entries) => {
+ const { width } = entries[0].contentRect;
+ setWidthMain(width);
+ }),
+ );
+
+ useEffect(() => {
+ observer.current.observe(mainBlock.current);
+ }, [mainBlock, observer]);
+ console.log(widthMain);
+
return (
<>
@@ -125,6 +141,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
}}
>
@@ -157,17 +175,19 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
}}
>
{isConditionMet &&
- (isBranchingLogic ? (
+ (isBranchingLogicSmall ? (
- ) : (
+ ) : widthMain < 1216 || !openBranchingPage ? (
+ ) : (
+ <>>
))}
{/* Кнопка тестового просмотра */}
diff --git a/src/pages/startPage/EditPage.tsx b/src/pages/startPage/EditPage.tsx
index b733aad7..39778e3f 100755
--- a/src/pages/startPage/EditPage.tsx
+++ b/src/pages/startPage/EditPage.tsx
@@ -45,10 +45,12 @@ import { checkQuestionHint } from "@utils/checkQuestionHint";
interface Props {
openBranchingPage: boolean;
setOpenBranchingPage: (a: boolean) => void;
+ widthMain: number;
}
export default function EditPage({
openBranchingPage,
setOpenBranchingPage,
+ widthMain,
}: Props) {
const quiz = useCurrentQuiz();
const { editQuizId } = useQuizStore();
@@ -148,6 +150,7 @@ export default function EditPage({
quizStartPageType={quizConfig.startpageType}
openBranchingPage={openBranchingPage}
setOpenBranchingPage={setOpenBranchingPage}
+ widthMain={widthMain}
/>
>
)}
diff --git a/src/ui_kit/switchStepPages.tsx b/src/ui_kit/switchStepPages.tsx
index 5ab7229c..b2e87051 100755
--- a/src/ui_kit/switchStepPages.tsx
+++ b/src/ui_kit/switchStepPages.tsx
@@ -21,6 +21,7 @@ interface Props {
quizResults: QuizResultsType;
openBranchingPage: boolean;
setOpenBranchingPage: (a: boolean) => void;
+ widthMain: number;
}
export default function SwitchStepPages({
@@ -30,6 +31,7 @@ export default function SwitchStepPages({
quizResults,
openBranchingPage,
setOpenBranchingPage,
+ widthMain,
}: Props) {
switch (activeStep) {
case 0: {
@@ -44,6 +46,7 @@ export default function SwitchStepPages({
);
case 2: