diff --git a/lib/assets/icons/PenaLogo.png b/lib/assets/icons/PenaLogo.png
new file mode 100644
index 0000000..b1a6b60
Binary files /dev/null and b/lib/assets/icons/PenaLogo.png differ
diff --git a/lib/components/ViewPublicationPage/StartPageViewPublication.tsx b/lib/components/ViewPublicationPage/StartPageViewPublication.tsx
index 4c7c72c..fa5c5c8 100644
--- a/lib/components/ViewPublicationPage/StartPageViewPublication.tsx
+++ b/lib/components/ViewPublicationPage/StartPageViewPublication.tsx
@@ -1,4 +1,12 @@
-import { Box, Button, ButtonBase, Link, Paper, Typography, useTheme } from "@mui/material";
+import {
+ Box,
+ Button,
+ ButtonBase,
+ Link,
+ Paper,
+ Typography,
+ useTheme,
+} from "@mui/material";
import { useUADevice } from "../../utils/hooks/useUADevice";
import { notReachable } from "../../utils/notReachable";
import YoutubeEmbedIframe from "./tools/YoutubeEmbedIframe";
@@ -10,485 +18,559 @@ import { quizThemes } from "@utils/themes/Publication/themePublication";
import { useRootContainerSize } from "../../contexts/RootContainerWidthContext";
import { setCurrentQuizStep } from "@stores/quizView";
+import PenaLogo from "@icons/PenaLogo.png";
export const StartPageViewPublication = () => {
- const theme = useTheme();
- const { settings } = useQuizData();
- const { isMobileDevice } = useUADevice();
- const isMobile = useRootContainerSize() < 650;
- const isTablet = useRootContainerSize() < 800;
+ const theme = useTheme();
+ const { settings } = useQuizData();
+ const { isMobileDevice } = useUADevice();
+ const isMobile = useRootContainerSize() < 650;
+ const isTablet = useRootContainerSize() < 800;
- const handleCopyNumber = () => {
- navigator.clipboard.writeText(settings.cfg.info.phonenumber);
- };
- console.log(settings.cfg.startpage.background.type);
+ const handleCopyNumber = () => {
+ navigator.clipboard.writeText(settings.cfg.info.phonenumber);
+ };
+ console.log(settings.cfg.startpage.background.type);
- const background =
- settings.cfg.startpage.background.type === "image" ? (
- settings.cfg.startpage.background.desktop ? (
- 
- ) : null
- ) : settings.cfg.startpage.background.type === "video" ? (
- settings.cfg.startpage.background.video ? (
-
- ) : null
- ) : null;
+ const background =
+ settings.cfg.startpage.background.type === "image" ? (
+ settings.cfg.startpage.background.desktop ? (
+
+ ) : null
+ ) : settings.cfg.startpage.background.type === "video" ? (
+ settings.cfg.startpage.background.video ? (
+
+ ) : null
+ ) : null;
- return (
-
+
+
+ 
+
-
-
- {settings.cfg.startpage.logo && (
- 
- )}
- {settings.cfg.info.orgname}
-
-
-
- {settings.cfg.info.site}
-
-
-
+ ? "white"
+ : theme.palette.text.primary,
+ wordBreak: "break-word",
+ }}
+ >
+ {settings.cfg.info.orgname}
+
+
+
+ }
+ quizMainBlock={
+ <>
+
+
+ {settings.name}
+
+
+ {settings.cfg.startpage.description}
+
+
-
-
- {settings.name}
-
-
- {settings.cfg.startpage.description}
-
-
-
-
-
+ >
+
+
+
-
-
- {settings.cfg.info.clickable ? (
- isMobileDevice ? (
-
-
- {settings.cfg.info.phonenumber}
-
-
- ) : (
-
-
- {settings.cfg.info.phonenumber}
-
-
- )
- ) : (
-
- {settings.cfg.info.phonenumber}
-
- )}
-
- {settings.cfg.info.law}
-
-
+
+
+ {settings.cfg.info.site && (
+
+
+ {settings.cfg.info.site}
+
+
+ )}
+ {settings.cfg.info.clickable ? (
+ isMobileDevice ? (
+
+
+ {settings.cfg.info.phonenumber}
+
+
+ ) : (
+
+
+ {settings.cfg.info.phonenumber}
+
+
+ )
+ ) : (
+
+ {settings.cfg.info.phonenumber}
+
+ )}
+
+ {settings.cfg.info.law}
+
+
-
-
-
- Сделано на PenaQuiz
-
-
-
-
- }
- backgroundBlock={background}
- startpageType={settings.cfg.startpageType}
- alignType={settings.cfg.startpage.position}
- />
-
- );
+
+
+
+ Сделано на PenaQuiz
+
+
+
+
+ }
+ backgroundBlock={background}
+ startpageType={settings.cfg.startpageType}
+ alignType={settings.cfg.startpage.position}
+ />
+
+ );
};
-
function QuizPreviewLayoutByType({
- quizHeaderBlock,
- quizMainBlock,
- backgroundBlock,
- startpageType,
- alignType,
+ quizHeaderBlock,
+ quizMainBlock,
+ backgroundBlock,
+ startpageType,
+ alignType,
}: {
- quizHeaderBlock: JSX.Element;
- quizMainBlock: JSX.Element;
- backgroundBlock: JSX.Element | null;
- startpageType: QuizStartpageType;
- alignType: QuizStartpageAlignType;
+ quizHeaderBlock: JSX.Element;
+ quizMainBlock: JSX.Element;
+ backgroundBlock: JSX.Element | null;
+ startpageType: QuizStartpageType;
+ alignType: QuizStartpageAlignType;
}) {
- const isMobile = useRootContainerSize() < 650;
+ const isMobile = useRootContainerSize() < 650;
- function StartPageMobile() {
- return (
+ function StartPageMobile() {
+ return (
+
+
+ {quizHeaderBlock}
+
+ {quizMainBlock}
+
+
+
+ {backgroundBlock}
+
+
+ );
+ }
+
+ switch (startpageType) {
+ case null:
+ case "standard": {
+ return (
+ <>
+ {isMobile ? (
+
+ ) : (
-
- {quizHeaderBlock}
-
- {quizMainBlock}
-
-
-
- {backgroundBlock}
-
+
+ {quizHeaderBlock}
+ {quizMainBlock}
+
+
+
+ {backgroundBlock}
+
- );
+ )}
+
+ );
}
-
- switch (startpageType) {
- case null:
- case "standard": {
- return (
- <>
- {isMobile ? (
-
- ) : (
-
-
- {quizHeaderBlock}
- {quizMainBlock}
-
-
-
- {backgroundBlock}
-
-
- )}
-
-
-
- );
- }
- case "expanded": {
- return (
- <>
- {isMobile ? (
-
- ) : (
-
-
- {quizHeaderBlock}
- {quizMainBlock}
-
-
- {backgroundBlock}
-
-
- )
- }
-
-
- );
- }
- case "centered": {
- return (
- <>
- {isMobile ? (
-
- ) : (
-
- {quizHeaderBlock}
- {backgroundBlock && (
-
- {backgroundBlock}
-
- )}
- {quizMainBlock}
-
- )
- }
-
-
- );
- }
- default:
- notReachable(startpageType);
+ case "expanded": {
+ return (
+ <>
+ {isMobile ? (
+
+ ) : (
+
+
+ {quizHeaderBlock}
+ {quizMainBlock}
+
+
+ {backgroundBlock}
+
+
+ )}
+
+ );
}
+ case "centered": {
+ return (
+ <>
+ {isMobile ? (
+
+ ) : (
+
+ {quizHeaderBlock}
+ {backgroundBlock && (
+
+ {backgroundBlock}
+
+ )}
+ {quizMainBlock}
+
+ )}
+
+ );
+ }
+ default:
+ notReachable(startpageType);
+ }
}
-
-const startpageAlignTypeToJustifyContent: Record = {
- left: "start",
- center: "center",
- right: "end",
+const startpageAlignTypeToJustifyContent: Record<
+ QuizStartpageAlignType,
+ "start" | "center" | "end"
+> = {
+ left: "start",
+ center: "center",
+ right: "end",
};