From 78204a4b76a2cd93e75c114137963cb25d7e9695 Mon Sep 17 00:00:00 2001
From: Tamara <tamara.zelenko555@yandex.ru>
Date: Sun, 7 Jan 2024 22:32:15 +0300
Subject: [PATCH] =?UTF-8?q?=D1=80=D0=B0=D1=81=D1=88=D0=B8=D1=80=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=B8=D0=B5=20=D0=B1=D0=BB=D0=BE=D0=BA=D0=BE=D0=B2=20?=
 =?UTF-8?q?=D0=B8=20=D0=BF=D0=B5=D1=80=D0=B5=D0=BD=D0=BE=D1=81=20=D1=81?=
 =?UTF-8?q?=D0=BB=D0=BE=D0=B2=20=D0=BF=D1=80=D0=B8=20=D0=B4=D0=BB=D0=B8?=
 =?UTF-8?q?=D0=BD=D0=BD=D1=8B=D1=85=20=D0=BE=D1=82=D0=B2=D0=B5=D1=82=D0=B0?=
 =?UTF-8?q?=D1=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ViewPublicationPage/questions/Emoji.tsx   |  2 +-
 .../ViewPublicationPage/questions/File.tsx    | 23 +++++++++++++------
 .../ViewPublicationPage/questions/Images.tsx  |  6 ++++-
 .../ViewPublicationPage/questions/Variant.tsx |  3 +++
 .../ViewPublicationPage/questions/Varimg.tsx  |  3 +++
 5 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/pages/ViewPublicationPage/questions/Emoji.tsx b/src/pages/ViewPublicationPage/questions/Emoji.tsx
index aa723b0..d8b82b3 100644
--- a/src/pages/ViewPublicationPage/questions/Emoji.tsx
+++ b/src/pages/ViewPublicationPage/questions/Emoji.tsx
@@ -152,7 +152,7 @@ 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>
                   }
                 />
diff --git a/src/pages/ViewPublicationPage/questions/File.tsx b/src/pages/ViewPublicationPage/questions/File.tsx
index a625d7b..d2922bd 100644
--- a/src/pages/ViewPublicationPage/questions/File.tsx
+++ b/src/pages/ViewPublicationPage/questions/File.tsx
@@ -1,9 +1,9 @@
 import {
-  Box,
-  Typography,
-  ButtonBase,
-  useTheme,
-  IconButton,
+    Box,
+    Typography,
+    ButtonBase,
+    useTheme,
+    IconButton, useMediaQuery,
 } from "@mui/material";
 import { useQuizViewStore, updateAnswer } from "@root/quizView/store";
 import { UPLOAD_FILE_TYPES_MAP } from "../tools/File";
@@ -47,6 +47,7 @@ export const File = ({ currentQuestion }: FileProps) => {
     ({ questionId }) => questionId === currentQuestion.id
   )?.answer as string;
   const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down(500));
   const uploadFile = async ({ target }: ChangeEvent<HTMLInputElement>) => {
     const file = target.files?.[0];
     if (file) {
@@ -98,10 +99,18 @@ 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={() => {
@@ -129,7 +138,7 @@ export const File = ({ currentQuestion }: FileProps) => {
               }
               sx={{
                 width: "100%",
-                height: "120px",
+                height: isMobile ? undefined : "120px",
                 display: "flex",
                 gap: "50px",
                 justifyContent: "flex-start",
diff --git a/src/pages/ViewPublicationPage/questions/Images.tsx b/src/pages/ViewPublicationPage/questions/Images.tsx
index 45562f7..0ecb933 100644
--- a/src/pages/ViewPublicationPage/questions/Images.tsx
+++ b/src/pages/ViewPublicationPage/questions/Images.tsx
@@ -127,10 +127,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={
diff --git a/src/pages/ViewPublicationPage/questions/Variant.tsx b/src/pages/ViewPublicationPage/questions/Variant.tsx
index 041501e..0926ce1 100644
--- a/src/pages/ViewPublicationPage/questions/Variant.tsx
+++ b/src/pages/ViewPublicationPage/questions/Variant.tsx
@@ -158,6 +158,9 @@ const VariantItem = ({
         "&.MuiFormControl-root": {
           width: "100%",
         },
+        "& .MuiFormControlLabel-label": {
+          wordBreak: "break-word"
+        }
       }}
       value={index}
       labelPlacement="start"
diff --git a/src/pages/ViewPublicationPage/questions/Varimg.tsx b/src/pages/ViewPublicationPage/questions/Varimg.tsx
index 1d181ed..d62d936 100644
--- a/src/pages/ViewPublicationPage/questions/Varimg.tsx
+++ b/src/pages/ViewPublicationPage/questions/Varimg.tsx
@@ -75,6 +75,9 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
                   borderColor: answer === variant.id ? theme.palette.primary.main : "#9A9AAF",
                   display: "flex",
                   margin: isMobile ? 0 : undefined,
+                  "& .MuiFormControlLabel-label": {
+                      wordBreak: "break-word"
+                  }
                 }}
                 value={index}
                 onClick={async(event) => {