ещё правки по адаптивности тестовой публикации

src/pages/ViewPublicationPage/ContactForm.tsx

@@ -114,8 +114,6 @@ export const ContactForm = ({
           borderRadius: "4px",
           overflow: "auto",
           height: "90vh",
-          boxShadow:
-            "rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px",
         }}
       >
         <Box>
@@ -133,6 +131,7 @@ export const ContactForm = ({
           {quiz?.config.formContact.desc && (
             <Typography
               sx={{
+                color: theme.palette.text.primary,
                 textAlign: "center",
                 m: "20px 0",
                 fontSize: "18px",
@@ -199,7 +198,7 @@ export const ContactForm = ({
               checked={ready}
               colorIcon={theme.palette.primary.main}
             />
-            <Typography>
+            <Typography sx={{ color: theme.palette.text.primary }}>
               С&ensp;
               <Link> Положением об обработке персональных данных </Link>
               &ensp;и&ensp;
@@ -328,7 +327,9 @@ const CustomInput = ({ title, desc, Icon }: any) => {
   const isMobile = useMediaQuery(theme.breakpoints.down(600));
   return (
     <Box m="15px 0">
-      <Typography mb="7px">{title}</Typography>
+      <Typography mb="7px" color={theme.palette.text.primary}>
+        {title}
+      </Typography>
       <TextField
         sx={{
           width: isMobile ? "300px" : "350px",

src/pages/ViewPublicationPage/Footer.tsx

@@ -109,7 +109,7 @@ export const Footer = ({
   }, [question, answers]);
 
   const showResult = (nextQuestion) => {
-    console.log("Следующий результат будет вот такой" , nextQuestion)
+    console.log("Следующий результат будет вот такой", nextQuestion);
     if (nextQuestion && quiz?.config.resultInfo.when === "email") {
       setShowContactForm(true);
       return;
@@ -242,7 +242,7 @@ export const Footer = ({
   };
 
   const followNextStep = () => {
-    console.log(" Я понимаю что нахожусь в линейном опроснике" + linear)
+    console.log(" Я понимаю что нахожусь в линейном опроснике" + linear);
     if (linear) {
       setStepNumber((q) => q + 1);
       const questionIndex = questions.findIndex(({ id }) => id === question.id);

src/pages/ViewPublicationPage/Question.tsx

@@ -90,15 +90,17 @@ export const Question = ({ questions }: QuestionProps) => {
           }}
         >
           <QuestionComponent currentQuestion={currentQuestion} />
-          {mode[quiz.config.theme] ? (
-            <NameplateLogoFQ
-              style={{ fontSize: "34px", width: "200px", height: "auto" }}
-            />
-          ) : (
-            <NameplateLogoFQDark
-              style={{ fontSize: "34px", width: "200px", height: "auto" }}
-            />
-          )}
+          <Box>
+            {mode[quiz.config.theme] ? (
+              <NameplateLogoFQ
+                style={{ fontSize: "34px", width: "200px", height: "auto" }}
+              />
+            ) : (
+              <NameplateLogoFQDark
+                style={{ fontSize: "34px", width: "200px", height: "auto" }}
+              />
+            )}
+          </Box>
         </Box>
       )}
       {showResultForm && quiz?.config.resultInfo.when === "before" && (

src/pages/ViewPublicationPage/ResultForm.tsx

@@ -44,17 +44,19 @@ export const ResultForm = ({
       ) ||
         questions.find(
           (question) =>
-            question.type === "result" && question.content.rule.parentId === "line",
+            question.type === "result" &&
+            question.content.rule.parentId === "line",
         )) as AnyTypedQuizQuestion;
     } else {
       return questions.find(
         (question) =>
-          question.type === "result" && question.content.rule.parentId === "line",
+          question.type === "result" &&
+          question.content.rule.parentId === "line",
       ) as AnyTypedQuizQuestion;
     }
-  }
+  };
 
-  const resultQuestion = searchResult()
+  const resultQuestion = searchResult();
 
   const followNextForm = () => {
     setShowResultForm(false);
@@ -62,7 +64,7 @@ export const ResultForm = ({
   };
   if (resultQuestion === undefined) return <></>;
 
-  console.log("Я форма показа резултата и он такой ", resultQuestion)
+  console.log("Я форма показа резултата и он такой ", resultQuestion);
   return (
     <Box
       sx={{
@@ -110,6 +112,7 @@ export const ResultForm = ({
                 fontSize: "23px",
                 fontWeight: 700,
                 m: "20px 0",
+                color: theme.palette.text.primary,
               }}
             >
               {resultQuestion.description}
@@ -120,6 +123,7 @@ export const ResultForm = ({
           <Typography
             sx={{
               m: "20px 0",
+              color: theme.palette.text.primary,
             }}
           >
             {resultQuestion.title}
@@ -132,6 +136,7 @@ export const ResultForm = ({
               sx={{
                 fontSize: "18px",
                 m: "20px 0",
+                color: theme.palette.text.primary,
               }}
             >
               {resultQuestion.content.text}
@@ -153,9 +158,15 @@ export const ResultForm = ({
               display: "flex",
               alignItems: "center",
               mt: "15px",
+              gap: "10px",
             }}
           >
-            <NameplateLogo style={{ fontSize: "34px" }} />
+            <NameplateLogo
+              style={{
+                fontSize: "34px",
+                color: mode[quiz.config.theme] ? "#000000" : "#F5F7FF",
+              }}
+            />
             <Typography
               sx={{
                 fontSize: "20px",

src/pages/ViewPublicationPage/StartPageViewPublication.tsx

@@ -26,6 +26,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
   const mode = modes;
   const { isMobileDevice } = useUADevice();
   const isMobile = useMediaQuery(theme.breakpoints.down(650));
+  const isTablet = useMediaQuery(theme.breakpoints.down(1000));
 
   if (!quiz) return null;
 
@@ -100,7 +101,6 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                 ? "linear-gradient(180deg,transparent,#272626)"
                 : "linear-gradient(270deg,#272626,transparent)"
             : theme.palette.background.default,
-
         color: quiz.config.startpageType === "expanded" ? "white" : "black",
       }}
     >
@@ -197,6 +197,10 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                     quiz.config.startpageType === "centered"
                       ? "center"
                       : "-moz-initial",
+                  color:
+                    quiz.config.startpageType === "expanded" && !isMobile
+                      ? "white"
+                      : theme.palette.text.primary,
                 }}
               >
                 {quiz.config.startpage.description}
@@ -229,10 +233,10 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
               sx={{
                 mt: "46px",
                 display: "flex",
-                alignItems: "center",
+                alignItems: isTablet ? "start" : "center",
                 justifyContent: "space-between",
                 width: "100%",
-                flexDirection: isMobile ? "column" : "row",
+                flexDirection: isTablet ? "column" : "row",
               }}
             >
               <Box sx={{ maxWidth: "300px" }}>
@@ -272,7 +276,11 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
                     width: "100%",
                     overflowWrap: "break-word",
                     fontSize: "12px",
-                    textAlign: "end",
+                    textAlign: isTablet ? "start" : "end",
+                    color:
+                      quiz.config.startpageType === "expanded" && !isMobile
+                        ? "white"
+                        : theme.palette.text.primary,
                   }}
                 >
                   {quiz.config.info.law}

src/pages/ViewPublicationPage/questions/Variant.tsx

@@ -9,6 +9,7 @@ import {
   Checkbox,
   TextField,
   useTheme,
+  useMediaQuery,
 } from "@mui/material";
 
 import {
@@ -43,6 +44,7 @@ type VariantItemProps = {
 
 export const Variant = ({ currentQuestion }: VariantProps) => {
   const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down(650));
   const { answers, ownVariants } = useQuizViewStore();
   const { answer } =
     answers.find(
@@ -65,7 +67,13 @@ export const Variant = ({ currentQuestion }: VariantProps) => {
       <Typography variant="h5" color={theme.palette.text.primary}>
         {currentQuestion.title}
       </Typography>
-      <Box sx={{ display: "flex" }}>
+      <Box
+        sx={{
+          display: "flex",
+          gap: "20px",
+          flexDirection: isMobile ? "column-reverse" : undefined,
+        }}
+      >
         <Group
           name={currentQuestion.id}
           value={currentQuestion.content.variants.findIndex(

src/pages/main.tsx

@@ -234,7 +234,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
                   <LinkSimple />
                 </Box>
               )}
-              {currentStep === 1 && (
+              {currentStep <= 1 && (
                 <Box sx={{ textAlign: "end", width: "100%" }}>
                   <IconButton
                     onClick={toggleQuizPreview}

src/ui_kit/StartPagePreview/index.tsx

@@ -123,6 +123,7 @@ export const StartPagePreview = () => {
               overflow: "hidden",
               pointerEvents: "auto",
               borderRadius: "5px",
+              boxShadow: "0px 5px 10px 2px rgba(34, 60, 80, 0.2)",
             }}
           >
             <QuizPreviewLayout />