ограничения и перенос для заголовков и юр информации
This commit is contained in:
parent
5106fab97d
commit
92ec43c651
@ -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() {
|
||||
|
@ -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)",
|
||||
|
@ -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>
|
||||
|
@ -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}
|
||||
|
@ -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: "Принимает документы" },
|
||||
|
@ -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(
|
||||
|
@ -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 ? (
|
||||
"Выберите вариант ответа ниже"
|
||||
) : (
|
||||
|
Loading…
Reference in New Issue
Block a user