From 8a4230733a698c6ca22450a29bbba124aae978e1 Mon Sep 17 00:00:00 2001 From: Tamara Date: Tue, 9 Jan 2024 19:17:10 +0300 Subject: [PATCH] =?UTF-8?q?=D1=81=D0=B5=D0=BB=D0=B5=D0=BA=D1=82=D1=8B=20?= =?UTF-8?q?=D0=BA=D1=80=D0=B0=D1=81=D0=B8=D0=B2=D0=BE=20=D1=81=D0=BA=D1=80?= =?UTF-8?q?=D1=8B=D0=B2=D0=B0=D1=8E=D1=82=20=D0=BF=D0=B5=D1=80=D0=B5=D0=BF?= =?UTF-8?q?=D0=BE=D0=BB=D0=BD=D0=B5=D0=BD=D0=B8=D0=B5,=20=D1=86=D0=B2?= =?UTF-8?q?=D0=B5=D1=82=D0=B0=20=D1=82=D0=B5=D0=BA=D1=81=D1=82=D0=B0=20?= =?UTF-8?q?=D0=BD=D0=B0=20=D0=BF=D1=80=D0=B5=D0=B2=D1=8C=D1=8E=20=D0=B8=20?= =?UTF-8?q?=D1=82=D0=B5=D0=BD=D1=8C,=20=D1=81=D0=BA=D1=80=D1=8B=D1=82?= =?UTF-8?q?=D0=B8=D0=B5=20=D1=81=D0=BA=D1=80=D0=BE=D0=BB=D0=BB=D0=B1=D0=B0?= =?UTF-8?q?=D1=80=D0=B0=20=D0=B2=D0=BE=20=D0=B2=D1=81=D0=B5=D0=BC=20=D0=BF?= =?UTF-8?q?=D1=80=D0=BE=D0=B5=D0=BA=D1=82=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.css | 8 +++ src/pages/Questions/Select.tsx | 5 +- src/ui_kit/QuizPreview/QuizPreview.tsx | 1 + src/ui_kit/QuizPreview/QuizPreviewLayout.tsx | 10 ++-- .../QuizPreviewQuestionTypes/Select.tsx | 10 ++-- .../StartPagePreview/QuizPreviewLayout.tsx | 51 +++++++++++++++++-- src/ui_kit/StartPagePreview/index.tsx | 1 + 7 files changed, 70 insertions(+), 16 deletions(-) diff --git a/src/index.css b/src/index.css index fcc6de79..6e773876 100755 --- a/src/index.css +++ b/src/index.css @@ -6,6 +6,14 @@ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } +/*скрывает все скролл-бары*/ +body * { + -ms-overflow-style: none; + scrollbar-width: none; +} +body * ::-webkit-scrollbar { + display: none; +} code { font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", diff --git a/src/pages/Questions/Select.tsx b/src/pages/Questions/Select.tsx index daef5673..19d04a3a 100644 --- a/src/pages/Questions/Select.tsx +++ b/src/pages/Questions/Select.tsx @@ -116,10 +116,10 @@ export const Select = ({ inputProps={{ sx: { color: colorMain, - display: "flex", - alignItems: "center", + display: "block", px: "9px", gap: "20px", + width: "90%", }, }} IconComponent={(props) => } @@ -135,6 +135,7 @@ export const Select = ({ padding: "10px", borderRadius: "5px", color: colorPlaceholder, + whiteSpace: "normal", }} > {item} diff --git a/src/ui_kit/QuizPreview/QuizPreview.tsx b/src/ui_kit/QuizPreview/QuizPreview.tsx index 91fd06a7..d0ea20c0 100644 --- a/src/ui_kit/QuizPreview/QuizPreview.tsx +++ b/src/ui_kit/QuizPreview/QuizPreview.tsx @@ -116,6 +116,7 @@ export default function QuizPreview() { style={{ overflow: "hidden", pointerEvents: "auto", + boxShadow: "0px 5px 10px 2px rgba(34, 60, 80, 0.2)", }} cancel=".cancel" > diff --git a/src/ui_kit/QuizPreview/QuizPreviewLayout.tsx b/src/ui_kit/QuizPreview/QuizPreviewLayout.tsx index f2095dc7..f2df0e5d 100644 --- a/src/ui_kit/QuizPreview/QuizPreviewLayout.tsx +++ b/src/ui_kit/QuizPreview/QuizPreviewLayout.tsx @@ -165,12 +165,12 @@ export default function QuizPreviewLayout() { inputProps={{ sx: { color: theme.palette.primary.main, - display: "flex", - alignItems: "center", + display: "block", px: "9px", gap: "20px", - width: "90%", - paddingRight: 0 + width: "87%", + overflow: "hidden", + textOverflow: "ellipsis", }, }} IconComponent={ArrowDownTheme} @@ -188,7 +188,7 @@ export default function QuizPreviewLayout() { borderRadius: "5px", color: "#9A9AAF", wordBreak: "break-word", - whiteSpace: "pre-wrap", + whiteSpace: "normal", }} > {`${index + 1}. ${title}`} diff --git a/src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Select.tsx b/src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Select.tsx index 1ea11eed..ce436caf 100644 --- a/src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Select.tsx +++ b/src/ui_kit/QuizPreview/QuizPreviewQuestionTypes/Select.tsx @@ -80,6 +80,7 @@ export default function Text({ question }: Props) { display: "flex", flexDirection: "column", gap: "8px", + maxWidth: "330px", "& .Mui-selected": { backgroundColor: theme.palette.background.default, color: theme.palette.primary.main, @@ -90,12 +91,12 @@ export default function Text({ question }: Props) { inputProps={{ sx: { color: theme.palette.primary.main, - display: "flex", - alignItems: "center", + display: "block", px: "9px", gap: "20px", - width: "90%", paddingLeft: "10px", + overflow: "hidden", + textOverflow: "ellipsis", "& + input": !selectValue && { backgroundColor: theme.palette.background.default, border: "none", @@ -107,7 +108,7 @@ export default function Text({ question }: Props) { overflow: "hidden", textOverflow: "ellipsis", paddingLeft: "10px", - width: "90%", + width: "88%", }, }, }} @@ -127,6 +128,7 @@ export default function Text({ question }: Props) { p: "4px", borderRadius: "5px", color: "#9A9AAF", + whiteSpace: "normal", }} > {variant.answer} diff --git a/src/ui_kit/StartPagePreview/QuizPreviewLayout.tsx b/src/ui_kit/StartPagePreview/QuizPreviewLayout.tsx index a19f7f6c..8ba4b945 100644 --- a/src/ui_kit/StartPagePreview/QuizPreviewLayout.tsx +++ b/src/ui_kit/StartPagePreview/QuizPreviewLayout.tsx @@ -22,6 +22,7 @@ export default function QuizPreviewLayout() { const quiz = useCurrentQuiz(); const mode = modes; const { isMobileDevice } = useUADevice(); + const isMobile = useMediaQuery(theme.breakpoints.down(600)); if (!quiz) return null; @@ -84,7 +85,15 @@ export default function QuizPreviewLayout() { alt="" /> )} - + {quiz.config.info.orgname} @@ -105,8 +114,26 @@ export default function QuizPreviewLayout() { : "start", }} > - {quiz.name} - + + {quiz.name} + + {quiz.config.startpage.description} @@ -150,12 +177,26 @@ export default function QuizPreviewLayout() { ) ) : ( {quiz.config.info.phonenumber} )} - + {quiz.config.info.law} diff --git a/src/ui_kit/StartPagePreview/index.tsx b/src/ui_kit/StartPagePreview/index.tsx index 0a304d06..8f09346f 100644 --- a/src/ui_kit/StartPagePreview/index.tsx +++ b/src/ui_kit/StartPagePreview/index.tsx @@ -123,6 +123,7 @@ export const StartPagePreview = () => { overflow: "hidden", pointerEvents: "auto", borderRadius: "5px", + backgroundColor: theme.palette.background.default, boxShadow: "0px 5px 10px 2px rgba(34, 60, 80, 0.2)", }} >