ограничения и перенос для заголовков и юр информации

src/App.tsx

@@ -5,7 +5,8 @@ import QuizAnswerer from "./QuizAnswerer";
 import { QuizIdContext } from "./contexts/QuizIdContext";
 import { RootContainerWidthContext } from "./contexts/RootContainerWidthContext";
 
-const defaultQuizId = "45ef7f9c-784d-4e58-badb-f6b337f08ba0"; // branching
+// const defaultQuizId = "45ef7f9c-784d-4e58-badb-f6b337f08ba0"; // branching
+const defaultQuizId = "48471ba0-a639-4be2-91e3-50149c4b73af"; //looooong header
 // const defaultQuizId = "a9d31460-132a-4479-a3f0-90241498b6f9"; // linear
 
 export default function App() {

src/pages/ViewPublicationPage/Question.tsx

@@ -43,7 +43,7 @@ export const Question = ({
     return (
         <Box sx={{
             backgroundColor: theme.palette.background.default,
-            height: isMobile ? undefined : "100%"
+            height: isMobile ? "100%" : "100vh"
         }}>
             <Box sx={{
                 height: "calc(100% - 75px)",

src/pages/ViewPublicationPage/ResultForm.tsx

@@ -77,6 +77,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                                 fontWeight: 700,
                                 m: "20px 0",
                                 color: theme.palette.text.primary,
+                                wordBreak: "break-word"
                             }}
                         >
                             {resultQuestion.description}
@@ -87,6 +88,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                     sx={{
                         m: "20px 0",
                         color: theme.palette.text.primary,
+                        wordBreak: "break-word"
                     }}
                 >
                     {resultQuestion.title}
@@ -99,6 +101,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                             sx={{
                                 fontSize: "18px",
                                 m: "20px 0",
+                                wordBreak: "break-word",
                                 color: theme.palette.text.primary,
                             }}
                         >
@@ -162,7 +165,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                             variant="contained"
                             sx={{
                                 p: "10px 20px",
-                                width: "210px",
+                                width: "auto",
                                 height: "50px",
                             }}
                         >
@@ -174,7 +177,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                             <Button
                                 href={resultQuestion.content.redirect}
                                 variant="contained"
-                                sx={{ p: "10px 20px", width: "210px", height: "50px" }}
+                                sx={{ p: "10px 20px", width: "auto", height: "50px" }}
                             >
                                 {resultQuestion.content.hint.text || "Перейти на сайт"}
                             </Button>

src/pages/ViewPublicationPage/StartPageViewPublication.tsx

@@ -116,7 +116,15 @@ export const StartPageViewPublication = () => {
                             >{settings.cfg.info.orgname}</Typography>
                         </Box>
                         <Link mb="16px" href={settings.cfg.info.site}>
-                            <Typography sx={{ fontSize: "16px", color: theme.palette.primary.main }}>
+                            <Typography
+                                sx={{
+                                    fontSize: "16px",
+                                    color: theme.palette.primary.main,
+                                    overflow: "hidden",
+                                    textOverflow: "ellipsis",
+                                    whiteSpace: "nowrap",
+                                    maxWidth: "300px"
+                                }}>
                                 {settings.cfg.info.site}
                             </Typography>
                         </Link>
@@ -189,7 +197,7 @@ export const StartPageViewPublication = () => {
                                 alignItems: "center",
                                 justifyContent: "space-between",
                                 width: "100%",
-                                flexDirection: isMobile ? "column" : "row"
+                                flexDirection: "column"
                             }}
                         >
                             <Box sx={{ maxWidth: "300px" }}>
@@ -215,7 +223,10 @@ export const StartPageViewPublication = () => {
                                 <Typography sx={{
                                     width: "100%",
                                     overflowWrap: "break-word",
-                                    fontSize: "12px", textAlign: "end",
+                                    fontSize: "12px",
+                                    textAlign: "end",
+                                    maxHeight: "120px",
+                                    overflow: "auto",
                                     color:
                                         settings.cfg.startpageType === "expanded" && !isMobile
                                             ? "white"
@@ -284,7 +295,9 @@ function QuizPreviewLayoutByType({
                         justifyContent: "space-between",
                         alignItems: "flex-start",
                         p: "25px",
-                        height: "80%"
+                        height: "80%",
+                        overflowY: "auto",
+                        overflowX: "hidden"
                     }}
                 >
                     {quizHeaderBlock}

src/pages/ViewPublicationPage/questions/File.tsx

@@ -109,7 +109,7 @@ const UPLOAD_FILE_DESCRIPTIONS_MAP: Record<
     },
     video: {
         title: "Добавить видео",
-        description: "Принимает .mp4 и .mov формат — максимум 100мб",
+        description: "Принимает .mp4 и .mov формат — максимум 50мб",
     },
     audio: { title: "Добавить аудиофайл", description: "Принимает аудиофайлы" },
     document: { title: "Добавить документ", description: "Принимает документы" },

src/pages/ViewPublicationPage/questions/Variant.tsx

@@ -8,7 +8,7 @@ import {
     TextField as MuiTextField,
     Typography,
     useTheme,
-    TextFieldProps,
+    TextFieldProps, useMediaQuery,
 } from "@mui/material";
 import { FC, useEffect } from "react";
 
@@ -48,6 +48,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(
@@ -68,7 +69,8 @@ export const Variant = ({ currentQuestion }: VariantProps) => {
     return (
         <Box>
             <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.toString()}
                     value={currentQuestion.content.variants.findIndex(

src/pages/ViewPublicationPage/questions/Varimg.tsx

@@ -77,7 +77,10 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
                                     display: "flex",
                                     margin: isMobile ? 0 : undefined,
                                     "& .MuiFormControlLabel-label": {
-                                        wordBreak: "break-word"
+                                        wordBreak: "break-word",
+                                        height: variant.answer.length <= 60 ? undefined : "60px",
+                                        overflow: "auto",
+                                        paddingLeft: "45px",
                                     }
                                 }}
                                 value={index}
@@ -153,6 +156,12 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
                         ) : (
                             <BlankImage />
                         )
+                    ) : currentQuestion.content.back !== " " ? (
+                        <img
+                            src={currentQuestion.content.back}
+                            style={{ width: "100%", height: "100%", objectFit: "cover" }}
+                            alt=""
+                        />
                     ) : (currentQuestion.content.replText !== " " && currentQuestion.content.replText.length > 0) ? currentQuestion.content.replText : variant?.extendedText || isMobile ? (
                         "Выберите вариант ответа ниже"
                     ) : (