fix: icons
This commit is contained in:
parent
141614cb72
commit
da7bcc842a
@ -173,9 +173,9 @@ export default function Notebook({ color }: Props) {
|
|||||||
width="0.998971"
|
width="0.998971"
|
||||||
height="1.57978"
|
height="1.57978"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feBlend
|
<feBlend
|
||||||
mode="normal"
|
mode="normal"
|
||||||
in="SourceGraphic"
|
in="SourceGraphic"
|
||||||
@ -194,9 +194,9 @@ export default function Notebook({ color }: Props) {
|
|||||||
width="2.51719"
|
width="2.51719"
|
||||||
height="2.51694"
|
height="2.51694"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feBlend
|
<feBlend
|
||||||
mode="normal"
|
mode="normal"
|
||||||
in="SourceGraphic"
|
in="SourceGraphic"
|
||||||
@ -215,9 +215,9 @@ export default function Notebook({ color }: Props) {
|
|||||||
width="1.11616"
|
width="1.11616"
|
||||||
height="1.57978"
|
height="1.57978"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feBlend
|
<feBlend
|
||||||
mode="normal"
|
mode="normal"
|
||||||
in="SourceGraphic"
|
in="SourceGraphic"
|
||||||
@ -236,9 +236,9 @@ export default function Notebook({ color }: Props) {
|
|||||||
width="1.22643"
|
width="1.22643"
|
||||||
height="0.993766"
|
height="0.993766"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feBlend
|
<feBlend
|
||||||
mode="normal"
|
mode="normal"
|
||||||
in="SourceGraphic"
|
in="SourceGraphic"
|
||||||
@ -257,9 +257,9 @@ export default function Notebook({ color }: Props) {
|
|||||||
width="279"
|
width="279"
|
||||||
height="12.0981"
|
height="12.0981"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feBlend
|
<feBlend
|
||||||
mode="normal"
|
mode="normal"
|
||||||
in="SourceGraphic"
|
in="SourceGraphic"
|
||||||
|
@ -38,9 +38,9 @@ export default function YoutobeIcon({ color, width }: Props) {
|
|||||||
width="155.738"
|
width="155.738"
|
||||||
height="115.205"
|
height="115.205"
|
||||||
filterUnits="userSpaceOnUse"
|
filterUnits="userSpaceOnUse"
|
||||||
color-interpolation-filters="sRGB"
|
colorInterpolationFilters="sRGB"
|
||||||
>
|
>
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
<feColorMatrix
|
<feColorMatrix
|
||||||
in="SourceAlpha"
|
in="SourceAlpha"
|
||||||
type="matrix"
|
type="matrix"
|
||||||
|
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.7 KiB |
@ -1,36 +1,86 @@
|
|||||||
import { useTheme } from "@mui/material";
|
import { useTheme } from "@mui/material";
|
||||||
|
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
width?: number;
|
width?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function CloseBold({ width }: Props) {
|
export default function CloseBold({ width }: Props) {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<svg width="35" height="33" viewBox="0 0 35 33" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg
|
||||||
<g id="Close">
|
width="35"
|
||||||
<g id="Rectangle 57" opacity="0.3" filter="url(#filter0_d_4080_12482)">
|
height="33"
|
||||||
<rect x="6" y="4" width="24" height="24" rx="12" fill="#9A9AAF"/>
|
viewBox="0 0 35 33"
|
||||||
</g>
|
fill="none"
|
||||||
<g id="Group 331">
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
<path id="Vector 586" d="M22.8516 10.9517L12.9521 20.8512" stroke="#FDFDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
>
|
||||||
<path id="Vector 587" d="M22.8516 20.8462L12.9521 10.9467" stroke="#FDFDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
<g id="Close">
|
||||||
</g>
|
<g id="Rectangle 57" opacity="0.3" filter="url(#filter0_d_4080_12482)">
|
||||||
</g>
|
<rect x="6" y="4" width="24" height="24" rx="12" fill="#9A9AAF" />
|
||||||
<defs>
|
</g>
|
||||||
<filter id="filter0_d_4080_12482" x="0" y="0" width="36" height="36" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
<g id="Group 331">
|
||||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
<path
|
||||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
id="Vector 586"
|
||||||
<feMorphology radius="1" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_4080_12482"/>
|
d="M22.8516 10.9517L12.9521 20.8512"
|
||||||
<feOffset dy="2"/>
|
stroke="#FDFDFF"
|
||||||
<feGaussianBlur stdDeviation="2.5"/>
|
strokeWidth="1.5"
|
||||||
<feComposite in2="hardAlpha" operator="out"/>
|
strokeLinecap="round"
|
||||||
<feColorMatrix type="matrix" values="0 0 0 0 0.416562 0 0 0 0 0.452406 0 0 0 0 0.775 0 0 0 0.18 0"/>
|
strokeLinejoin="round"
|
||||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4080_12482"/>
|
/>
|
||||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4080_12482" result="shape"/>
|
<path
|
||||||
</filter>
|
id="Vector 587"
|
||||||
</defs>
|
d="M22.8516 20.8462L12.9521 10.9467"
|
||||||
</svg>
|
stroke="#FDFDFF"
|
||||||
)}
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<filter
|
||||||
|
id="filter0_d_4080_12482"
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="36"
|
||||||
|
height="36"
|
||||||
|
filterUnits="userSpaceOnUse"
|
||||||
|
colorInterpolationFilters="sRGB"
|
||||||
|
>
|
||||||
|
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||||
|
<feColorMatrix
|
||||||
|
in="SourceAlpha"
|
||||||
|
type="matrix"
|
||||||
|
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||||
|
result="hardAlpha"
|
||||||
|
/>
|
||||||
|
<feMorphology
|
||||||
|
radius="1"
|
||||||
|
operator="dilate"
|
||||||
|
in="SourceAlpha"
|
||||||
|
result="effect1_dropShadow_4080_12482"
|
||||||
|
/>
|
||||||
|
<feOffset dy="2" />
|
||||||
|
<feGaussianBlur stdDeviation="2.5" />
|
||||||
|
<feComposite in2="hardAlpha" operator="out" />
|
||||||
|
<feColorMatrix
|
||||||
|
type="matrix"
|
||||||
|
values="0 0 0 0 0.416562 0 0 0 0 0.452406 0 0 0 0 0.775 0 0 0 0.18 0"
|
||||||
|
/>
|
||||||
|
<feBlend
|
||||||
|
mode="normal"
|
||||||
|
in2="BackgroundImageFix"
|
||||||
|
result="effect1_dropShadow_4080_12482"
|
||||||
|
/>
|
||||||
|
<feBlend
|
||||||
|
mode="normal"
|
||||||
|
in="SourceGraphic"
|
||||||
|
in2="effect1_dropShadow_4080_12482"
|
||||||
|
result="shape"
|
||||||
|
/>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
@ -1,18 +1,37 @@
|
|||||||
import { useTheme, SxProps, Box } from "@mui/material";
|
import { useTheme, SxProps, Box } from "@mui/material";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
sx?: SxProps;
|
sx?: SxProps;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function ExpandIcon({ sx }: Props) {
|
export default function ExpandIcon({ sx }: Props) {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ ...sx, display: "flex", alignItems:"center", justifyContent: "center" }}>
|
<Box
|
||||||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
sx={{
|
||||||
<rect width="30" height="30" rx="6" fill="#EEE4FC" />
|
...sx,
|
||||||
<path d="M22.5 11.25L15 18.75L7.5 11.25" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round" />
|
display: "flex",
|
||||||
</svg>
|
alignItems: "center",
|
||||||
</Box>
|
justifyContent: "center",
|
||||||
);
|
}}
|
||||||
}
|
>
|
||||||
|
<svg
|
||||||
|
width="30"
|
||||||
|
height="30"
|
||||||
|
viewBox="0 0 30 30"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<rect width="30" height="30" rx="6" fill="#EEE4FC" />
|
||||||
|
<path
|
||||||
|
d="M22.5 11.25L15 18.75L7.5 11.25"
|
||||||
|
stroke="#7E2AEA"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path d="M18 -2.62268e-07C21.3137 -1.17422e-07 24 2.68629 24 6L24 18C24 21.3137 21.3137 24 18 24L6 24C2.68629 24 -9.31652e-07 21.3137 -7.86805e-07 18L-5.24537e-07 12L-2.62268e-07 6C-1.17422e-07 2.68629 2.68629 -9.31652e-07 6 -7.86805e-07L18 -2.62268e-07Z" fill="#9A9AAF" fill-opacity="0.7"/>
|
<path d="M18 -2.62268e-07C21.3137 -1.17422e-07 24 2.68629 24 6L24 18C24 21.3137 21.3137 24 18 24L6 24C2.68629 24 -9.31652e-07 21.3137 -7.86805e-07 18L-5.24537e-07 12L-2.62268e-07 6C-1.17422e-07 2.68629 2.68629 -9.31652e-07 6 -7.86805e-07L18 -2.62268e-07Z" fill="#9A9AAF" fill-opacity="0.7"/>
|
||||||
<path d="M7 11.5L11.2857 15.5L17 8" stroke="white" stroke-linecap="round" strokeLinejoin="round"/>
|
<path d="M7 11.5L11.2857 15.5L17 8" stroke="white" strokeLinecap="round" strokeLinejoin="round"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 494 B After Width: | Height: | Size: 493 B |
@ -1,21 +1,64 @@
|
|||||||
import { useTheme, SxProps, Box } from "@mui/material";
|
import { useTheme, SxProps, Box } from "@mui/material";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
sx?: SxProps;
|
sx?: SxProps;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function Trash({ sx }: Props) {
|
export default function Trash({ sx }: Props) {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ ...sx, display: "flex", alignItems: "center", justifyContent: "center" }}>
|
<Box
|
||||||
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
sx={{
|
||||||
<path d="M20.25 5.73438H3.75" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
...sx,
|
||||||
<path d="M9.75 10.2344V16.2344" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
display: "flex",
|
||||||
<path d="M14.25 10.2344V16.2344" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
alignItems: "center",
|
||||||
<path d="M18.75 5.73438V19.9844C18.75 20.1833 18.671 20.3741 18.5303 20.5147C18.3897 20.6554 18.1989 20.7344 18 20.7344H6C5.80109 20.7344 5.61032 20.6554 5.46967 20.5147C5.32902 20.3741 5.25 20.1833 5.25 19.9844V5.73438" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
justifyContent: "center",
|
||||||
<path d="M15.75 5.73438V4.23438C15.75 3.83655 15.592 3.45502 15.3107 3.17371C15.0294 2.89241 14.6478 2.73438 14.25 2.73438H9.75C9.35218 2.73438 8.97064 2.89241 8.68934 3.17371C8.40804 3.45502 8.25 3.83655 8.25 4.23438V5.73438" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
|
}}
|
||||||
</svg>
|
>
|
||||||
</Box>
|
<svg
|
||||||
);
|
width="24"
|
||||||
}
|
height="25"
|
||||||
|
viewBox="0 0 24 25"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M20.25 5.73438H3.75"
|
||||||
|
stroke="#4D4D4D"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M9.75 10.2344V16.2344"
|
||||||
|
stroke="#4D4D4D"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M14.25 10.2344V16.2344"
|
||||||
|
stroke="#4D4D4D"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M18.75 5.73438V19.9844C18.75 20.1833 18.671 20.3741 18.5303 20.5147C18.3897 20.6554 18.1989 20.7344 18 20.7344H6C5.80109 20.7344 5.61032 20.6554 5.46967 20.5147C5.32902 20.3741 5.25 20.1833 5.25 19.9844V5.73438"
|
||||||
|
stroke="#4D4D4D"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15.75 5.73438V4.23438C15.75 3.83655 15.592 3.45502 15.3107 3.17371C15.0294 2.89241 14.6478 2.73438 14.25 2.73438H9.75C9.35218 2.73438 8.97064 2.89241 8.68934 3.17371C8.40804 3.45502 8.25 3.83655 8.25 4.23438V5.73438"
|
||||||
|
stroke="#4D4D4D"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
@ -13,10 +13,12 @@ export const BranchingQuestionsModal = ({
|
|||||||
openedModalQuestions,
|
openedModalQuestions,
|
||||||
setOpenedModalQuestions,
|
setOpenedModalQuestions,
|
||||||
setModalQuestionTargetContentId,
|
setModalQuestionTargetContentId,
|
||||||
setModalQuestionParentContentId
|
setModalQuestionParentContentId,
|
||||||
}: Props) => {
|
}: Props) => {
|
||||||
const trashQuestions = useQuestionsStore().questions
|
const trashQuestions = useQuestionsStore().questions;
|
||||||
const questions = trashQuestions.filter((question) => question.type !== "result")
|
const questions = trashQuestions.filter(
|
||||||
|
(question) => question.type !== "result"
|
||||||
|
);
|
||||||
|
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
setOpenedModalQuestions(false);
|
setOpenedModalQuestions(false);
|
||||||
@ -62,7 +64,7 @@ export const BranchingQuestionsModal = ({
|
|||||||
borderRadius: "8px",
|
borderRadius: "8px",
|
||||||
marginBottom: "20px",
|
marginBottom: "20px",
|
||||||
boxShadow: "0px 10px 30px #e7e7e7",
|
boxShadow: "0px 10px 30px #e7e7e7",
|
||||||
backgroundImage: `url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='rgb(154, 154, 175)' stroke-width='2' stroke-dasharray='8 8' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
|
backgroundImage: `url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='rgb(154, 154, 175)' strokeWidth='2' stroke-dasharray='8 8' stroke-dashoffset='0' strokeLinecap='square'/%3e%3c/svg%3e");
|
||||||
border-radius: 8px;`,
|
border-radius: 8px;`,
|
||||||
"&:last-child": { marginBottom: 0 },
|
"&:last-child": { marginBottom: 0 },
|
||||||
}}
|
}}
|
||||||
|
@ -3,12 +3,18 @@ import { Box, Button, IconButton, Typography } from "@mui/material";
|
|||||||
import { ReactComponent as CheckedIcon } from "@icons/checked.svg";
|
import { ReactComponent as CheckedIcon } from "@icons/checked.svg";
|
||||||
import { useQuestionsStore } from "@root/questions/store";
|
import { useQuestionsStore } from "@root/questions/store";
|
||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
import { AnyTypedQuizQuestion, UntypedQuizQuestion } from "@model/questionTypes/shared";
|
import {
|
||||||
|
AnyTypedQuizQuestion,
|
||||||
|
UntypedQuizQuestion,
|
||||||
|
} from "@model/questionTypes/shared";
|
||||||
import { Pencil } from "../../startPage/Sidebar/icons/Pencil";
|
import { Pencil } from "../../startPage/Sidebar/icons/Pencil";
|
||||||
import { updateOpenBranchingPanel, updateEditSomeQuestion, updateDragQuestionContentId } from "@root/uiTools/actions"
|
import {
|
||||||
|
updateOpenBranchingPanel,
|
||||||
|
updateEditSomeQuestion,
|
||||||
|
updateDragQuestionContentId,
|
||||||
|
} from "@root/uiTools/actions";
|
||||||
import { useUiTools } from "@root/uiTools/store";
|
import { useUiTools } from "@root/uiTools/store";
|
||||||
|
|
||||||
|
|
||||||
const getItemStyle = (isDragging: any, draggableStyle: any) => ({
|
const getItemStyle = (isDragging: any, draggableStyle: any) => ({
|
||||||
// some basic styles to make the items look a bit nicer
|
// some basic styles to make the items look a bit nicer
|
||||||
userSelect: "none",
|
userSelect: "none",
|
||||||
@ -19,14 +25,16 @@ const getItemStyle = (isDragging: any, draggableStyle: any) => ({
|
|||||||
background: isDragging ? "lightgreen" : "grey",
|
background: isDragging ? "lightgreen" : "grey",
|
||||||
|
|
||||||
// styles we need to apply on draggables
|
// styles we need to apply on draggables
|
||||||
...draggableStyle
|
...draggableStyle,
|
||||||
});
|
});
|
||||||
type AnyQuestion = UntypedQuizQuestion | AnyTypedQuizQuestion
|
type AnyQuestion = UntypedQuizQuestion | AnyTypedQuizQuestion;
|
||||||
|
|
||||||
export const QuestionsList = () => {
|
export const QuestionsList = () => {
|
||||||
const { desireToOpenABranchingModal } = useUiTools()
|
const { desireToOpenABranchingModal } = useUiTools();
|
||||||
const trashQuestions = useQuestionsStore().questions
|
const trashQuestions = useQuestionsStore().questions;
|
||||||
const questions = trashQuestions.filter((question) => question.type !== "result")
|
const questions = trashQuestions.filter(
|
||||||
|
(question) => question.type !== "result"
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Box sx={{ padding: "15px" }}>
|
<Box sx={{ padding: "15px" }}>
|
||||||
@ -55,47 +63,56 @@ export const QuestionsList = () => {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{/* тут нужно будет фильтровать с проверкой, что вопрос имеет тип*/}
|
{/* тут нужно будет фильтровать с проверкой, что вопрос имеет тип*/}
|
||||||
{questions.filter((q: AnyQuestion) => q.type).map(({ title, content }, index) => (
|
{questions
|
||||||
<Button
|
.filter((q: AnyQuestion) => q.type)
|
||||||
onMouseDown={() => {//Разрешаем добавить этот вопрос если у него нет родителя (не добавляли ещё в дерево)
|
.map(({ title, content }, index) => (
|
||||||
if (!content.rule.parentId) updateDragQuestionContentId(content.id)
|
<Button
|
||||||
}}
|
onMouseDown={() => {
|
||||||
key={index}
|
//Разрешаем добавить этот вопрос если у него нет родителя (не добавляли ещё в дерево)
|
||||||
sx={{
|
if (!content.rule.parentId)
|
||||||
width: "100%",
|
updateDragQuestionContentId(content.id);
|
||||||
cursor: "pointer",
|
}}
|
||||||
display: "flex",
|
key={index}
|
||||||
justifyContent: "space-between",
|
sx={{
|
||||||
alignItems: "center",
|
width: "100%",
|
||||||
padding: "12px",
|
cursor: "pointer",
|
||||||
background: "#FFFFFF",
|
display: "flex",
|
||||||
borderRadius: "8px",
|
justifyContent: "space-between",
|
||||||
border: desireToOpenABranchingModal === content.id ? "4px solid #7e2aea" : "none",
|
alignItems: "center",
|
||||||
marginBottom: "20px",
|
padding: "12px",
|
||||||
boxShadow: "0px 10px 30px #e7e7e7",
|
background: "#FFFFFF",
|
||||||
backgroundImage: `url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='rgb(154, 154, 175)' stroke-width='2' stroke-dasharray='8 8' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
|
borderRadius: "8px",
|
||||||
|
border:
|
||||||
|
desireToOpenABranchingModal === content.id
|
||||||
|
? "4px solid #7e2aea"
|
||||||
|
: "none",
|
||||||
|
marginBottom: "20px",
|
||||||
|
boxShadow: "0px 10px 30px #e7e7e7",
|
||||||
|
backgroundImage: `url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='rgb(154, 154, 175)' strokeWidth='2' stroke-dasharray='8 8' stroke-dashoffset='0' strokeLinecap='square'/%3e%3c/svg%3e");
|
||||||
border-radius: 8px;`,
|
border-radius: 8px;`,
|
||||||
"&:last-child": { marginBottom: 0 },
|
"&:last-child": { marginBottom: 0 },
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Typography sx={{ width: "100%", color: content.rule.parentId ? "#9A9AAF" : "#000" }}>
|
|
||||||
{title || "нет заголовка"}
|
|
||||||
</Typography>
|
|
||||||
<IconButton
|
|
||||||
onClick={() => {
|
|
||||||
updateOpenBranchingPanel(false)
|
|
||||||
updateEditSomeQuestion(content.id)
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Pencil style={{color: "#7e2aea"}}/>
|
<Typography
|
||||||
</IconButton>
|
sx={{
|
||||||
{content.rule.parentId && <CheckedIcon />}
|
width: "100%",
|
||||||
</Button>
|
color: content.rule.parentId ? "#9A9AAF" : "#000",
|
||||||
|
}}
|
||||||
|
>
|
||||||
))}
|
{title || "нет заголовка"}
|
||||||
|
</Typography>
|
||||||
|
<IconButton
|
||||||
|
onClick={() => {
|
||||||
|
updateOpenBranchingPanel(false);
|
||||||
|
updateEditSomeQuestion(content.id);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Pencil style={{ color: "#7e2aea" }} />
|
||||||
|
</IconButton>
|
||||||
|
{content.rule.parentId && <CheckedIcon />}
|
||||||
|
</Button>
|
||||||
|
))}
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user