--
This commit is contained in:
parent
a461c8dc3d
commit
05b94625ae
@ -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
|
||||||
|
|||||||
14
lib/utils/themes/mui.d.ts
vendored
14
lib/utils/themes/mui.d.ts
vendored
@ -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;
|
||||||
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user