This commit is contained in:
Nastya 2024-11-25 02:42:33 +03:00
parent a461c8dc3d
commit 05b94625ae
6 changed files with 24 additions and 26 deletions

@ -42,7 +42,7 @@ export const Question = ({
}: Props) => { }: Props) => {
const theme = useTheme(); const theme = useTheme();
const { settings, show_badge, quizId } = useQuizSettings(); const { settings, show_badge, quizId } = useQuizSettings();
console.log(theme);
return ( return (
<Box <Box
sx={{ sx={{

@ -52,7 +52,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
resize: "none", resize: "none",
width: "100%", width: "100%",
fontSize: "16px", fontSize: "16px",
color: ownAnswer.length === 0 ? theme.palette.ownPlaceholder.main : theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
letterSpacing: "-0.4px", letterSpacing: "-0.4px",
wordSpacing: "-3px", wordSpacing: "-3px",
outline: "0px none", outline: "0px none",
@ -62,10 +62,6 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
"&::-webkit-scrollbar": { "&::-webkit-scrollbar": {
width: "4px", width: "4px",
}, },
"&::placeholder": {
color: theme.palette.ownPlaceholder.main,
opacity: 0.65,
},
"&::-webkit-scrollbar-thumb": { "&::-webkit-scrollbar-thumb": {
backgroundColor: theme.palette.primary.main, backgroundColor: theme.palette.primary.main,
}, },
@ -86,7 +82,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
backgroundColor: "inherit", backgroundColor: "inherit",
width: "100%", width: "100%",
fontSize: "18px", fontSize: "18px",
color: theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
}} }}
value={ownAnswer} value={ownAnswer}
disableUnderline disableUnderline

@ -41,7 +41,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
resize: "none", resize: "none",
width: "100%", width: "100%",
fontSize: "16px", fontSize: "16px",
color: ownAnswer.length === 0 ? theme.palette.ownPlaceholder.main : theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
letterSpacing: "-0.4px", letterSpacing: "-0.4px",
wordSpacing: "-3px", wordSpacing: "-3px",
outline: "0px none", outline: "0px none",
@ -51,10 +51,6 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
"&::-webkit-scrollbar": { "&::-webkit-scrollbar": {
width: "4px", width: "4px",
}, },
"&::placeholder": {
color: theme.palette.ownPlaceholder.main,
opacity: 0.65,
},
"&::-webkit-scrollbar-thumb": { "&::-webkit-scrollbar-thumb": {
backgroundColor: theme.palette.primary.main, backgroundColor: theme.palette.primary.main,
}, },
@ -74,7 +70,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
backgroundColor: "inherit", backgroundColor: "inherit",
width: "100%", width: "100%",
fontSize: "18px", fontSize: "18px",
color: theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
}} }}
value={ownAnswer} value={ownAnswer}
disableUnderline disableUnderline

@ -32,7 +32,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
const { updateOwnVariant } = useQuizViewStore((state) => state); const { updateOwnVariant } = useQuizViewStore((state) => state);
const ownAnswer = ownVariants[ownVariants.findIndex((v) => v.id === variant.id)]?.variant.answer || ""; const ownAnswer = ownVariants[ownVariants.findIndex((v) => v.id === variant.id)]?.variant.answer || "";
console.log(theme);
return largeCheck ? ( return largeCheck ? (
<TextareaAutosize <TextareaAutosize
placeholder={ownPlaceholder || "|"} placeholder={ownPlaceholder || "|"}
@ -40,7 +40,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
resize: "none", resize: "none",
width: "100%", width: "100%",
fontSize: "16px", fontSize: "16px",
color: ownAnswer.length === 0 ? theme.palette.ownPlaceholder.main : theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
letterSpacing: "-0.4px", letterSpacing: "-0.4px",
wordSpacing: "-3px", wordSpacing: "-3px",
outline: "0px none", outline: "0px none",
@ -50,10 +50,6 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
"&::-webkit-scrollbar": { "&::-webkit-scrollbar": {
width: "4px", width: "4px",
}, },
"&::placeholder": {
color: theme.palette.ownPlaceholder.main,
opacity: "0.65!important",
},
"&::-webkit-scrollbar-thumb": { "&::-webkit-scrollbar-thumb": {
backgroundColor: theme.palette.primary.main, backgroundColor: theme.palette.primary.main,
}, },
@ -72,7 +68,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
backgroundColor: "inherit", backgroundColor: "inherit",
width: "100%", width: "100%",
fontSize: "18px", fontSize: "18px",
color: theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
}} }}
value={ownAnswer} value={ownAnswer}
disableUnderline disableUnderline

@ -50,7 +50,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
resize: "none", resize: "none",
width: "100%", width: "100%",
fontSize: "16px", fontSize: "16px",
color: ownAnswer.length === 0 ? theme.palette.ownPlaceholder.main : theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
letterSpacing: "-0.4px", letterSpacing: "-0.4px",
wordSpacing: "-3px", wordSpacing: "-3px",
outline: "0px none", outline: "0px none",
@ -60,10 +60,6 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
"&::-webkit-scrollbar": { "&::-webkit-scrollbar": {
width: "4px", width: "4px",
}, },
"&::placeholder": {
color: theme.palette.ownPlaceholder.main,
opacity: "0.65",
},
"&::-webkit-scrollbar-thumb": { "&::-webkit-scrollbar-thumb": {
backgroundColor: theme.palette.primary.main, backgroundColor: theme.palette.primary.main,
}, },
@ -84,7 +80,7 @@ const OwnInput = ({ questionId, variant, largeCheck, ownPlaceholder }: OwnInputP
backgroundColor: "inherit", backgroundColor: "inherit",
width: "100%", width: "100%",
fontSize: "18px", fontSize: "18px",
color: theme.palette.text.primary, color: ownAnswer.length === 0 ? "ownPlaceholder" : theme.palette.text.primary,
}} }}
value={ownAnswer} value={ownAnswer}
disableUnderline disableUnderline

@ -50,3 +50,17 @@ declare module "react" {
[dataAttribute: DataAttributeKey]: unknown; [dataAttribute: DataAttributeKey]: unknown;
} }
} }
declare module "@mui/material/TextareaAutosize" {
interface TextareaAutosizeProps {
color?: "primary" | "secondary" | "ownPlaceholder";
}
}
declare module "@mui/material/Input" {
interface InputProps {
color?: "primary" | "secondary" | "ownPlaceholder";
}
undefined;
}