Merge branch 'dev' into 'staging'

Dev

See merge request frontend/squzanswerer!105

lib/components/ViewPublicationPage/ContactForm.tsx

@@ -17,15 +17,15 @@ import {
 import CustomCheckbox from "@ui_kit/CustomCheckbox";
 import { FC, useRef, useState } from "react";
 
+import { DESIGN_LIST } from "@/utils/designList";
 import { sendFC } from "@api/quizRelase";
+import { useQuizData } from "@contexts/QuizDataContext";
 import { NameplateLogo } from "@icons/NameplateLogo";
 import { QuizQuestionResult } from "@model/questionTypes/result";
 import { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
 import { quizThemes } from "@utils/themes/Publication/themePublication";
 import { enqueueSnackbar } from "notistack";
 import { useRootContainerSize } from "../../contexts/RootContainerWidthContext";
-import {useQuizData} from "@contexts/QuizDataContext";
-import { DESIGN_LIST } from "@/utils/designList";
 
 
 const TextField = MuiTextField as unknown as FC<TextFieldProps>; // temporary fix ts(2590)
@@ -68,7 +68,7 @@ export const ContactForm = ({currentQuestion, onShowResult}: Props) => {
         });
 
     if (!resultQuestion) throw new Error("Result question not found");
-    console.log("yfcnhjqrb", settings.cfg.resultInfo.showResultForm)
+
     const inputHC = async () => {
         const FC = settings.cfg.formContact.fields || settings.cfg.formContact;
         const body = {} as any;
@@ -110,7 +110,7 @@ export const ContactForm = ({currentQuestion, onShowResult}: Props) => {
     const isWide = Object.keys(filteredFC).length > 2;
 
     async function handleShowResultsClick() {
-        const FC: any = settings.cfg.formContact.fields
+        const FC: any = settings.cfg.formContact.fields;
         if (FC["email"].used !== EMAIL_REGEXP.test(email)) {
             return enqueueSnackbar("введена некорректная почта");
         }
@@ -170,7 +170,9 @@ export const ContactForm = ({currentQuestion, onShowResult}: Props) => {
                 backgroundPosition: "center",
                 backgroundSize: "cover",
                 backgroundImage: settings.cfg.design && !isMobile
+                    ? quizThemes[settings.cfg.theme].isLight
                         ? `url(${DESIGN_LIST[settings.cfg.theme]})`
+                        : `linear-gradient(90deg, #272626, transparent), url(${DESIGN_LIST[settings.cfg.theme]})`
                     : null,
             }}
         >
@@ -181,11 +183,7 @@ export const ContactForm = ({currentQuestion, onShowResult}: Props) => {
                     height: "100%",
                     minHeight: "100%",
                     display: isWide && !isMobile ? "flex" : undefined,
-                    background: settings.cfg.design && !isMobile
+                    background: settings.cfg.design && !isMobile ? undefined : theme.palette.background.default,
-                        ? quizThemes[settings.cfg.theme].isLight
-                            ? "transparent"
-                            : "linear-gradient(90deg,#272626, transparent)"
-                        : theme.palette.background.default,
                 }}
             >
                 <Box
@@ -378,7 +376,7 @@ const Inputs = ({
     const FC = settings.cfg.formContact.fields;
 
     if (!FC) return null;
-    console.log(email)
+    console.log(email);
     const Name = (
         <CustomInput
             onChange={({ target }) => setName(target.value)}
@@ -450,7 +448,7 @@ const CustomInput = ({title, desc, Icon, onChange, id}: {
     id: string;
     title: string;
     desc: string;
-    Icon: FC<{ color: string; backgroundColor: string }>;
+    Icon: FC<{ color: string; backgroundColor: string; }>;
     onChange: TextFieldProps["onChange"];
 }) => {
     const theme = useTheme();

lib/components/ViewPublicationPage/ResultForm.tsx

@@ -38,7 +38,6 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                 height: "100%",
                 minHeight: "100%",
                 width: "100%",
-                overflow: "auto",
                 backgroundColor: theme.palette.background.default,
                 backgroundPosition: "center",
                 backgroundSize: "cover",
@@ -55,8 +54,9 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                     justifyContent: "space-between",
                     alignItems: "center",
                     pt: "30px",
-                    width: "inherit",
+                    width: "100%",
-                    height: "inherit",
+                    height: "100%",
+                    overflow: "auto",
                     background: settings.cfg.design && !isMobile
                         ? quizThemes[settings.cfg.theme].isLight
                             ? "transparent"
@@ -87,10 +87,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
                     <Typography
                         sx={{
                             fontSize: "14px",
-                            color:
+                            color: theme.palette.text.primary,
-                                settings.cfg.startpageType === "expanded"
-                                    ? "white"
-                                    : theme.palette.text.primary,
                             wordBreak: "break-word",
                         }}
                     >

lib/components/ViewPublicationPage/StartPageViewPublication/StartPageDesktop.tsx

@@ -55,6 +55,7 @@ const StandartLayout = ({
                     justifyContent: "space-between",
                     alignItems: "flex-start",
                     p: "25px",
+                    overflowY: "auto",
                     background:
                         settings.cfg.design && !quizThemes[settings.cfg.theme].isLight
                             ? "linear-gradient(90deg,#272626,transparent)"

lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx

@@ -140,7 +140,8 @@ const ExpandedMobileLayout = ({
         left: 0,
         top: 0,
         width: "100%",
-        minHeight: "100%",
+        height: "100%",
+        // minHeight: "100%",
         overflow: "hidden",
         "& > img": {
           display: "block",

lib/components/ViewPublicationPage/questions/Emoji.tsx

@@ -168,11 +168,12 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => {
                                         variant.answer.length <= 60 ? "center" : "flex-start",
                                     position: "relative",
                                     height: "80px",
+                                    justifyContent: "center",
                                     "& .MuiFormControlLabel-label": {
                                         wordBreak: "break-word",
                                         height: variant.answer.length <= 60 ? undefined : "60px",
                                         overflow: "auto",
-                                        paddingLeft: "45px",
+                                        // paddingLeft: "45px",
                                         "&::-webkit-scrollbar": {
                                             width: "4px",
                                         },

lib/components/ViewPublicationPage/questions/Rating.tsx

@@ -83,7 +83,6 @@ export const Rating = ({ currentQuestion }: RatingProps) => {
                     gap: "20px",
                     marginTop: "20px",
                     flexDirection: "column",
-                    width: isMobile ? "100%" : undefined,
                 }}
             >
                 <Box
@@ -116,9 +115,9 @@ export const Rating = ({ currentQuestion }: RatingProps) => {
                         }}
                         sx={{
                             height: "50px",
-                            gap: isMobile ? undefined : "15px",
                             opacity: "1!important",
-                            "& .MuiRating-root.Mui-disabled": { opacity: "1!important" }
+                            "& .MuiRating-root.Mui-disabled": { opacity: "1!important" },
+                            "& .MuiRating-icon": {mr: isMobile ? undefined : "15px"}
                         }}
                         max={currentQuestion.content.steps}
                         icon={form?.icon(theme.palette.primary.main, isMobile ? 30 : isTablet ? 40 : 50)}
@@ -135,7 +134,6 @@ export const Rating = ({ currentQuestion }: RatingProps) => {
                 >
                     <Typography sx={{
                         color: "#9A9AAF"
-                        // color: theme.palette.grey2.main
                     }}>
                         {currentQuestion.content.ratingNegativeDescription}
                     </Typography>

lib/components/ViewPublicationPage/questions/Varimg.tsx

@@ -105,6 +105,7 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
                                             : "#9A9AAF",
                                     display: "flex",
                                     margin: 0,
+                                    justifyContent: "space-between",
                                     "&:hover": { borderColor: theme.palette.primary.main },
                                     "& .MuiFormControlLabel-label": {
                                         wordBreak: "break-word",

lib/utils/designList.ts

@@ -1,27 +1,17 @@
 import type { QuizTheme } from "@model/settingsData";
-import Desgin1 from "@icons/designs/design1.jpg";
-import Desgin2 from "@icons/designs/design2.jpg";
-import Desgin3 from "@icons/designs/design3.jpg";
-import Desgin4 from "@icons/designs/design4.jpg";
-import Desgin5 from "@icons/designs/design5.jpg";
-import Desgin6 from "@icons/designs/design6.jpg";
-import Desgin7 from "@icons/designs/design7.jpg";
-import Desgin8 from "@icons/designs/design8.jpg";
-import Desgin9 from "@icons/designs/design9.jpg";
-import Desgin10 from "@icons/designs/design10.jpg";
 
 
 export const DESIGN_LIST: Record<QuizTheme, string> = {
-    Design1: Desgin1,
+    Design1: "https://s.hbpn.link/designs/design1.jpg",
-    Design2: Desgin2,
+    Design2: "https://s.hbpn.link/designs/design2.jpg",
-    Design3: Desgin3,
+    Design3: "https://s.hbpn.link/designs/design3.jpg",
-    Design4: Desgin4,
+    Design4: "https://s.hbpn.link/designs/design4.jpg",
-    Design5: Desgin5,
+    Design5: "https://s.hbpn.link/designs/design5.jpg",
-    Design6: Desgin6,
+    Design6: "https://s.hbpn.link/designs/design6.jpg",
-    Design7: Desgin7,
+    Design7: "https://s.hbpn.link/designs/design7.jpg",
-    Design8: Desgin8,
+    Design8: "https://s.hbpn.link/designs/design8.jpg",
-    Design9: Desgin9,
+    Design9: "https://s.hbpn.link/designs/design9.jpg",
-    Design10: Desgin10,
+    Design10: "https://s.hbpn.link/designs/design10.jpg",
     StandardTheme: "",
     StandardDarkTheme: "",
     PinkTheme: "",

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@frontend/squzanswerer",
-    "version": "1.0.21",
+    "version": "1.0.23",
     "type": "module",
     "main": "./dist-package/index.js",
     "module": "./dist-package/index.js",

src/App.tsx

@@ -3,7 +3,7 @@ import { useParams } from "react-router-dom";
 import QuizAnswerer from "../lib/components/QuizAnswerer";
 
 // const defaultQuizId = "45ef7f9c-784d-4e58-badb-f6b337f08ba0"; // branching
-const defaultQuizId = "0c568ac9-d176-491b-b6cd-5afd31254951"; //looooong header
+const defaultQuizId = "3c49550d-8c77-4788-bc2d-42586a261514"; //looooong header
 // const defaultQuizId = "ad7f5a87-b833-4f5b-854e-453706ed655c"; // linear
 
 export default function App() {