Tablet version update

This commit is contained in:
ArtChaos189 2023-09-27 02:38:26 +03:00
parent c8436c1909
commit 270eb4863a
7 changed files with 40 additions and 28 deletions

@ -117,6 +117,7 @@ export default function QuestionsPageCard({ totalIndex, draggableProps, isDraggi
p: 0,
maxWidth: isTablet ? "549px" : "640px",
width: "100%",
marginRight: isMobile ? "0px" : "16.1px",
}}
>
<TextField
@ -193,7 +194,6 @@ export default function QuestionsPageCard({ totalIndex, draggableProps, isDraggi
<ArrowDownIcon
style={{
width: "18px",
marginLeft: isMobile ? "0px" : "16.1px",
color: "#4D4D4D",
}}
/>
@ -233,19 +233,19 @@ export default function QuestionsPageCard({ totalIndex, draggableProps, isDraggi
</Box>
)}
<OneIcon style={{ fontSize: "30px", marginLeft: "1.5px" }} />
<OneIcon style={{ fontSize: "30px", marginRight: "-2px" }} />
</Box>
<IconButton
disableRipple
sx={{
padding: isMobile ? "0" : "5px 8px 8px 8px",
padding: isMobile ? "0" : "5px 10px 8px 8px",
position: isMobile ? "absolute" : "relative",
right: isMobile ? "0" : null,
bottom: isMobile ? "0" : null,
}}
{...draggableProps}
>
<PointsIcon style={{ color: "#4D4D4D", fontSize: "30px", marginLeft: "-px" }} />
<PointsIcon style={{ color: "#4D4D4D", fontSize: "30px" }} />
</IconButton>
</Box>
</Box>

@ -52,6 +52,7 @@ export default function SettingDropDown({ totalIndex }: SettingDropDownProps) {
flexDirection: "column",
gap: "14px",
width: "100%",
maxWidth: isFigmaTablte ? "297px" : "360px",
}}
>
<Typography
@ -71,25 +72,30 @@ export default function SettingDropDown({ totalIndex }: SettingDropDownProps) {
})
}
/>
<Box sx={{ display: isMobile ? "none" : "block" }}>
<Box sx={{ display: isMobile ? "none" : "block", mt: isMobile ? "11px" : "6px" }}>
<Typography
sx={{ height: isMobile ? "18px" : "auto", fontWeight: "500", fontSize: "18px", color: " #4D4D4D" }}
sx={{
height: isMobile ? "18px" : "auto",
fontWeight: "500",
fontSize: "18px",
color: " #4D4D4D",
mb: "14px",
}}
>
Текст в выпадающем списке
</Typography>
<CustomTextField
placeholder={"Выберите вариант"}
text={listQuestions[quizId][totalIndex].content.default}
onChange={({ target }) => debounceAnswer(target.value)}
/>
</Box>
<CustomTextField
sx={{ maxWidth: "360px" }}
placeholder={"Выберите вариант"}
text={listQuestions[quizId][totalIndex].content.default}
onChange={({ target }) => debounceAnswer(target.value)}
/>
</Box>
<Box
sx={{
pt: isMobile ? "0px" : "20px",
pb: "20px",
pl: isFigmaTablte ? (isMobile ? "20px" : "34px") : "28px",
pl: isFigmaTablte ? (isMobile ? "20px" : "30px") : "0px",
pr: isFigmaTablte ? "19px" : "20px",
display: "flex",
flexDirection: "column",

@ -48,7 +48,7 @@ export default function Emoji({ totalIndex }: Props) {
width: "100%",
border: "1px solid #9A9AAF",
borderRadius: "8px",
marginBottom: isMobile ? "15px" : "20px",
marginBottom: "15px",
}}
>
<TextField
@ -148,7 +148,7 @@ export default function Emoji({ totalIndex }: Props) {
</Box>
)}
</Box>
<Box sx={{ display: "flex", alignItems: "center", marginBottom: "17px" }}>
<Box sx={{ display: "flex", alignItems: "center", marginBottom: "20px" }}>
<Link
component="button"
variant="body2"

