remove viewport css units

This commit is contained in:
nflnkr 2024-02-19 17:20:21 +03:00
parent 437713aabd
commit ade7ca21ea
2 changed files with 9 additions and 10 deletions

@ -160,7 +160,7 @@ export const ContactForm = ({ currentQuestion, onShowResult }: Props) => {
sx={{ sx={{
width: isWide && !isMobile ? "100%" : isMobile ? undefined : "530px", width: isWide && !isMobile ? "100%" : isMobile ? undefined : "530px",
borderRadius: "4px", borderRadius: "4px",
height: "90vh", height: "100%",
display: isWide && !isMobile ? "flex" : undefined, display: isWide && !isMobile ? "flex" : undefined,
}} }}
> >

@ -1,4 +1,4 @@
import {Box, Link, useTheme} from "@mui/material"; import { Box, Link, useTheme } from "@mui/material";
import { Footer } from "./Footer"; import { Footer } from "./Footer";
import { Date } from "./questions/Date"; import { Date } from "./questions/Date";
@ -15,13 +15,12 @@ import { Varimg } from "./questions/Varimg";
import type { RealTypedQuizQuestion } from "../../model/questionTypes/shared"; import type { RealTypedQuizQuestion } from "../../model/questionTypes/shared";
import { useQuizData } from "@contexts/QuizDataContext";
import { NameplateLogoFQ } from "@icons/NameplateLogoFQ"; import { NameplateLogoFQ } from "@icons/NameplateLogoFQ";
import { NameplateLogoFQDark } from "@icons/NameplateLogoFQDark"; import { NameplateLogoFQDark } from "@icons/NameplateLogoFQDark";
import { useQuizData } from "@contexts/QuizDataContext";
import { notReachable } from "@utils/notReachable"; import { notReachable } from "@utils/notReachable";
import { quizThemes } from "@utils/themes/Publication/themePublication"; import { quizThemes } from "@utils/themes/Publication/themePublication";
import { ReactNode } from "react"; import { ReactNode } from "react";
import { useRootContainerSize } from "../../contexts/RootContainerWidthContext";
type Props = { type Props = {
currentQuestion: RealTypedQuizQuestion; currentQuestion: RealTypedQuizQuestion;
@ -38,12 +37,12 @@ export const Question = ({
}: Props) => { }: Props) => {
const theme = useTheme(); const theme = useTheme();
const { settings } = useQuizData(); const { settings } = useQuizData();
const isMobile = useRootContainerSize() < 650;
console.log(settings)
return ( return (
<Box sx={{ <Box sx={{
backgroundColor: theme.palette.background.default, backgroundColor: theme.palette.background.default,
height: isMobile ? "100%" : "100vh" height: "100%",
}}> }}>
<Box sx={{ <Box sx={{
height: "calc(100% - 75px)", height: "calc(100% - 75px)",
@ -58,9 +57,9 @@ console.log(settings)
}}> }}>
<QuestionByType key={currentQuestion.id} question={currentQuestion} /> <QuestionByType key={currentQuestion.id} question={currentQuestion} />
{quizThemes[settings.cfg.theme].isLight ? ( {quizThemes[settings.cfg.theme].isLight ? (
<Link target={"_blank"} href={"https://quiz.pena.digital"}> <Link target={"_blank"} href={"https://quiz.pena.digital"}>
<NameplateLogoFQ style={{ fontSize: "34px", width: "200px", height: "auto" }} /> <NameplateLogoFQ style={{ fontSize: "34px", width: "200px", height: "auto" }} />
</Link> </Link>
) : ( ) : (
<Link target={"_blank"} href={"https://quiz.pena.digital"}> <Link target={"_blank"} href={"https://quiz.pena.digital"}>
<NameplateLogoFQDark style={{ fontSize: "34px", width: "200px", height: "auto" }} /> <NameplateLogoFQDark style={{ fontSize: "34px", width: "200px", height: "auto" }} />