фк и результаты градиент поверх фотофона

This commit is contained in:
Tamara 2024-03-14 20:17:19 +03:00
parent ab0f53e061
commit 7bec600391
2 changed files with 196 additions and 164 deletions

@ -3,7 +3,16 @@ import EmailIcon from "@icons/ContactFormIcon/EmailIcon";
import NameIcon from "@icons/ContactFormIcon/NameIcon";
import PhoneIcon from "@icons/ContactFormIcon/PhoneIcon";
import TextIcon from "@icons/ContactFormIcon/TextIcon";
import { Box, Button, InputAdornment, Link, TextField as MuiTextField, TextFieldProps, Typography, useTheme } from "@mui/material";
import {
Box,
Button,
InputAdornment,
Link,
TextField as MuiTextField,
TextFieldProps,
Typography,
useTheme
} from "@mui/material";
import CustomCheckbox from "@ui_kit/CustomCheckbox";
import {FC, useRef, useState} from "react";
@ -156,7 +165,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
msOverflowStyle: "none",
backgroundPosition: "center",
backgroundSize: "cover",
backgroundImage: settings.cfg.design
backgroundImage: settings.cfg.design && !isMobile
? `url(${DESIGN_LIST[settings.cfg.theme]})`
: null,
}}
@ -168,6 +177,11 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
height: "100%",
minHeight: "100vh",
display: isWide && !isMobile ? "flex" : undefined,
background: settings.cfg.design && !isMobile
? quizThemes[settings.cfg.theme].isLight
? "transparent"
: "linear-gradient(90deg,#272626, transparent)"
: theme.palette.background.default,
}}
>
<Box
@ -456,7 +470,8 @@ const CustomInput = ({ title, desc, Icon, onChange, id }: {
InputProps={{
startAdornment: (
<InputAdornment position="start">
<Icon color="gray" backgroundColor={quizThemes[settings.cfg.theme].isLight ? "#F2F3F7" : "#F2F3F71A"} />
<Icon color="gray"
backgroundColor={quizThemes[settings.cfg.theme].isLight ? "#F2F3F7" : "#F2F3F71A"}/>
</InputAdornment>
),
}}

@ -36,26 +36,41 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
height: "100%",
minHeight: "100vh",
width: "100%",
pt: "28px",
overflow: "auto",
backgroundColor: theme.palette.background.default,
backgroundPosition: "center",
backgroundSize: "cover",
backgroundImage: settings.cfg.design
backgroundImage: settings.cfg.design && !isMobile
? `url(${DESIGN_LIST[settings.cfg.theme]})`
: null,
}}
>
<Box
sx={{
display: "flex",
flexDirection: "column",
alignItems: "start",
maxWidth: "844px",
width: "100%",
padding: isMobile ? "0 16px" : isTablet ? "0 78px" : undefined,
justifyContent: "space-between",
alignItems: "center",
pt: "30px",
width: "inherit",
height: "inherit",
background: settings.cfg.design
? quizThemes[settings.cfg.theme].isLight
? "transparent"
: "linear-gradient(90deg,#272626, transparent)"
: theme.palette.background.default,
}}
>
<Box
sx={{
display: "flex",
flexDirection: "column",
alignItems: "flex-start",
width: "100%",
maxWidth: "844px",
padding: isMobile ? "0 16px" : isTablet ? "0 78px" : undefined,
}}>
{
!resultQuestion?.content.useImage && resultQuestion.content.video && (
<YoutubeEmbedIframe
@ -125,6 +140,7 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
}
</Box>
<Box width="100%">
<Box
sx={{
@ -215,5 +231,6 @@ export const ResultForm = ({ resultQuestion }: ResultFormProps) => {
</Box>
</Box>
</Box>
</Box>
);
};