@ -38,7 +38,7 @@ export default function SettingEmoji({ totalIndex }: SettingEmojiProps) {
pt: isMobile ? "25px" : "20px",
pb: isMobile ? "25px" : "20px",
pl: "20px",
pr: isFigmaTablte ? (isMobile ? "20px" : "0px") : "28px",
pr: isFigmaTablte ? (isWrappColumn ? "20px" : "0px") : "0px",
display: "flex",
flexDirection: "column",
gap: "14px",

@ -42,7 +42,6 @@ export default function SettingOptionsAndPict({ totalIndex }: SettingOptionsAndP
display: "flex",
justifyContent: "space-between",
flexDirection: isWrappColumn ? "column" : "none",
marginRight: isFigmaTablte ? (isMobile ? "0" : "0px") : "30px",
}}
>
<Box
@ -53,6 +52,7 @@ export default function SettingOptionsAndPict({ totalIndex }: SettingOptionsAndP
display: "flex",
flexDirection: "column",
gap: "14px",
maxWidth: isFigmaTablte ? "297px" : "360px",
width: "100%",
}}
>
@ -75,26 +75,32 @@ export default function SettingOptionsAndPict({ totalIndex }: SettingOptionsAndP
}}
/>
{!isWrappColumn && (
<>
<Box sx={{ mt: isMobile ? "11px" : "6px", width: "100%" }}>
<Typography
sx={{ height: isMobile ? "18px" : "auto", fontWeight: "500", fontSize: "18px", color: " #4D4D4D" }}
sx={{
height: isMobile ? "18px" : "auto",
fontWeight: "500",
fontSize: "18px",
color: " #4D4D4D",
mb: "14px",
}}
>
Текст-заглушка на картинке
</Typography>
<CustomTextField
sx={{ maxWidth: "330px", width: "100%", mr: isMobile ? "0px" : "16px" }}
sx={{ maxWidth: "360px", width: "100%", mr: isMobile ? "0px" : "16px" }}
placeholder={"Пример текста"}
text={listQuestions[quizId][totalIndex].content.replText}
onChange={({ target }) => debounced(target.value)}
/>
</>
</Box>
)}
</Box>
<Box
sx={{
pt: isMobile ? "0px" : "20px",
pb: "20px",
pl: isFigmaTablte ? (isMobile ? "20px" : "34px") : "28px",
pl: isFigmaTablte ? (isWrappColumn ? "20px" : "31px") : "20px",
pr: isFigmaTablte ? "19px" : "20px",
display: "flex",
flexDirection: "column",
@ -156,7 +162,7 @@ export default function SettingOptionsAndPict({ totalIndex }: SettingOptionsAndP
Текст-заглушка на картинке
</Typography>
<CustomTextField
sx={{ maxWidth: "330px", width: "100%" }}
sx={{ maxWidth: "360px", width: "100%" }}
placeholder={"Пример текста"}
text={listQuestions[quizId][totalIndex].content.replText}
onChange={({ target }) => debounced(target.value)}

@ -39,18 +39,18 @@ export default function OwnTextField({ totalIndex }: Props) {
width: "auto",
maxWidth: "745px",
display: "flex",
pb: "20px",
pb: "15px",
pl: "20px",
pr: "20px",
flexDirection: "column",
gap: isMobile ? "18px" : "20px",
gap: isMobile ? "15px" : "20px",
}}
>
<CustomTextField
placeholder={"Пример ответа"}
text={listQuestions[quizId][totalIndex].content.placeholder}
onChange={({ target }) => debounced(target.value)}
sx={{ maxWidth: "640px", width: "100%" }}
sx={{ maxWidth: isFigmaTablte ? "549px" : "640px", width: "100%" }}
/>
<Box sx={{ display: "flex", alignItems: "center", gap: "12px" }}>
<Typography

@ -55,7 +55,7 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
display: "flex",
justifyContent: "space-between",
flexDirection: isWrappColumn ? "column" : null,
marginRight: isMobile ? "0px" : "50px",
marginRight: isFigmaTablte ? "0px" : "32px",
}}
>
<Box
@ -107,7 +107,7 @@ export default function SettingTextField({ totalIndex }: SettingTextFieldProps)
pt: isMobile ? "0px" : "20px",
pb: "20px",
pl: isFigmaTablte ? (isWrappColumn ? "20px" : "34px") : "20px",
pr: isFigmaTablte ? "19px" : "20px",
pr: isFigmaTablte ? "14px" : "20px",
display: "flex",
flexDirection: "column",
gap: isMobile ? "13px" : "14px",