SQuiz/frontAnswerer
2
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

красивое переполнение в ответах

Browse Source
This commit is contained in:
Tamara 2024-02-14 01:45:27 +03:00
parent f1eee6ad07
commit 15d7f94a0f
5 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
lib/components/ViewPublicationPage/StartPageViewPublication.tsx
View File

@ -16,6 +16,7 @@ export const StartPageViewPublication = () => {
const { settings } = useQuizData(); const { settings } = useQuizData();
const { isMobileDevice } = useUADevice(); const { isMobileDevice } = useUADevice();
const isMobile = useRootContainerSize() < 650; const isMobile = useRootContainerSize() < 650;
const isTablet = useRootContainerSize() < 800;
const handleCopyNumber = () => { const handleCopyNumber = () => {
navigator.clipboard.writeText(settings.cfg.info.phonenumber); navigator.clipboard.writeText(settings.cfg.info.phonenumber);
@ -123,7 +124,7 @@ export const StartPageViewPublication = () => {
overflow: "hidden", overflow: "hidden",
textOverflow: "ellipsis", textOverflow: "ellipsis",
whiteSpace: "nowrap", whiteSpace: "nowrap",
maxWidth: "300px" maxWidth: isTablet ? "200px" : "300px"
}}> }}>
{settings.cfg.info.site} {settings.cfg.info.site}
</Typography> </Typography>
@ -200,7 +201,7 @@ export const StartPageViewPublication = () => {
flexDirection: "column" flexDirection: "column"
}} }}
> >
<Box sx={{ maxWidth: "300px" }}> <Box sx={{ maxWidth: isTablet ? "240px" : "300px" }}>
{settings.cfg.info.clickable ? ( {settings.cfg.info.clickable ? (
isMobileDevice ? ( isMobileDevice ? (
<Link href={`tel:${settings.cfg.info.phonenumber}`}> <Link href={`tel:${settings.cfg.info.phonenumber}`}>

10
lib/components/ViewPublicationPage/questions/Emoji.tsx
View File

@ -100,6 +100,16 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => {
color: theme.palette.text.primary, color: theme.palette.text.primary,
display: "flex", display: "flex",
gap: "10px", gap: "10px",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}} }}
value={index} value={index}
onClick={async (event) => { onClick={async (event) => {

8
lib/components/ViewPublicationPage/questions/Images.tsx
View File

@ -128,8 +128,16 @@ export const Images = ({ currentQuestion }: ImagesProps) => {
marginTop: "10px", marginTop: "10px",
marginLeft: 0, marginLeft: 0,
padding: "10px", padding: "10px",
display: "flex",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": { "& .MuiFormControlLabel-label": {
wordBreak: "break-word", wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
}, },
}} }}
value={index} value={index}

4
lib/components/ViewPublicationPage/questions/Variant.tsx
View File

@ -166,7 +166,9 @@ const VariantItem = ({
width: "100%", width: "100%",
}, },
"& .MuiFormControlLabel-label": { "& .MuiFormControlLabel-label": {
wordBreak: "break-word" wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
} }
}} }}
value={index} value={index}

3
lib/components/ViewPublicationPage/questions/Varimg.tsx
View File

@ -46,7 +46,8 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
display: "flex", display: "flex",
marginTop: "20px", marginTop: "20px",
flexDirection: isMobile ? "column-reverse" : undefined, flexDirection: isMobile ? "column-reverse" : undefined,
gap: isMobile ? "30px" : undefined gap: isMobile ? "30px" : undefined,
alignItems: isMobile ? "center" : undefined
}}> }}>
<RadioGroup <RadioGroup