длинные ответы не помещались в окошке для ответов

src/pages/ViewPublicationPage/Footer.tsx

@@ -116,7 +116,7 @@ export const Footer = ({
     }
 
     const isEmpty = checkEmptyData({ resultData: nextQuestion });
-    console.log("isEmpty", isEmpty)
+    console.log("isEmpty", isEmpty);
     if (nextQuestion) {
       if (nextQuestion && quiz?.config.resultInfo.when === "before") {
         if (isEmpty) {

src/pages/ViewPublicationPage/questions/Emoji.tsx

@@ -126,7 +126,9 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => {
                 }
                 label={
                   <Box sx={{ display: "flex", gap: "10px" }}>
-                    <Typography>{variant.answer}</Typography>
+                    <Typography sx={{ wordBreak: "break-word" }}>
+                      {variant.answer}
+                    </Typography>
                   </Box>
                 }
               />

src/pages/ViewPublicationPage/questions/File.tsx

@@ -81,10 +81,19 @@ export const File = ({ currentQuestion }: FileProps) => {
                 color: "#FFFFFF",
                 display: "flex",
                 alignItems: "center",
+                overflow: "hidden",
                 gap: "15px",
               }}
             >
-              <Typography>{answer?.split("|")[0]}</Typography>
+              <Typography
+                sx={{
+                  whiteSpace: "nowrap",
+                  textOverflow: "ellipsis",
+                  overflow: "hidden",
+                }}
+              >
+                {answer?.split("|")[0]}
+              </Typography>
               <IconButton
                 sx={{ p: 0 }}
                 onClick={() => {

src/pages/ViewPublicationPage/questions/Images.tsx

@@ -102,10 +102,14 @@ export const Images = ({ currentQuestion }: ImagesProps) => {
               <FormControlLabel
                 key={variant.id}
                 sx={{
-                  display: "block",
                   textAlign: "center",
                   color: theme.palette.text.primary,
                   marginTop: "10px",
+                  marginLeft: 0,
+                  padding: "10px",
+                  "& .MuiFormControlLabel-label": {
+                    wordBreak: "break-word",
+                  },
                 }}
                 value={index}
                 control={

src/pages/ViewPublicationPage/questions/Variant.tsx

@@ -117,11 +117,17 @@ export const Variant = ({ currentQuestion }: VariantProps) => {
             )}
           </Box>
         </Group>
-        {currentQuestion.content.back && currentQuestion.content.back !== " " && (
+        {currentQuestion.content.back &&
+          currentQuestion.content.back !== " " && (
             <Box sx={{ maxWidth: "400px", width: "100%", height: "300px" }}>
               <img
                 src={currentQuestion.content.back}
-              style={{ width: "100%", height: "100%", objectFit: "cover", margin: "10px" }}
+                style={{
+                  width: "100%",
+                  height: "100%",
+                  objectFit: "cover",
+                  margin: "10px",
+                }}
                 alt=""
               />
             </Box>
@@ -163,6 +169,9 @@ const VariantItem = ({
         "&.MuiFormControl-root": {
           width: "100%",
         },
+        "& .MuiFormControlLabel-label": {
+          wordBreak: "break-word",
+        },
       }}
       value={index}
       labelPlacement="start"

src/pages/ViewPublicationPage/questions/Varimg.tsx

@@ -89,6 +89,9 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
                       : "#9A9AAF",
                   display: "flex",
                   margin: isMobile ? 0 : undefined,
+                  "& .MuiFormControlLabel-label": {
+                    wordBreak: "break-word",
+                  },
                 }}
                 value={index}
                 onClick={(event) => {
@@ -138,7 +141,10 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
               style={{ width: "100%", height: "100%", objectFit: "cover" }}
               alt=""
             />
-            ) : (currentQuestion.content.replText !== " " && currentQuestion.content.replText.length > 0) ? currentQuestion.content.replText : variant?.extendedText || isMobile ? (
+          ) : currentQuestion.content.replText !== " " &&
+            currentQuestion.content.replText.length > 0 ? (
+            currentQuestion.content.replText
+          ) : variant?.extendedText || isMobile ? (
             "Выберите вариант ответа ниже"
           ) : (
             "Выберите вариант ответа слева"

src/pages/createQuize/MyQuizzesFull.tsx

@@ -76,13 +76,22 @@ export default function MyQuizzesFull({
             }}
           >
             {quizes.map((quiz) => {
-              return <QuizCard
+              return (
+                <QuizCard
                   key={quiz.id}
                   quiz={quiz}
                   openCount={quiz.sessions_count}
                   applicationCount={quiz.passed_count}
-                conversionPercent={quiz.sessions_count ? (quiz.passed_count/quiz.sessions_count * 100).toFixed(1) : 0}
+                  conversionPercent={
+                    quiz.sessions_count
+                      ? (
+                          (quiz.passed_count / quiz.sessions_count) *
+                          100
+                        ).toFixed(1)
+                      : 0
+                  }
                 />
+              );
             })}
           </Box>
           {children}

src/pages/startPage/EditPage.tsx

@@ -107,7 +107,7 @@ export default function EditPage({
   const isConditionMet =
     [1].includes(currentStep) && quizConfig.type !== "form";
 
-    console.log(quiz)
+  console.log(quiz);
   return (
     <>
       <Box

src/ui_kit/MediaSelectionAndDisplay.tsx

@@ -219,7 +219,7 @@ export const MediaSelectionAndDisplay: FC<Iprops> = ({ resultData }) => {
             />
           </ButtonBase>
           {resultData.content.video ? (
-            <video src={resultData.content.video} width="400" controls />
+            <video src={resultData.content.video} width="300" controls />
           ) : null}
         </>
       )}

src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Emoji.tsx

@@ -58,7 +58,6 @@ export default function Emoji({ question }: Props) {
                 overflow: "hidden",
                 maxWidth: "317px",
                 width: "100%",
-                height: "255px",
               }}
             >
               <Box
@@ -110,7 +109,9 @@ export default function Emoji({ question }: Props) {
                     sx={{ display: "flex", alignItems: "center", gap: 2 }}
                     data-cy="variant-answer"
                   >
-                    <Typography>{`${variant.answer}`}</Typography>
+                    <Typography
+                      sx={{ wordBreak: "break-word" }}
+                    >{`${variant.answer}`}</Typography>
                     {variant.hints && (
                       <Tooltip title="Подсказка" placement="right">
                         <Box>

src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Images.tsx

@@ -104,7 +104,9 @@ export default function Images({ question, widthPreview }: Props) {
                   p: 1,
                 }}
               >
-                <Typography>{variant.answer}</Typography>
+                <Typography sx={{ wordBreak: "break-word" }}>
+                  {variant.answer}
+                </Typography>
                 {variant.hints && (
                   <Tooltip title={variant.hints} placement="right">
                     <Box>

src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Variant.tsx

@@ -81,6 +81,9 @@ export default function Variant({ question }: Props) {
                   : theme.palette.background.default,
                 width: "100%",
                 margin: 0,
+                // "& .MuiFormControlLabel-label": {
+                //     overflow: "hidden",
+                // }
               }}
               control={
                 question.content.multi ? (
@@ -107,7 +110,12 @@ export default function Variant({ question }: Props) {
               }
               label={
                 <Box sx={{ display: "flex", alignItems: "center", gap: 2 }}>
-                  <Typography color={theme.palette.text.primary}>
+                  <Typography
+                    color={theme.palette.text.primary}
+                    sx={{
+                      wordBreak: "break-word",
+                    }}
+                  >
                     {variant.answer}
                   </Typography>
                   {variant.hints && (

src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Varimg.tsx

@@ -122,7 +122,9 @@ export default function Varimg({ question, widthPreview }: Props) {
                   }
                   label={
                     <Box sx={{ display: "flex", alignItems: "center", gap: 2 }}>
-                      <Typography>{variant.answer}</Typography>
+                      <Typography sx={{ wordBreak: "break-word" }}>
+                        {variant.answer}
+                      </Typography>
                       {variant.hints && (
                         <Tooltip title={variant.hints} placement="right">
                           <Box>