SQuiz/frontPanel
3
0
Fork 0
Code Issues 18 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix: svg icons strokeLinejoin

Browse Source
This commit is contained in:
IlyaDoronin 2023-08-11 10:49:16 +03:00
parent 5db186c8ca
commit 3e7aabe8ad
42 changed files with 1533 additions and 770 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/icons/ArrowCounterClockWise.svg
View File

@ -1,5 +1,5 @@
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24 0H6C2.68629 0 0 2.68629 0 6V24C0 27.3137 2.68629 30 6 30H24C27.3137 30 30 27.3137 30 24V6C30 2.68629 27.3137 0 24 0Z" fill="#F2F3F7"/>
<path d="M9.35156 11.6836H3.72656V6.05859" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.71094 22.2891C9.15283 23.7321 10.9903 24.7151 12.991 25.1137C14.9916 25.5123 17.0656 25.3086 18.9504 24.5283C20.8353 23.748 22.4464 22.4263 23.5799 20.7302C24.7134 19.0341 25.3185 17.04 25.3185 15C25.3185 12.96 24.7134 10.9659 23.5799 9.26981C22.4464 7.57375 20.8353 6.25197 18.9504 5.47169C17.0656 4.69141 14.9916 4.48768 12.991 4.88627C10.9903 5.28486 9.15283 6.26787 7.71094 7.71094L3.72656 11.6836" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M9.35156 11.6836H3.72656V6.05859" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M7.71094 22.2891C9.15283 23.7321 10.9903 24.7151 12.991 25.1137C14.9916 25.5123 17.0656 25.3086 18.9504 24.5283C20.8353 23.748 22.4464 22.4263 23.5799 20.7302C24.7134 19.0341 25.3185 17.04 25.3185 15C25.3185 12.96 24.7134 10.9659 23.5799 9.26981C22.4464 7.57375 20.8353 6.25197 18.9504 5.47169C17.0656 4.69141 14.9916 4.48768 12.991 4.88627C10.9903 5.28486 9.15283 6.26787 7.71094 7.71094L3.72656 11.6836" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 875 B

After

Width:  |  Height:  |  Size: 873 B

55
src/assets/icons/BrowserIcon.tsx
View File

@ -1,23 +1,40 @@
import { Box, useTheme } from "@mui/material";
export default function BrowserIcon() {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20.25 4.5H3.75C3.33579 4.5 3 4.83579 3 5.25V18.75C3 19.1642 3.33579 19.5 3.75 19.5H20.25C20.6642 19.5 21 19.1642 21 18.75V5.25C21 4.83579 20.6642 4.5 20.25 4.5Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3 9H21" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M20.25 4.5H3.75C3.33579 4.5 3 4.83579 3 5.25V18.75C3 19.1642 3.33579 19.5 3.75 19.5H20.25C20.6642 19.5 21 19.1642 21 18.75V5.25C21 4.83579 20.6642 4.5 20.25 4.5Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M3 9H21"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

55
src/assets/icons/ContactFormIcon/AddressIcon.tsx
View File

@ -1,25 +1,40 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function AddressIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.5 7.96875C8.53553 7.96875 9.375 7.12928 9.375 6.09375C9.375 5.05822 8.53553 4.21875 7.5 4.21875C6.46447 4.21875 5.625 5.05822 5.625 6.09375C5.625 7.12928 6.46447 7.96875 7.5 7.96875Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12.1875 6.09375C12.1875 10.3125 7.5 13.5938 7.5 13.5938C7.5 13.5938 2.8125 10.3125 2.8125 6.09375C2.8125 4.85055 3.30636 3.65826 4.18544 2.77919C5.06451 1.90011 6.2568 1.40625 7.5 1.40625C8.7432 1.40625 9.93549 1.90011 10.8146 2.77919C11.6936 3.65826 12.1875 4.85055 12.1875 6.09375V6.09375Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function AddressIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="15"
height="15"
viewBox="0 0 15 15"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7.5 7.96875C8.53553 7.96875 9.375 7.12928 9.375 6.09375C9.375 5.05822 8.53553 4.21875 7.5 4.21875C6.46447 4.21875 5.625 5.05822 5.625 6.09375C5.625 7.12928 6.46447 7.96875 7.5 7.96875Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12.1875 6.09375C12.1875 10.3125 7.5 13.5938 7.5 13.5938C7.5 13.5938 2.8125 10.3125 2.8125 6.09375C2.8125 4.85055 3.30636 3.65826 4.18544 2.77919C5.06451 1.90011 6.2568 1.40625 7.5 1.40625C8.7432 1.40625 9.93549 1.90011 10.8146 2.77919C11.6936 3.65826 12.1875 4.85055 12.1875 6.09375V6.09375Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

56
src/assets/icons/ContactFormIcon/EmailIcon.tsx
View File

@ -1,26 +1,40 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function EmailIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.875 3.28125H13.125V11.25C13.125 11.3743 13.0756 11.4935 12.9877 11.5815C12.8998 11.6694 12.7806 11.7188 12.6562 11.7188H2.34375C2.21943 11.7188 2.1002 11.6694 2.01229 11.5815C1.92439 11.4935 1.875 11.3743 1.875 11.25V3.28125Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M13.125 3.28125L7.5 8.4375L1.875 3.28125" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function EmailIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="15"
height="15"
viewBox="0 0 15 15"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.875 3.28125H13.125V11.25C13.125 11.3743 13.0756 11.4935 12.9877 11.5815C12.8998 11.6694 12.7806 11.7188 12.6562 11.7188H2.34375C2.21943 11.7188 2.1002 11.6694 2.01229 11.5815C1.92439 11.4935 1.875 11.3743 1.875 11.25V3.28125Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M13.125 3.28125L7.5 8.4375L1.875 3.28125"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

62
src/assets/icons/ContactFormIcon/NameIcon.tsx
View File

@ -1,27 +1,45 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function NameIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.5 8.375C8.57107 8.375 10.25 6.69607 10.25 4.625C10.25 2.55393 8.57107 0.875 6.5 0.875C4.42893 0.875 2.75 2.55393 2.75 4.625C2.75 6.69607 4.42893 8.375 6.5 8.375Z" stroke={color} stroke-miterlimit="10"/>
<path d="M0.8125 11.6568C1.38844 10.659 2.21689 9.83044 3.21458 9.25436C4.21227 8.67828 5.34403 8.375 6.49609 8.375C7.64816 8.375 8.77992 8.67828 9.77761 9.25436C10.7753 9.83044 11.6037 10.659 12.1797 11.6568" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M0.765625 11.6914H11.9866" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function NameIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="13"
height="13"
viewBox="0 0 13 13"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M6.5 8.375C8.57107 8.375 10.25 6.69607 10.25 4.625C10.25 2.55393 8.57107 0.875 6.5 0.875C4.42893 0.875 2.75 2.55393 2.75 4.625C2.75 6.69607 4.42893 8.375 6.5 8.375Z"
stroke={color}
stroke-miterlimit="10"
/>
<path
d="M0.8125 11.6568C1.38844 10.659 2.21689 9.83044 3.21458 9.25436C4.21227 8.67828 5.34403 8.375 6.49609 8.375C7.64816 8.375 8.77992 8.67828 9.77761 9.25436C10.7753 9.83044 11.6037 10.659 12.1797 11.6568"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M0.765625 11.6914H11.9866"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

49
src/assets/icons/ContactFormIcon/PhoneIcon.tsx
View File

@ -1,25 +1,34 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function PhoneIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.41992 7.31237C5.90228 8.30847 6.70774 9.11187 7.70508 9.59166C7.77865 9.6265 7.86002 9.64157 7.94118 9.63541C8.02235 9.62925 8.10051 9.60205 8.16797 9.55651L9.63281 8.57799C9.69753 8.5341 9.77232 8.50731 9.85019 8.50014C9.92806 8.49297 10.0065 8.50564 10.0781 8.53698L12.8203 9.71471C12.914 9.75372 12.9923 9.82245 13.0432 9.91033C13.094 9.9982 13.1145 10.1004 13.1016 10.201C13.0146 10.8794 12.6835 11.5029 12.1702 11.9547C11.6568 12.4066 10.9964 12.656 10.3125 12.6561C8.19906 12.6561 6.17217 11.8166 4.67774 10.3221C3.18331 8.82769 2.34375 6.80081 2.34375 4.68737C2.3439 4.00346 2.59325 3.34304 3.04513 2.82968C3.49701 2.31633 4.12047 1.98522 4.79883 1.8983C4.89951 1.88537 5.00166 1.90589 5.08954 1.95671C5.17741 2.00754 5.24615 2.08583 5.28516 2.17955L6.46289 4.9276C6.49352 4.99812 6.50633 5.07508 6.5002 5.15172C6.49407 5.22835 6.46918 5.3023 6.42773 5.36705L5.44922 6.85534C5.40565 6.92265 5.38009 7.00001 5.37496 7.08003C5.36983 7.16005 5.38531 7.24004 5.41992 7.31237V7.31237Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function PhoneIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="15"
height="15"
viewBox="0 0 15 15"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M5.41992 7.31237C5.90228 8.30847 6.70774 9.11187 7.70508 9.59166C7.77865 9.6265 7.86002 9.64157 7.94118 9.63541C8.02235 9.62925 8.10051 9.60205 8.16797 9.55651L9.63281 8.57799C9.69753 8.5341 9.77232 8.50731 9.85019 8.50014C9.92806 8.49297 10.0065 8.50564 10.0781 8.53698L12.8203 9.71471C12.914 9.75372 12.9923 9.82245 13.0432 9.91033C13.094 9.9982 13.1145 10.1004 13.1016 10.201C13.0146 10.8794 12.6835 11.5029 12.1702 11.9547C11.6568 12.4066 10.9964 12.656 10.3125 12.6561C8.19906 12.6561 6.17217 11.8166 4.67774 10.3221C3.18331 8.82769 2.34375 6.80081 2.34375 4.68737C2.3439 4.00346 2.59325 3.34304 3.04513 2.82968C3.49701 2.31633 4.12047 1.98522 4.79883 1.8983C4.89951 1.88537 5.00166 1.90589 5.08954 1.95671C5.17741 2.00754 5.24615 2.08583 5.28516 2.17955L6.46289 4.9276C6.49352 4.99812 6.50633 5.07508 6.5002 5.15172C6.49407 5.22835 6.46918 5.3023 6.42773 5.36705L5.44922 6.85534C5.40565 6.92265 5.38009 7.00001 5.37496 7.08003C5.36983 7.16005 5.38531 7.24004 5.41992 7.31237V7.31237Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

90
src/assets/icons/ContactFormIcon/TextIcon.tsx
View File

@ -1,30 +1,70 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function TextIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.67188 1.60156L8.67188 13.3838" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.6016 4.21875H13.7768C13.8534 4.21875 13.9268 4.26814 13.9809 4.35604C14.035 4.44395 14.0655 4.56318 14.0655 4.6875V10.3125C14.0655 10.4368 14.035 10.556 13.9809 10.644C13.9268 10.7319 13.8534 10.7812 13.7768 10.7812H10.6016" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8.67081 10.7812H1.58194C1.41103 10.7812 1.24711 10.7319 1.12625 10.644C1.0054 10.556 0.9375 10.4368 0.9375 10.3125V4.6875C0.9375 4.56318 1.0054 4.44395 1.12625 4.35604C1.24711 4.26814 1.41103 4.21875 1.58194 4.21875H8.67081" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3.98438 6.5625H5.625" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.85156 1.60156H9.49219" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.85156 13.3828H9.49219" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.80469 6.5625V8.67188" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function TextIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="15"
height="15"
viewBox="0 0 15 15"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.67188 1.60156L8.67188 13.3838"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M10.6016 4.21875H13.7768C13.8534 4.21875 13.9268 4.26814 13.9809 4.35604C14.035 4.44395 14.0655 4.56318 14.0655 4.6875V10.3125C14.0655 10.4368 14.035 10.556 13.9809 10.644C13.9268 10.7319 13.8534 10.7812 13.7768 10.7812H10.6016"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M8.67081 10.7812H1.58194C1.41103 10.7812 1.24711 10.7319 1.12625 10.644C1.0054 10.556 0.9375 10.4368 0.9375 10.3125V4.6875C0.9375 4.56318 1.0054 4.44395 1.12625 4.35604C1.24711 4.26814 1.41103 4.21875 1.58194 4.21875H8.67081"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M3.98438 6.5625H5.625"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M7.85156 1.60156H9.49219"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M7.85156 13.3828H9.49219"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M4.80469 6.5625V8.67188"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

49
src/assets/icons/ContactFormIcon/supplementIcon.tsx
View File

@ -1,25 +1,34 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function SupplementIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.00781 4.04129V9.99117M10.0548 7H4.00202M7.00781 13C3.6941 13 1.00781 10.3137 1.00781 7C1.00781 3.68629 3.6941 1 7.00781 1C10.3215 1 13.0078 3.68629 13.0078 7C13.0078 10.3137 10.3215 13 7.00781 13Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function SupplementIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="14"
height="14"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7.00781 4.04129V9.99117M10.0548 7H4.00202M7.00781 13C3.6941 13 1.00781 10.3137 1.00781 7C1.00781 3.68629 3.6941 1 7.00781 1C10.3215 1 13.0078 3.68629 13.0078 7C13.0078 10.3137 10.3215 13 7.00781 13Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

67
src/assets/icons/CopyIcon.tsx
View File

@ -1,32 +1,49 @@
import { Box, useTheme } from "@mui/material";
interface Props {
color?: string;
bgcolor?: string;
marL?: string
color?: string;
bgcolor?: string;
marL?: string;
}
export default function CopyIcon({ color, bgcolor, marL }: Props) {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
bgcolor,
borderRadius: "6px",
height: "36px",
width: "36px",
display: "flex",
justifyContent: "center",
alignItems: "center",
marginLeft: 0 || marL
}}
>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21.75 21.75H26.25V9.75H14.25V14.25" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M21.75 14.25H9.75V26.25H21.75V14.25Z" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
bgcolor,
borderRadius: "6px",
height: "36px",
width: "36px",
display: "flex",
justifyContent: "center",
alignItems: "center",
marginLeft: 0 || marL,
}}
>
<svg
width="36"
height="36"
viewBox="0 0 36 36"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21.75 21.75H26.25V9.75H14.25V14.25"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M21.75 14.25H9.75V26.25H21.75V14.25Z"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

69
src/assets/icons/DomenIcon.tsx
View File

@ -1,31 +1,52 @@
import { Box, useTheme } from "@mui/material";
interface Props {
color: string;
bgcolor: string;
color: string;
bgcolor: string;
}
export default function DomenIcon({ color, bgcolor }: Props) {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
bgcolor,
borderRadius: "6px",
height: "36px",
width: "36px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.3906 26.8906C23.3612 26.8906 27.3906 22.8612 27.3906 17.8906C27.3906 12.9201 23.3612 8.89062 18.3906 8.89062C13.4201 8.89062 9.39062 12.9201 9.39062 17.8906C9.39062 22.8612 13.4201 26.8906 18.3906 26.8906Z" stroke={color} stroke-width="1.5" stroke-miterlimit="10"/>
<path d="M9.39062 17.8906H27.3906" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.3906 26.6453C20.4617 26.6453 22.1406 22.725 22.1406 17.8891C22.1406 13.0531 20.4617 9.13281 18.3906 9.13281C16.3196 9.13281 14.6406 13.0531 14.6406 17.8891C14.6406 22.725 16.3196 26.6453 18.3906 26.6453Z" stroke={color} stroke-width="1.5" stroke-miterlimit="10"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
bgcolor,
borderRadius: "6px",
height: "36px",
width: "36px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg
width="36"
height="36"
viewBox="0 0 36 36"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M18.3906 26.8906C23.3612 26.8906 27.3906 22.8612 27.3906 17.8906C27.3906 12.9201 23.3612 8.89062 18.3906 8.89062C13.4201 8.89062 9.39062 12.9201 9.39062 17.8906C9.39062 22.8612 13.4201 26.8906 18.3906 26.8906Z"
stroke={color}
stroke-width="1.5"
stroke-miterlimit="10"
/>
<path
d="M9.39062 17.8906H27.3906"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M18.3906 26.6453C20.4617 26.6453 22.1406 22.725 22.1406 17.8891C22.1406 13.0531 20.4617 9.13281 18.3906 9.13281C16.3196 9.13281 14.6406 13.0531 14.6406 17.8891C14.6406 22.725 16.3196 26.6453 18.3906 26.6453Z"
stroke={color}
stroke-width="1.5"
stroke-miterlimit="10"
/>
</svg>
</Box>
);
}

6
src/assets/icons/Frame 1171274368.svg
View File

@ -1,5 +1,5 @@
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.3125 20.4305L7.22812 23.018C7.11886 23.1084 6.9862 23.166 6.84553 23.184C6.70486 23.2021 6.56195 23.1799 6.43338 23.1201C6.30481 23.0602 6.19585 22.9651 6.11914 22.8458C6.04244 22.7265 6.00112 22.5879 6 22.4461V7.55859C6 7.35968 6.07902 7.16892 6.21967 7.02826C6.36032 6.88761 6.55109 6.80859 6.75 6.80859H23.25C23.4489 6.80859 23.6397 6.88761 23.7803 7.02826C23.921 7.16892 24 7.35968 24 7.55859V19.5586C24 19.7575 23.921 19.9483 23.7803 20.0889C23.6397 20.2296 23.4489 20.3086 23.25 20.3086H10.6594L10.3125 20.4305Z" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 12.0586H18" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 15.0586H18" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.3125 20.4305L7.22812 23.018C7.11886 23.1084 6.9862 23.166 6.84553 23.184C6.70486 23.2021 6.56195 23.1799 6.43338 23.1201C6.30481 23.0602 6.19585 22.9651 6.11914 22.8458C6.04244 22.7265 6.00112 22.5879 6 22.4461V7.55859C6 7.35968 6.07902 7.16892 6.21967 7.02826C6.36032 6.88761 6.55109 6.80859 6.75 6.80859H23.25C23.4489 6.80859 23.6397 6.88761 23.7803 7.02826C23.921 7.16892 24 7.35968 24 7.55859V19.5586C24 19.7575 23.921 19.9483 23.7803 20.0889C23.6397 20.2296 23.4489 20.3086 23.25 20.3086H10.6594L10.3125 20.4305Z" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M12 12.0586H18" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M12 15.0586H18" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 940 B

After

Width:  |  Height:  |  Size: 937 B

24
src/assets/icons/IconPlus.tsx
View File

@ -3,13 +3,31 @@ import { IconButton } from "@mui/material";
export default function IconPlus() {
return (
<IconButton>
<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 0H6C2.68629 0 0 2.68629 0 6V18C0 21.3137 2.68629 24 6 24H18C21.3137 24 24 21.3137 24 18V6C24 2.68629 21.3137 0 18 0Z"
fill="#7E2AEA"
/>
<path d="M3.75 12H20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path d="M12 3.75V20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M3.75 12H20.25"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12 3.75V20.25"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</IconButton>
);

12
src/assets/icons/Info.tsx
View File

@ -3,20 +3,26 @@ import { IconButton } from "@mui/material";
export default function Info() {
return (
<IconButton>
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
width="20"
height="20"
viewBox="0 0 20 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10 19C14.9706 19 19 14.9706 19 10C19 5.02944 14.9706 1 10 1C5.02944 1 1 5.02944 1 10C1 14.9706 5.02944 19 10 19Z"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
<path
d="M9.25 9.25H10V14.5H10.75"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
<path
d="M9.8125 7C10.4338 7 10.9375 6.49632 10.9375 5.875C10.9375 5.25368 10.4338 4.75 9.8125 4.75C9.19118 4.75 8.6875 5.25368 8.6875 5.875C8.6875 6.49632 9.19118 7 9.8125 7Z"

10
src/assets/icons/ShareNetwork.svg
View File

@ -1,8 +1,8 @@
<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="#F2F3F7"/>
<path d="M7.5 18.75C9.57107 18.75 11.25 17.0711 11.25 15C11.25 12.9289 9.57107 11.25 7.5 11.25C5.42893 11.25 3.75 12.9289 3.75 15C3.75 17.0711 5.42893 18.75 7.5 18.75Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.625 27.1875C22.6961 27.1875 24.375 25.5086 24.375 23.4375C24.375 21.3664 22.6961 19.6875 20.625 19.6875C18.5539 19.6875 16.875 21.3664 16.875 23.4375C16.875 25.5086 18.5539 27.1875 20.625 27.1875Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.625 10.3125C22.6961 10.3125 24.375 8.63357 24.375 6.5625C24.375 4.49143 22.6961 2.8125 20.625 2.8125C18.5539 2.8125 16.875 4.49143 16.875 6.5625C16.875 8.63357 18.5539 10.3125 20.625 10.3125Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M17.4766 8.58984L10.6562 12.9727" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.6562 17.0273L17.4766 21.4102" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.5 18.75C9.57107 18.75 11.25 17.0711 11.25 15C11.25 12.9289 9.57107 11.25 7.5 11.25C5.42893 11.25 3.75 12.9289 3.75 15C3.75 17.0711 5.42893 18.75 7.5 18.75Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M20.625 27.1875C22.6961 27.1875 24.375 25.5086 24.375 23.4375C24.375 21.3664 22.6961 19.6875 20.625 19.6875C18.5539 19.6875 16.875 21.3664 16.875 23.4375C16.875 25.5086 18.5539 27.1875 20.625 27.1875Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M20.625 10.3125C22.6961 10.3125 24.375 8.63357 24.375 6.5625C24.375 4.49143 22.6961 2.8125 20.625 2.8125C18.5539 2.8125 16.875 4.49143 16.875 6.5625C16.875 8.63357 18.5539 10.3125 20.625 10.3125Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M17.4766 8.58984L10.6562 12.9727" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M10.6562 17.0273L17.4766 21.4102" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

24
src/assets/icons/TrashIcon.tsx
View File

@ -1,35 +1,47 @@
export default function TrashIcon() {
return (
<svg width="30" height="31" viewBox="0 0 30 31" fill="none" xmlns="http://www.w3.org/2000/svg">
<svg
width="30"
height="31"
viewBox="0 0 30 31"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<rect y="0.8125" width="30" height="30" rx="6" fill="#333647" />
<path d="M23.25 9.0625H6.75" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M23.25 9.0625H6.75"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12.75 13.5625V19.5625"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
<path
d="M17.25 13.5625V19.5625"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
<path
d="M21.75 9.0625V23.3125C21.75 23.5114 21.671 23.7022 21.5303 23.8428C21.3897 23.9835 21.1989 24.0625 21 24.0625H9C8.80109 24.0625 8.61032 23.9835 8.46967 23.8428C8.32902 23.7022 8.25 23.5114 8.25 23.3125V9.0625"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
<path
d="M18.75 9.0625V7.5625C18.75 7.16468 18.592 6.78314 18.3107 6.50184C18.0294 6.22054 17.6478 6.0625 17.25 6.0625H12.75C12.3522 6.0625 11.9706 6.22054 11.6893 6.50184C11.408 6.78314 11.25 7.16468 11.25 7.5625V9.0625"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinejoin="round"
/>
</svg>
);

12
src/assets/icons/listChecks.svg
View File

@ -1,9 +1,9 @@
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M24 0H6C2.68629 0 0 2.68629 0 6V24C0 27.3137 2.68629 30 6 30H24C27.3137 30 30 27.3137 30 24V6C30 2.68629 27.3137 0 24 0Z" fill="#F2F3F7"/>
<path d="M4.6875 15H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.6875 7.5H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.6875 22.5H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M25.3125 5.625L21.2461 9.375L19.2188 7.5" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M25.3125 13.125L21.2461 16.875L19.2188 15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M25.3125 20.625L21.2461 24.375L19.2188 22.5" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.6875 15H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M4.6875 7.5H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M4.6875 22.5H15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M25.3125 5.625L21.2461 9.375L19.2188 7.5" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M25.3125 13.125L21.2461 16.875L19.2188 15" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M25.3125 20.625L21.2461 24.375L19.2188 22.5" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" strokeLinejoin="round"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 981 B

After

Width:  |  Height:  |  Size: 975 B

38
src/assets/icons/messagIcon.tsx
View File

@ -1,9 +1,33 @@
export default function MessageIcon() {
return (
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.3125 20.4305L7.22812 23.018C7.11886 23.1084 6.9862 23.166 6.84553 23.184C6.70486 23.2021 6.56195 23.1799 6.43338 23.1201C6.30481 23.0602 6.19585 22.9651 6.11914 22.8458C6.04244 22.7265 6.00112 22.5879 6 22.4461V7.55859C6 7.35968 6.07902 7.16892 6.21967 7.02826C6.36032 6.88761 6.55109 6.80859 6.75 6.80859H23.25C23.4489 6.80859 23.6397 6.88761 23.7803 7.02826C23.921 7.16892 24 7.35968 24 7.55859V19.5586C24 19.7575 23.921 19.9483 23.7803 20.0889C23.6397 20.2296 23.4489 20.3086 23.25 20.3086H10.6594L10.3125 20.4305Z" stroke="#9A9AAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 12.0586H18" stroke="#9A9AAF" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
<path d="M12 15.0586H18" stroke="#9A9AAF" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"/>
</svg>
);
return (
<svg
width="30"
height="30"
viewBox="0 0 30 30"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M10.3125 20.4305L7.22812 23.018C7.11886 23.1084 6.9862 23.166 6.84553 23.184C6.70486 23.2021 6.56195 23.1799 6.43338 23.1201C6.30481 23.0602 6.19585 22.9651 6.11914 22.8458C6.04244 22.7265 6.00112 22.5879 6 22.4461V7.55859C6 7.35968 6.07902 7.16892 6.21967 7.02826C6.36032 6.88761 6.55109 6.80859 6.75 6.80859H23.25C23.4489 6.80859 23.6397 6.88761 23.7803 7.02826C23.921 7.16892 24 7.35968 24 7.55859V19.5586C24 19.7575 23.921 19.9483 23.7803 20.0889C23.6397 20.2296 23.4489 20.3086 23.25 20.3086H10.6594L10.3125 20.4305Z"
stroke="#9A9AAF"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12 12.0586H18"
stroke="#9A9AAF"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M12 15.0586H18"
stroke="#9A9AAF"
strokeWidth="1.5"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
}

4
src/assets/icons/plus.svg
View File

@ -1,5 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 0H6C2.68629 0 0 2.68629 0 6V18C0 21.3137 2.68629 24 6 24H18C21.3137 24 24 21.3137 24 18V6C24 2.68629 21.3137 0 18 0Z" fill="#7E2AEA"/>
<path d="M3.75 12H20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 3.75V20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3.75 12H20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round"/>
<path d="M12 3.75V20.25" stroke="white" stroke-width="1.5" stroke-linecap="round" strokeLinejoin="round"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 467 B

After

Width:  |  Height:  |  Size: 465 B

95
src/assets/icons/qrIcon.tsx
View File

@ -1,28 +1,75 @@
import { Box, useTheme } from "@mui/material";
export default function QRIcon() {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.75 4.5H5.25C4.83579 4.5 4.5 4.83579 4.5 5.25V9.75C4.5 10.1642 4.83579 10.5 5.25 10.5H9.75C10.1642 10.5 10.5 10.1642 10.5 9.75V5.25C10.5 4.83579 10.1642 4.5 9.75 4.5Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M9.75 13.5H5.25C4.83579 13.5 4.5 13.8358 4.5 14.25V18.75C4.5 19.1642 4.83579 19.5 5.25 19.5H9.75C10.1642 19.5 10.5 19.1642 10.5 18.75V14.25C10.5 13.8358 10.1642 13.5 9.75 13.5Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18.75 4.5H14.25C13.8358 4.5 13.5 4.83579 13.5 5.25V9.75C13.5 10.1642 13.8358 10.5 14.25 10.5H18.75C19.1642 10.5 19.5 10.1642 19.5 9.75V5.25C19.5 4.83579 19.1642 4.5 18.75 4.5Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M13.5 13.5V16.5" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M13.5 19.5H16.5V13.5" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16.5 15H19.5" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M19.5 18V19.5" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.75 4.5H5.25C4.83579 4.5 4.5 4.83579 4.5 5.25V9.75C4.5 10.1642 4.83579 10.5 5.25 10.5H9.75C10.1642 10.5 10.5 10.1642 10.5 9.75V5.25C10.5 4.83579 10.1642 4.5 9.75 4.5Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M9.75 13.5H5.25C4.83579 13.5 4.5 13.8358 4.5 14.25V18.75C4.5 19.1642 4.83579 19.5 5.25 19.5H9.75C10.1642 19.5 10.5 19.1642 10.5 18.75V14.25C10.5 13.8358 10.1642 13.5 9.75 13.5Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M18.75 4.5H14.25C13.8358 4.5 13.5 4.83579 13.5 5.25V9.75C13.5 10.1642 13.8358 10.5 14.25 10.5H18.75C19.1642 10.5 19.5 10.1642 19.5 9.75V5.25C19.5 4.83579 19.1642 4.5 18.75 4.5Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M13.5 13.5V16.5"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M13.5 19.5H16.5V13.5"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M16.5 15H19.5"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M19.5 18V19.5"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

63
src/assets/icons/questionsPage/FlagIcon.tsx
View File

@ -1,27 +1,46 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function FlagIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5 27V6" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M5 21.0016C13 15.0016 19 27.0016 27 21.0016V6.00158C19 12.0016 13 0.00158215 5 6.00158" fill={color}/>
<path d="M5 21.0016C13 15.0016 19 27.0016 27 21.0016V6.00158C19 12.0016 13 0.00158203 5 6.00158" stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function FlagIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="32"
height="32"
viewBox="0 0 32 32"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M5 27V6"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M5 21.0016C13 15.0016 19 27.0016 27 21.0016V6.00158C19 12.0016 13 0.00158215 5 6.00158"
fill={color}
/>
<path
d="M5 21.0016C13 15.0016 19 27.0016 27 21.0016V6.00158C19 12.0016 13 0.00158203 5 6.00158"
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

103
src/assets/icons/questionsPage/FormatIcon1.tsx
View File

@ -1,35 +1,78 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function FormatIcon1({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z" fill="none"/>
<path d="M34.418 35L34.418 5" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M33 34L34.3953 36L35.7907 34" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16.4069 5.47656H6.47676C6.22748 5.47656 6.02539 5.85757 6.02539 6.32757V21.6457C6.02539 22.1157 6.22748 22.4967 6.47676 22.4967H16.4069C16.6562 22.4967 16.8583 22.1157 16.8583 21.6457V6.32757C16.8583 5.85757 16.6562 5.47656 16.4069 5.47656Z" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="9.2" cy="8.2" r="1.2" fill={color}/>
<path d="M17 36V26.8678C17 26.3885 16.7948 26 16.5417 26H6.45833C6.2052 26 6 26.3885 6 26.8678V36" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M30.5729 5.47656H20.6428C20.3935 5.47656 20.1914 5.85757 20.1914 6.32757V21.6457C20.1914 22.1157 20.3935 22.4967 20.6428 22.4967H30.5729C30.8222 22.4967 31.0243 22.1157 31.0243 21.6457V6.32757C31.0243 5.85757 30.8222 5.47656 30.5729 5.47656Z" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="23.2" cy="8.2" r="1.2" fill={color}/>
<path d="M31.0243 35.8867V26.9311C31.0243 26.4611 30.8222 26.0801 30.5729 26.0801H20.6428C20.3935 26.0801 20.1914 26.4611 20.1914 26.9311L20.1914 35.8867" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="23.2" cy="29.2" r="1.2" fill={color}/>
<ellipse cx="9.2" cy="29.2" rx="1.2" ry="1.20003" fill={color}/>
</svg>
</Box>
);
}
export default function FormatIcon1({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z"
fill="none"
/>
<path
d="M34.418 35L34.418 5"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M33 34L34.3953 36L35.7907 34"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M16.4069 5.47656H6.47676C6.22748 5.47656 6.02539 5.85757 6.02539 6.32757V21.6457C6.02539 22.1157 6.22748 22.4967 6.47676 22.4967H16.4069C16.6562 22.4967 16.8583 22.1157 16.8583 21.6457V6.32757C16.8583 5.85757 16.6562 5.47656 16.4069 5.47656Z"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<circle cx="9.2" cy="8.2" r="1.2" fill={color} />
<path
d="M17 36V26.8678C17 26.3885 16.7948 26 16.5417 26H6.45833C6.2052 26 6 26.3885 6 26.8678V36"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M30.5729 5.47656H20.6428C20.3935 5.47656 20.1914 5.85757 20.1914 6.32757V21.6457C20.1914 22.1157 20.3935 22.4967 20.6428 22.4967H30.5729C30.8222 22.4967 31.0243 22.1157 31.0243 21.6457V6.32757C31.0243 5.85757 30.8222 5.47656 30.5729 5.47656Z"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<circle cx="23.2" cy="8.2" r="1.2" fill={color} />
<path
d="M31.0243 35.8867V26.9311C31.0243 26.4611 30.8222 26.0801 30.5729 26.0801H20.6428C20.3935 26.0801 20.1914 26.4611 20.1914 26.9311L20.1914 35.8867"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<circle cx="23.2" cy="29.2" r="1.2" fill={color} />
<ellipse cx="9.2" cy="29.2" rx="1.2" ry="1.20003" fill={color} />
</svg>
</Box>
);
}

90
src/assets/icons/questionsPage/FormatIcon2.tsx
View File

@ -1,32 +1,70 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function FormatIcon2({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z" fill="none"/>
<path d="M33.9994 16.1953L35.8848 19.0233L33.9994 21.8514" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6.59824 16.1953L4.71289 19.0233L6.59824 21.8514" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<circle cx="13.2" cy="11.2" r="1.2" fill={color}/>
<circle cx="25.2" cy="11.2" r="1.2" fill={color}/>
<rect x="10" y="8" width="9" height="23" rx="1" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="22" y="8" width="9" height="23" rx="1" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z"
fill="none"
/>
<path
d="M33.9994 16.1953L35.8848 19.0233L33.9994 21.8514"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M6.59824 16.1953L4.71289 19.0233L6.59824 21.8514"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<circle cx="13.2" cy="11.2" r="1.2" fill={color} />
<circle cx="25.2" cy="11.2" r="1.2" fill={color} />
<rect
x="10"
y="8"
width="9"
height="23"
rx="1"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<rect
x="22"
y="8"
width="9"
height="23"
rx="1"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

61
src/assets/icons/questionsPage/ProportionsIcon11.tsx
View File

@ -1,27 +1,44 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function ProportionsIcon11({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z" fill="none"/>
<circle cx="9.6" cy="8.6" r="1.6" fill={color}/>
<rect x="5" y="5" width="30" height="30" rx="1" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function ProportionsIcon11({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z"
fill="none"
/>
<circle cx="9.6" cy="8.6" r="1.6" fill={color} />
<rect
x="5"
y="5"
width="30"
height="30"
rx="1"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

62
src/assets/icons/questionsPage/ProportionsIcon12.tsx
View File

@ -1,27 +1,45 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function ProportionsIcon12({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z" fill="none"/>
<circle cx="8.6" cy="13.6" r="1.6" fill={color}/>
<rect x="5" y="29" width="19" height="30" rx="1" transform="rotate(-90 5 29)" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function ProportionsIcon12({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z"
fill="none"
/>
<circle cx="8.6" cy="13.6" r="1.6" fill={color} />
<rect
x="5"
y="29"
width="19"
height="30"
rx="1"
transform="rotate(-90 5 29)"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

61
src/assets/icons/questionsPage/ProportionsIcon21.tsx
View File

@ -1,27 +1,44 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function ProportionsIcon21({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z" fill="none"/>
<circle cx="14.6" cy="8.6" r="1.6" fill={color}/>
<rect x="11" y="5" width="19" height="30" rx="1" stroke={color} stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function ProportionsIcon21({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M38.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H38.3333C39.2538 40 40 39.1046 40 38V2C40 0.89543 39.2538 0 38.3333 0Z"
fill="none"
/>
<circle cx="14.6" cy="8.6" r="1.6" fill={color} />
<rect
x="11"
y="5"
width="19"
height="30"
rx="1"
stroke={color}
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

52
src/assets/icons/questionsPage/StarIconMini.tsx
View File

@ -1,26 +1,36 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function StarIconMini({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="28" height="27" viewBox="0 0 28 27" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.551 21.8375L20.851 25.8375C21.6635 26.35 22.6635 25.5875 22.426 24.65L20.601 17.475C20.5516 17.2762 20.5595 17.0674 20.6236 16.8728C20.6877 16.6781 20.8056 16.5056 20.9635 16.375L26.6135 11.6625C27.351 11.05 26.976 9.81253 26.0135 9.75003L18.6385 9.27503C18.4372 9.26332 18.2438 9.19325 18.0817 9.07338C17.9197 8.95351 17.7961 8.78902 17.726 8.60003L14.976 1.67503C14.9032 1.47491 14.7706 1.30204 14.5961 1.17988C14.4217 1.05772 14.2139 0.992188 14.001 0.992188C13.788 0.992188 13.5802 1.05772 13.4058 1.17988C13.2314 1.30204 13.0988 1.47491 13.026 1.67503L10.276 8.60003C10.2059 8.78902 10.0823 8.95351 9.92021 9.07338C9.75816 9.19325 9.5647 9.26332 9.36347 9.27503L1.98847 9.75003C1.02597 9.81253 0.650971 11.05 1.38847 11.6625L7.03847 16.375C7.19639 16.5056 7.3142 16.6781 7.37834 16.8728C7.44247 17.0674 7.45032 17.2762 7.40097 17.475L5.71347 24.125C5.42597 25.25 6.62597 26.1625 7.58847 25.55L13.451 21.8375C13.6154 21.733 13.8062 21.6775 14.001 21.6775C14.1958 21.6775 14.3866 21.733 14.551 21.8375Z" fill={color} stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function StarIconMini({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="28"
height="27"
viewBox="0 0 28 27"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M14.551 21.8375L20.851 25.8375C21.6635 26.35 22.6635 25.5875 22.426 24.65L20.601 17.475C20.5516 17.2762 20.5595 17.0674 20.6236 16.8728C20.6877 16.6781 20.8056 16.5056 20.9635 16.375L26.6135 11.6625C27.351 11.05 26.976 9.81253 26.0135 9.75003L18.6385 9.27503C18.4372 9.26332 18.2438 9.19325 18.0817 9.07338C17.9197 8.95351 17.7961 8.78902 17.726 8.60003L14.976 1.67503C14.9032 1.47491 14.7706 1.30204 14.5961 1.17988C14.4217 1.05772 14.2139 0.992188 14.001 0.992188C13.788 0.992188 13.5802 1.05772 13.4058 1.17988C13.2314 1.30204 13.0988 1.47491 13.026 1.67503L10.276 8.60003C10.2059 8.78902 10.0823 8.95351 9.92021 9.07338C9.75816 9.19325 9.5647 9.26332 9.36347 9.27503L1.98847 9.75003C1.02597 9.81253 0.650971 11.05 1.38847 11.6625L7.03847 16.375C7.19639 16.5056 7.3142 16.6781 7.37834 16.8728C7.44247 17.0674 7.45032 17.2762 7.40097 17.475L5.71347 24.125C5.42597 25.25 6.62597 26.1625 7.58847 25.55L13.451 21.8375C13.6154 21.733 13.8062 21.6775 14.001 21.6775C14.1958 21.6775 14.3866 21.733 14.551 21.8375Z"
fill={color}
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

79
src/assets/icons/questionsPage/addEmoji.tsx
View File

@ -1,31 +1,62 @@
import { Box } from "@mui/material";
// interface Props {
// color: string;
// }
export default function AddEmoji() {
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="60" height="40" viewBox="0 0 60 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z" fill="#EEE4FC"/>
<path d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z" fill="#7E2AEA"/>
<path d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z" fill="white"/>
<path d="M20 31C21.0949 30.9993 22.1837 30.8371 23.2313 30.5187L31 20C31 17.8244 30.3549 15.6977 29.1462 13.8887C27.9375 12.0798 26.2195 10.6699 24.2095 9.83733C22.1995 9.00477 19.9878 8.78693 17.854 9.21137C15.7202 9.6358 13.7602 10.6835 12.2218 12.2218C10.6835 13.7602 9.6358 15.7202 9.21137 17.854C8.78693 19.9878 9.00477 22.1995 9.83733 24.2095C10.6699 26.2195 12.0798 27.9375 13.8887 29.1462C15.6977 30.3549 17.8244 31 20 31Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15.875 19.083C16.6344 19.083 17.25 18.4674 17.25 17.708C17.25 16.9486 16.6344 16.333 15.875 16.333C15.1156 16.333 14.5 16.9486 14.5 17.708C14.5 18.4674 15.1156 19.083 15.875 19.083Z" fill="#7E2AEA"/>
<path d="M24.125 19.083C24.8844 19.083 25.5 18.4674 25.5 17.708C25.5 16.9486 24.8844 16.333 24.125 16.333C23.3656 16.333 22.75 16.9486 22.75 17.708C22.75 18.4674 23.3656 19.083 24.125 19.083Z" fill="#7E2AEA"/>
<path d="M24.7677 22.75C24.2831 23.5849 23.5878 24.2778 22.7512 24.7595C21.9147 25.2412 20.9663 25.4947 20.001 25.4947C19.0357 25.4947 18.0874 25.2412 17.2508 24.7595C16.4143 24.2778 15.719 23.5849 15.2344 22.75" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="60"
height="40"
viewBox="0 0 60 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z"
fill="#EEE4FC"
/>
<path
d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z"
fill="#7E2AEA"
/>
<path
d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z"
fill="white"
/>
<path
d="M20 31C21.0949 30.9993 22.1837 30.8371 23.2313 30.5187L31 20C31 17.8244 30.3549 15.6977 29.1462 13.8887C27.9375 12.0798 26.2195 10.6699 24.2095 9.83733C22.1995 9.00477 19.9878 8.78693 17.854 9.21137C15.7202 9.6358 13.7602 10.6835 12.2218 12.2218C10.6835 13.7602 9.6358 15.7202 9.21137 17.854C8.78693 19.9878 9.00477 22.1995 9.83733 24.2095C10.6699 26.2195 12.0798 27.9375 13.8887 29.1462C15.6977 30.3549 17.8244 31 20 31Z"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M15.875 19.083C16.6344 19.083 17.25 18.4674 17.25 17.708C17.25 16.9486 16.6344 16.333 15.875 16.333C15.1156 16.333 14.5 16.9486 14.5 17.708C14.5 18.4674 15.1156 19.083 15.875 19.083Z"
fill="#7E2AEA"
/>
<path
d="M24.125 19.083C24.8844 19.083 25.5 18.4674 25.5 17.708C25.5 16.9486 24.8844 16.333 24.125 16.333C23.3656 16.333 22.75 16.9486 22.75 17.708C22.75 18.4674 23.3656 19.083 24.125 19.083Z"
fill="#7E2AEA"
/>
<path
d="M24.7677 22.75C24.2831 23.5849 23.5878 24.2778 22.7512 24.7595C21.9147 25.2412 20.9663 25.4947 20.001 25.4947C19.0357 25.4947 18.0874 25.2412 17.2508 24.7595C16.4143 24.2778 15.719 23.5849 15.2344 22.75"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

74
src/assets/icons/questionsPage/addImage.tsx
View File

@ -1,30 +1,58 @@
import { Box } from "@mui/material";
// interface Props {
// color: string;
// }
export default function AddImage() {
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="60" height="40" viewBox="0 0 60 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z" fill="#EEE4FC"/>
<path d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z" fill="#7E2AEA"/>
<path d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z" fill="white"/>
<path d="M30.9583 10H8.04167C7.46637 10 7 10.4477 7 11V29C7 29.5523 7.46637 30 8.04167 30H30.9583C31.5336 30 32 29.5523 32 29V11C32 10.4477 31.5336 10 30.9583 10Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7 24.9035L13.5495 18.3127C13.6464 18.2137 13.7619 18.135 13.8894 18.0813C14.0168 18.0276 14.1535 18 14.2917 18C14.4298 18 14.5666 18.0276 14.694 18.0813C14.8214 18.135 14.9369 18.2137 15.0339 18.3127L20.8411 24.1567C20.9381 24.2557 21.0536 24.3343 21.181 24.388C21.3084 24.4417 21.4452 24.4694 21.5833 24.4694C21.7215 24.4694 21.8582 24.4417 21.9856 24.388C22.1131 24.3343 22.2286 24.2557 22.3255 24.1567L25.0078 21.4574C25.1047 21.3584 25.2203 21.2797 25.3477 21.2261C25.4751 21.1724 25.6119 21.1447 25.75 21.1447C25.8881 21.1447 26.0249 21.1724 26.1523 21.2261C26.2797 21.2797 26.3953 21.3584 26.4922 21.4574L32 27" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M22.5 18C23.3284 18 24 17.3284 24 16.5C24 15.6716 23.3284 15 22.5 15C21.6716 15 21 15.6716 21 16.5C21 17.3284 21.6716 18 22.5 18Z" fill="#7E2AEA"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="60"
height="40"
viewBox="0 0 60 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z"
fill="#EEE4FC"
/>
<path
d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z"
fill="#7E2AEA"
/>
<path
d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z"
fill="white"
/>
<path
d="M30.9583 10H8.04167C7.46637 10 7 10.4477 7 11V29C7 29.5523 7.46637 30 8.04167 30H30.9583C31.5336 30 32 29.5523 32 29V11C32 10.4477 31.5336 10 30.9583 10Z"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M7 24.9035L13.5495 18.3127C13.6464 18.2137 13.7619 18.135 13.8894 18.0813C14.0168 18.0276 14.1535 18 14.2917 18C14.4298 18 14.5666 18.0276 14.694 18.0813C14.8214 18.135 14.9369 18.2137 15.0339 18.3127L20.8411 24.1567C20.9381 24.2557 21.0536 24.3343 21.181 24.388C21.3084 24.4417 21.4452 24.4694 21.5833 24.4694C21.7215 24.4694 21.8582 24.4417 21.9856 24.388C22.1131 24.3343 22.2286 24.2557 22.3255 24.1567L25.0078 21.4574C25.1047 21.3584 25.2203 21.2797 25.3477 21.2261C25.4751 21.1724 25.6119 21.1447 25.75 21.1447C25.8881 21.1447 26.0249 21.1724 26.1523 21.2261C26.2797 21.2797 26.3953 21.3584 26.4922 21.4574L32 27"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M22.5 18C23.3284 18 24 17.3284 24 16.5C24 15.6716 23.3284 15 22.5 15C21.6716 15 21 15.6716 21 16.5C21 17.3284 21.6716 18 22.5 18Z"
fill="#7E2AEA"
/>
</svg>
</Box>
);
}

69
src/assets/icons/questionsPage/addVideofile.tsx
View File

@ -1,29 +1,54 @@
import { Box } from "@mui/material";
// interface Props {
// color: string;
// }
export default function AddVideofile() {
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="60" height="40" viewBox="0 0 60 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z" fill="#EEE4FC"/>
<path d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z" fill="#7E2AEA"/>
<path d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z" fill="white"/>
<path d="M7.90476 10H22.381C23.3408 10 24.2613 10.4958 24.94 11.3783C25.6187 12.2608 26 13.4578 26 14.7059V28.8235C26 29.1355 25.9047 29.4348 25.735 29.6554C25.5653 29.8761 25.3352 30 25.0952 30H10.619C9.65922 30 8.7387 29.5042 8.05999 28.6217C7.38129 27.7392 7 26.5422 7 25.2941V11.1765C7 10.8645 7.09532 10.5652 7.265 10.3446C7.43467 10.1239 7.6648 10 7.90476 10V10Z" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M26 18L32 14V26L26 22" stroke="#7E2AEA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="60"
height="40"
viewBox="0 0 60 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M40.3333 0H1.66667C0.746192 0 0 0.89543 0 2V38C0 39.1046 0.746192 40 1.66667 40H40.3333V0Z"
fill="#EEE4FC"
/>
<path
d="M58 0H40V40H58C58.4602 40 60 39.1046 60 38V2C60 0.89543 58.4602 0 58 0Z"
fill="#7E2AEA"
/>
<path
d="M49.518 24.612C49.398 24.612 49.296 24.576 49.212 24.504C49.14 24.42 49.104 24.318 49.104 24.198V20.454H45.414C45.294 20.454 45.192 20.418 45.108 20.346C45.036 20.262 45 20.16 45 20.04V19.464C45 19.344 45.036 19.248 45.108 19.176C45.192 19.092 45.294 19.05 45.414 19.05H49.104V15.414C49.104 15.294 49.14 15.198 49.212 15.126C49.296 15.042 49.398 15 49.518 15H50.148C50.268 15 50.364 15.042 50.436 15.126C50.52 15.198 50.562 15.294 50.562 15.414V19.05H54.27C54.39 19.05 54.486 19.092 54.558 19.176C54.642 19.248 54.684 19.344 54.684 19.464V20.04C54.684 20.16 54.642 20.262 54.558 20.346C54.486 20.418 54.39 20.454 54.27 20.454H50.562V24.198C50.562 24.318 50.52 24.42 50.436 24.504C50.364 24.576 50.268 24.612 50.148 24.612H49.518Z"
fill="white"
/>
<path
d="M7.90476 10H22.381C23.3408 10 24.2613 10.4958 24.94 11.3783C25.6187 12.2608 26 13.4578 26 14.7059V28.8235C26 29.1355 25.9047 29.4348 25.735 29.6554C25.5653 29.8761 25.3352 30 25.0952 30H10.619C9.65922 30 8.7387 29.5042 8.05999 28.6217C7.38129 27.7392 7 26.5422 7 25.2941V11.1765C7 10.8645 7.09532 10.5652 7.265 10.3446C7.43467 10.1239 7.6648 10 7.90476 10V10Z"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M26 18L32 14V26L26 22"
stroke="#7E2AEA"
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

79
src/assets/icons/questionsPage/answer.tsx
View File

@ -1,33 +1,54 @@
import {Box, SxProps, Theme} from "@mui/material";
import { Box, SxProps, Theme } from "@mui/material";
interface Props {
color: string;
sx?: SxProps<Theme>
color: string;
sx?: SxProps<Theme>;
}
export default function Answer({color, sx}: Props) {
return (
<Box
sx={{
height: "38px",
width: "45px" ,
display: "flex",
alignItems: "center",
justifyContent: "center",
...sx
}}
>
<svg width="47" height="40" viewBox="0 0 47 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M44.125 29H2.875C1.83947 29 1 29.2239 1 29.5V38.5C1 38.7761 1.83947 39 2.875 39H44.125C45.1605 39 46 38.7761 46 38.5V29.5C46 29.2239 45.1605 29 44.125 29Z" stroke={color} strokeWidth="2" strokeLinecap="round" stroke-Linejoin="round"/>
<circle cx="6.13415" cy="34.1341" r="2.13415" fill={color}/>
<path d="M44.125 15H2.875C1.83947 15 1 15.2239 1 15.5V24.5C1 24.7761 1.83947 25 2.875 25H44.125C45.1605 25 46 24.7761 46 24.5V15.5C46 15.2239 45.1605 15 44.125 15Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
<circle cx="6.13415" cy="20.1341" r="2.13415" fill={color}/>
<path d="M44.125 1H2.875C1.83947 1 1 1.22386 1 1.5V10.5C1 10.7761 1.83947 11 2.875 11H44.125C45.1605 11 46 10.7761 46 10.5V1.5C46 1.22386 45.1605 1 44.125 1Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
<circle cx="6.13415" cy="6.13415" r="2.13415" fill={color}/>
</svg>
</Box>
);
}
export default function Answer({ color, sx }: Props) {
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
...sx,
}}
>
<svg
width="47"
height="40"
viewBox="0 0 47 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M44.125 29H2.875C1.83947 29 1 29.2239 1 29.5V38.5C1 38.7761 1.83947 39 2.875 39H44.125C45.1605 39 46 38.7761 46 38.5V29.5C46 29.2239 45.1605 29 44.125 29Z"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
<circle cx="6.13415" cy="34.1341" r="2.13415" fill={color} />
<path
d="M44.125 15H2.875C1.83947 15 1 15.2239 1 15.5V24.5C1 24.7761 1.83947 25 2.875 25H44.125C45.1605 25 46 24.7761 46 24.5V15.5C46 15.2239 45.1605 15 44.125 15Z"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
<circle cx="6.13415" cy="20.1341" r="2.13415" fill={color} />
<path
d="M44.125 1H2.875C1.83947 1 1 1.22386 1 1.5V10.5C1 10.7761 1.83947 11 2.875 11H44.125C45.1605 11 46 10.7761 46 10.5V1.5C46 1.22386 45.1605 1 44.125 1Z"
stroke={color}
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
<circle cx="6.13415" cy="6.13415" r="2.13415" fill={color} />
</svg>
</Box>
);
}

76
src/assets/icons/questionsPage/branching.tsx
View File

@ -1,28 +1,58 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function Branching({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.4939 11.5C7.46039 11.5 8.2439 10.7165 8.2439 9.75C8.2439 8.7835 7.46039 8 6.4939 8C5.5274 8 4.7439 8.7835 4.7439 9.75C4.7439 10.7165 5.5274 11.5 6.4939 11.5Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.2439 4C11.2104 4 11.9939 3.2165 11.9939 2.25C11.9939 1.2835 11.2104 0.5 10.2439 0.5C9.2774 0.5 8.4939 1.2835 8.4939 2.25C8.4939 3.2165 9.2774 4 10.2439 4Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M2.7439 4C3.71039 4 4.4939 3.2165 4.4939 2.25C4.4939 1.2835 3.71039 0.5 2.7439 0.5C1.7774 0.5 0.993896 1.2835 0.993896 2.25C0.993896 3.2165 1.7774 4 2.7439 4Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M2.74391 4V4.5C2.74308 4.69721 2.78132 4.89264 2.85641 5.075C2.9315 5.25736 3.04195 5.42305 3.18141 5.5625C3.32086 5.70196 3.48655 5.81241 3.66891 5.8875C3.85127 5.96259 4.0467 6.00083 4.24391 6H8.74391C8.94112 6.00083 9.13655 5.96259 9.31891 5.8875C9.50127 5.81241 9.66696 5.70196 9.80641 5.5625C9.94587 5.42305 10.0563 5.25736 10.1314 5.075C10.2065 4.89264 10.2447 4.69721 10.2439 4.5V4" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6.4939 6V8" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function Branching({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="13"
height="12"
viewBox="0 0 13 12"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M6.4939 11.5C7.46039 11.5 8.2439 10.7165 8.2439 9.75C8.2439 8.7835 7.46039 8 6.4939 8C5.5274 8 4.7439 8.7835 4.7439 9.75C4.7439 10.7165 5.5274 11.5 6.4939 11.5Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M10.2439 4C11.2104 4 11.9939 3.2165 11.9939 2.25C11.9939 1.2835 11.2104 0.5 10.2439 0.5C9.2774 0.5 8.4939 1.2835 8.4939 2.25C8.4939 3.2165 9.2774 4 10.2439 4Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M2.7439 4C3.71039 4 4.4939 3.2165 4.4939 2.25C4.4939 1.2835 3.71039 0.5 2.7439 0.5C1.7774 0.5 0.993896 1.2835 0.993896 2.25C0.993896 3.2165 1.7774 4 2.7439 4Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M2.74391 4V4.5C2.74308 4.69721 2.78132 4.89264 2.85641 5.075C2.9315 5.25736 3.04195 5.42305 3.18141 5.5625C3.32086 5.70196 3.48655 5.81241 3.66891 5.8875C3.85127 5.96259 4.0467 6.00083 4.24391 6H8.74391C8.94112 6.00083 9.13655 5.96259 9.31891 5.8875C9.50127 5.81241 9.66696 5.70196 9.80641 5.5625C9.94587 5.42305 10.0563 5.25736 10.1314 5.075C10.2065 4.89264 10.2447 4.69721 10.2439 4.5V4"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M6.4939 6V8"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

63
src/assets/icons/questionsPage/clue.tsx
View File

@ -1,27 +1,46 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function Clue({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.84402 10.0557C1.09957 8.79972 0.839172 7.31518 1.11171 5.88081C1.38424 4.44643 2.17097 3.16085 3.32419 2.26542C4.47741 1.36998 5.91782 0.926281 7.375 1.0176C8.83219 1.10892 10.2059 1.72899 11.2383 2.7614C12.2707 3.7938 12.8908 5.16754 12.9821 6.62472C13.0734 8.08191 12.6297 9.52231 11.7343 10.6755C10.8389 11.8288 9.5533 12.6155 8.11892 12.888C6.68454 13.1606 5.20001 12.9002 3.94402 12.1557V12.1557L1.86902 12.7432C1.784 12.7681 1.69387 12.7696 1.60805 12.7477C1.52224 12.7257 1.44391 12.6811 1.38128 12.6184C1.31865 12.5558 1.27402 12.4775 1.25207 12.3917C1.23011 12.3059 1.23165 12.2157 1.25652 12.1307L1.84402 10.0557Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M5.00635 5.99316H9.00635" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M5.00635 7.99316H9.00635" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function Clue({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="14"
height="14"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M1.84402 10.0557C1.09957 8.79972 0.839172 7.31518 1.11171 5.88081C1.38424 4.44643 2.17097 3.16085 3.32419 2.26542C4.47741 1.36998 5.91782 0.926281 7.375 1.0176C8.83219 1.10892 10.2059 1.72899 11.2383 2.7614C12.2707 3.7938 12.8908 5.16754 12.9821 6.62472C13.0734 8.08191 12.6297 9.52231 11.7343 10.6755C10.8389 11.8288 9.5533 12.6155 8.11892 12.888C6.68454 13.1606 5.20001 12.9002 3.94402 12.1557V12.1557L1.86902 12.7432C1.784 12.7681 1.69387 12.7696 1.60805 12.7477C1.52224 12.7257 1.44391 12.6811 1.38128 12.6184C1.31865 12.5558 1.27402 12.4775 1.25207 12.3917C1.23011 12.3059 1.23165 12.2157 1.25652 12.1307L1.84402 10.0557Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M5.00635 5.99316H9.00635"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M5.00635 7.99316H9.00635"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

60
src/assets/icons/questionsPage/enterIcon.tsx
View File

@ -1,27 +1,49 @@
import { Box } from "@mui/material";
// interface Props {
// color: string;
// }
export default function EnterIcon() {
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16.5 9.75V12.75H7.5" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M9.75 10.5L7.5 12.75L9.75 15" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.25 4.5H3.75C3.33579 4.5 3 4.83579 3 5.25V18.75C3 19.1642 3.33579 19.5 3.75 19.5H20.25C20.6642 19.5 21 19.1642 21 18.75V5.25C21 4.83579 20.6642 4.5 20.25 4.5Z" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
)
return (
<Box
sx={{
height: "38px",
width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M16.5 9.75V12.75H7.5"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M9.75 10.5L7.5 12.75L9.75 15"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M20.25 4.5H3.75C3.33579 4.5 3 4.83579 3 5.25V18.75C3 19.1642 3.33579 19.5 3.75 19.5H20.25C20.6642 19.5 21 19.1642 21 18.75V5.25C21 4.83579 20.6642 4.5 20.25 4.5Z"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

50
src/assets/icons/questionsPage/hashtagIcon.tsx
View File

@ -1,25 +1,35 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function HashtagIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3 11.3333H29M3 20.6667H29M13.6364 2L8.90909 30M23.0909 2L18.3636 30" stroke={color} stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function HashtagIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="32"
height="32"
viewBox="0 0 32 32"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M3 11.3333H29M3 20.6667H29M13.6364 2L8.90909 30M23.0909 2L18.3636 30"
stroke={color}
stroke-width="3"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

51
src/assets/icons/questionsPage/heartIcon.tsx
View File

@ -1,25 +1,36 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function HeartIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M16 27C16 27 3.5 20 3.5 11.5C3.5 9.99737 4.02062 8.54114 4.97328 7.37908C5.92593 6.21703 7.25178 5.42093 8.72525 5.12624C10.1987 4.83154 11.7288 5.05646 13.0551 5.76272C14.3814 6.46898 15.4221 7.61296 16 9.00001C16.5779 7.61296 17.6186 6.46898 18.9449 5.76272C20.2712 5.05646 21.8013 4.83154 23.2748 5.12624C24.7482 5.42093 26.0741 6.21703 27.0267 7.37908C27.9794 8.54114 28.5 9.99737 28.5 11.5C28.5 20 16 27 16 27Z" fill={color} stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function HeartIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="32"
height="32"
viewBox="0 0 32 32"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M16 27C16 27 3.5 20 3.5 11.5C3.5 9.99737 4.02062 8.54114 4.97328 7.37908C5.92593 6.21703 7.25178 5.42093 8.72525 5.12624C10.1987 4.83154 11.7288 5.05646 13.0551 5.76272C14.3814 6.46898 15.4221 7.61296 16 9.00001C16.5779 7.61296 17.6186 6.46898 18.9449 5.76272C20.2712 5.05646 21.8013 4.83154 23.2748 5.12624C24.7482 5.42093 26.0741 6.21703 27.0267 7.37908C27.9794 8.54114 28.5 9.99737 28.5 11.5C28.5 20 16 27 16 27Z"
fill={color}
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

60
src/assets/icons/questionsPage/imgIcon.tsx
View File

@ -1,26 +1,44 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function ImgIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.4939 0.5H1.4939C1.21775 0.5 0.993896 0.723858 0.993896 1V11C0.993896 11.2761 1.21775 11.5 1.4939 11.5H11.4939C11.77 11.5 11.9939 11.2761 11.9939 11V1C11.9939 0.723858 11.77 0.5 11.4939 0.5Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M11.9939 7.99995L9.35015 5.35619C9.30362 5.30895 9.24817 5.27144 9.18701 5.24583C9.12584 5.22022 9.0602 5.20703 8.9939 5.20703C8.92759 5.20703 8.86195 5.22022 8.80079 5.24583C8.73963 5.27144 8.68417 5.30895 8.63765 5.35619L5.85015 8.1437C5.80362 8.19094 5.74817 8.22845 5.68701 8.25406C5.62584 8.27967 5.5602 8.29286 5.4939 8.29286C5.42759 8.29286 5.36195 8.27967 5.30079 8.25406C5.23963 8.22845 5.18417 8.19094 5.13765 8.1437L3.85015 6.85619C3.80362 6.80895 3.74817 6.77144 3.68701 6.74583C3.62584 6.72022 3.5602 6.70703 3.4939 6.70703C3.42759 6.70703 3.36195 6.72022 3.30079 6.74583C3.23963 6.77144 3.18417 6.80895 3.13765 6.85619L0.993896 8.99995" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.7439 4.5C5.15811 4.5 5.4939 4.16421 5.4939 3.75C5.4939 3.33579 5.15811 3 4.7439 3C4.32968 3 3.9939 3.33579 3.9939 3.75C3.9939 4.16421 4.32968 4.5 4.7439 4.5Z" fill={color}/>
</svg>
</Box>
);
}
export default function ImgIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="13"
height="12"
viewBox="0 0 13 12"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.4939 0.5H1.4939C1.21775 0.5 0.993896 0.723858 0.993896 1V11C0.993896 11.2761 1.21775 11.5 1.4939 11.5H11.4939C11.77 11.5 11.9939 11.2761 11.9939 11V1C11.9939 0.723858 11.77 0.5 11.4939 0.5Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M11.9939 7.99995L9.35015 5.35619C9.30362 5.30895 9.24817 5.27144 9.18701 5.24583C9.12584 5.22022 9.0602 5.20703 8.9939 5.20703C8.92759 5.20703 8.86195 5.22022 8.80079 5.24583C8.73963 5.27144 8.68417 5.30895 8.63765 5.35619L5.85015 8.1437C5.80362 8.19094 5.74817 8.22845 5.68701 8.25406C5.62584 8.27967 5.5602 8.29286 5.4939 8.29286C5.42759 8.29286 5.36195 8.27967 5.30079 8.25406C5.23963 8.22845 5.18417 8.19094 5.13765 8.1437L3.85015 6.85619C3.80362 6.80895 3.74817 6.77144 3.68701 6.74583C3.62584 6.72022 3.5602 6.70703 3.4939 6.70703C3.42759 6.70703 3.36195 6.72022 3.30079 6.74583C3.23963 6.77144 3.18417 6.80895 3.13765 6.85619L0.993896 8.99995"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M4.7439 4.5C5.15811 4.5 5.4939 4.16421 5.4939 3.75C5.4939 3.33579 5.15811 3 4.7439 3C4.32968 3 3.9939 3.33579 3.9939 3.75C3.9939 4.16421 4.32968 4.5 4.7439 4.5Z"
fill={color}
/>
</svg>
</Box>
);
}

65
src/assets/icons/questionsPage/lightbulbIcon.tsx
View File

@ -1,27 +1,48 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function LightbulbIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11 29H21" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M9.83761 20.8739C8.6471 19.9482 7.68288 18.7637 7.01801 17.4102C6.35313 16.0566 6.00504 14.5694 6.00011 13.0614C5.97511 7.6364 10.3376 3.1239 15.7626 2.9989C17.8622 2.94913 19.9242 3.56166 21.6561 4.74961C23.388 5.93756 24.7019 7.64064 25.4115 9.6173C26.1211 11.594 26.1904 13.7439 25.6094 15.7621C25.0285 17.7803 23.827 19.5644 22.1751 20.8614C21.8102 21.1435 21.5146 21.5052 21.311 21.919C21.1073 22.3328 21.001 22.7877 21.0001 23.2489V23.9989C21.0001 24.2641 20.8948 24.5185 20.7072 24.706C20.5197 24.8935 20.2653 24.9989 20.0001 24.9989H12.0001C11.7349 24.9989 11.4805 24.8935 11.293 24.706C11.1055 24.5185 11.0001 24.2641 11.0001 23.9989V23.2489C10.997 22.7912 10.8909 22.34 10.6896 21.9289C10.4884 21.5177 10.1972 21.1572 9.83761 20.8739V20.8739Z" stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.01801 17.4102C7.68288 18.7637 8.6471 19.9482 9.83761 20.8739C10.1972 21.1572 10.4884 21.5177 10.6896 21.9289C10.8909 22.34 10.997 22.7912 11.0001 23.2489V23.9989C11.0001 24.2641 11.1055 24.5185 11.293 24.706C11.4805 24.8935 11.7349 24.9989 12.0001 24.9989H20.0001C20.2653 24.9989 20.5197 24.8935 20.7072 24.706C20.8948 24.5185 21.0001 24.2641 21.0001 23.9989V23.2489C21.001 22.7877 21.1073 22.3328 21.311 21.919C21.5146 21.5052 21.8102 21.1435 22.1751 20.8614C23.827 19.5644 25.0285 17.7803 25.6094 15.7621C26.1904 13.7439 26.1211 11.594 25.4115 9.6173C24.7019 7.64064 23.388 5.93756 21.6561 4.74961C19.9242 3.56166 17.8622 2.94913 15.7626 2.9989C10.3376 3.1239 5.97511 7.6364 6.00011 13.0614C6.00504 14.5694 6.35313 16.0566 7.01801 17.4102ZM17.1464 6.31013C16.7108 6.23629 16.2978 6.52956 16.2239 6.96517C16.1501 7.40078 16.4434 7.81378 16.879 7.88762C17.9379 8.06713 18.915 8.57088 19.6754 9.32936C20.4358 10.0878 20.9421 11.0636 21.1243 12.1221C21.1992 12.5575 21.613 12.8497 22.0484 12.7748C22.4838 12.6998 22.7761 12.2861 22.7011 11.8507C22.4627 10.4657 21.8003 9.18896 20.8053 8.19655C19.8104 7.20413 18.5319 6.545 17.1464 6.31013Z" fill={color}/>
</svg>
</Box>
);
}
export default function LightbulbIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="32"
height="32"
viewBox="0 0 32 32"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11 29H21"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M9.83761 20.8739C8.6471 19.9482 7.68288 18.7637 7.01801 17.4102C6.35313 16.0566 6.00504 14.5694 6.00011 13.0614C5.97511 7.6364 10.3376 3.1239 15.7626 2.9989C17.8622 2.94913 19.9242 3.56166 21.6561 4.74961C23.388 5.93756 24.7019 7.64064 25.4115 9.6173C26.1211 11.594 26.1904 13.7439 25.6094 15.7621C25.0285 17.7803 23.827 19.5644 22.1751 20.8614C21.8102 21.1435 21.5146 21.5052 21.311 21.919C21.1073 22.3328 21.001 22.7877 21.0001 23.2489V23.9989C21.0001 24.2641 20.8948 24.5185 20.7072 24.706C20.5197 24.8935 20.2653 24.9989 20.0001 24.9989H12.0001C11.7349 24.9989 11.4805 24.8935 11.293 24.706C11.1055 24.5185 11.0001 24.2641 11.0001 23.9989V23.2489C10.997 22.7912 10.8909 22.34 10.6896 21.9289C10.4884 21.5177 10.1972 21.1572 9.83761 20.8739V20.8739Z"
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M7.01801 17.4102C7.68288 18.7637 8.6471 19.9482 9.83761 20.8739C10.1972 21.1572 10.4884 21.5177 10.6896 21.9289C10.8909 22.34 10.997 22.7912 11.0001 23.2489V23.9989C11.0001 24.2641 11.1055 24.5185 11.293 24.706C11.4805 24.8935 11.7349 24.9989 12.0001 24.9989H20.0001C20.2653 24.9989 20.5197 24.8935 20.7072 24.706C20.8948 24.5185 21.0001 24.2641 21.0001 23.9989V23.2489C21.001 22.7877 21.1073 22.3328 21.311 21.919C21.5146 21.5052 21.8102 21.1435 22.1751 20.8614C23.827 19.5644 25.0285 17.7803 25.6094 15.7621C26.1904 13.7439 26.1211 11.594 25.4115 9.6173C24.7019 7.64064 23.388 5.93756 21.6561 4.74961C19.9242 3.56166 17.8622 2.94913 15.7626 2.9989C10.3376 3.1239 5.97511 7.6364 6.00011 13.0614C6.00504 14.5694 6.35313 16.0566 7.01801 17.4102ZM17.1464 6.31013C16.7108 6.23629 16.2978 6.52956 16.2239 6.96517C16.1501 7.40078 16.4434 7.81378 16.879 7.88762C17.9379 8.06713 18.915 8.57088 19.6754 9.32936C20.4358 10.0878 20.9421 11.0636 21.1243 12.1221C21.1992 12.5575 21.613 12.8497 22.0484 12.7748C22.4838 12.6998 22.7761 12.2861 22.7011 11.8507C22.4627 10.4657 21.8003 9.18896 20.8053 8.19655C19.8104 7.20413 18.5319 6.545 17.1464 6.31013Z"
fill={color}
/>
</svg>
</Box>
);
}

63
src/assets/icons/questionsPage/likeIcon.tsx
View File

@ -1,27 +1,46 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function LikeIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 17H14V30H8C7.73478 30 7.48043 29.8946 7.29289 29.7071C7.10536 29.5196 7 29.2652 7 29V18C7 17.7348 7.10536 17.4804 7.29289 17.2929C7.48043 17.1054 7.73478 17 8 17V17Z" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14 17L19 7C20.0609 7 21.0783 7.42143 21.8284 8.17157C22.5786 8.92172 23 9.93913 23 11V14H30.7375C31.0211 13.9993 31.3015 14.0593 31.56 14.176C31.8185 14.2926 32.049 14.4632 32.2361 14.6764C32.4232 14.8895 32.5625 15.1402 32.6447 15.4116C32.7268 15.683 32.75 15.9689 32.7125 16.25L31.2125 28.25C31.1518 28.7317 30.918 29.1749 30.5546 29.4969C30.1912 29.8189 29.723 29.9977 29.2375 30H14" fill={color}/>
<path d="M14 17L19 7C20.0609 7 21.0783 7.42143 21.8284 8.17157C22.5786 8.92172 23 9.93913 23 11V14H30.7375C31.0211 13.9993 31.3015 14.0593 31.56 14.176C31.8185 14.2926 32.049 14.4632 32.2361 14.6764C32.4232 14.8895 32.5625 15.1402 32.6447 15.4116C32.7268 15.683 32.75 15.9689 32.7125 16.25L31.2125 28.25C31.1518 28.7317 30.918 29.1749 30.5546 29.4969C30.1912 29.8189 29.723 29.9977 29.2375 30H14" stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function LikeIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="40"
height="40"
viewBox="0 0 40 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8 17H14V30H8C7.73478 30 7.48043 29.8946 7.29289 29.7071C7.10536 29.5196 7 29.2652 7 29V18C7 17.7348 7.10536 17.4804 7.29289 17.2929C7.48043 17.1054 7.73478 17 8 17V17Z"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M14 17L19 7C20.0609 7 21.0783 7.42143 21.8284 8.17157C22.5786 8.92172 23 9.93913 23 11V14H30.7375C31.0211 13.9993 31.3015 14.0593 31.56 14.176C31.8185 14.2926 32.049 14.4632 32.2361 14.6764C32.4232 14.8895 32.5625 15.1402 32.6447 15.4116C32.7268 15.683 32.75 15.9689 32.7125 16.25L31.2125 28.25C31.1518 28.7317 30.918 29.1749 30.5546 29.4969C30.1912 29.8189 29.723 29.9977 29.2375 30H14"
fill={color}
/>
<path
d="M14 17L19 7C20.0609 7 21.0783 7.42143 21.8284 8.17157C22.5786 8.92172 23 9.93913 23 11V14H30.7375C31.0211 13.9993 31.3015 14.0593 31.56 14.176C31.8185 14.2926 32.049 14.4632 32.2361 14.6764C32.4232 14.8895 32.5625 15.1402 32.6447 15.4116C32.7268 15.683 32.75 15.9689 32.7125 16.25L31.2125 28.25C31.1518 28.7317 30.918 29.1749 30.5546 29.4969C30.1912 29.8189 29.723 29.9977 29.2375 30H14"
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

48
src/assets/icons/questionsPage/settingIcon.tsx
View File

@ -1,24 +1,34 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function SettingIcon({color}: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.6839 3.43834C13.0118 4.20415 13.0921 5.05335 12.9135 5.86705C12.7348 6.68076 12.3062 7.41823 11.6876 7.97622C11.069 8.53421 10.2914 8.88478 9.4636 8.97885C8.63585 9.07292 7.7994 8.90579 7.07135 8.50084V8.50084L3.5651 12.5633C3.28331 12.8451 2.90112 13.0034 2.5026 13.0034C2.10409 13.0034 1.72189 12.8451 1.4401 12.5633C1.15831 12.2816 1 11.8994 1 11.5008C1 11.1023 1.15831 10.7201 1.4401 10.4383L5.5026 6.93209C5.09766 6.20405 4.93052 5.3676 5.0246 4.53984C5.11867 3.71209 5.46924 2.93447 6.02723 2.31586C6.58522 1.69725 7.32269 1.26862 8.13639 1.08998C8.95009 0.911332 9.79929 0.991618 10.5651 1.31959L7.9401 3.93834L8.29635 5.70709L10.0651 6.06334L12.6839 3.43834Z" stroke={color} stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function SettingIcon({ color }: Props) {
return (
<Box
sx={{
// height: "38px",
// width: "45px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="14"
height="14"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.6839 3.43834C13.0118 4.20415 13.0921 5.05335 12.9135 5.86705C12.7348 6.68076 12.3062 7.41823 11.6876 7.97622C11.069 8.53421 10.2914 8.88478 9.4636 8.97885C8.63585 9.07292 7.7994 8.90579 7.07135 8.50084V8.50084L3.5651 12.5633C3.28331 12.8451 2.90112 13.0034 2.5026 13.0034C2.10409 13.0034 1.72189 12.8451 1.4401 12.5633C1.15831 12.2816 1 11.8994 1 11.5008C1 11.1023 1.15831 10.7201 1.4401 10.4383L5.5026 6.93209C5.09766 6.20405 4.93052 5.3676 5.0246 4.53984C5.11867 3.71209 5.46924 2.93447 6.02723 2.31586C6.58522 1.69725 7.32269 1.26862 8.13639 1.08998C8.95009 0.911332 9.79929 0.991618 10.5651 1.31959L7.9401 3.93834L8.29635 5.70709L10.0651 6.06334L12.6839 3.43834Z"
stroke={color}
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

83
src/assets/icons/questionsPage/tropfyIcon.tsx
View File

@ -1,29 +1,64 @@
import { Box } from "@mui/material";
interface Props {
color: string;
color: string;
}
export default function TropfyIcon({color}: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7 7V13.8875C7 18.85 10.975 22.9625 15.9375 23C17.1246 23.0082 18.3017 22.7815 19.4008 22.3329C20.5 21.8843 21.4995 21.2227 22.3419 20.3862C23.1843 19.5496 23.8528 18.5547 24.309 17.4586C24.7652 16.3626 25 15.1872 25 14V7C25 6.73478 24.8946 6.48043 24.7071 6.29289C24.5196 6.10536 24.2652 6 24 6H8C7.73478 6 7.48043 6.10536 7.29289 6.29289C7.10536 6.48043 7 6.73478 7 7Z" fill={color} stroke={color} stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 28H20" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16 23V28" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M24.7754 16H26.0004C27.0613 16 28.0787 15.5786 28.8288 14.8284C29.579 14.0783 30.0004 13.0609 30.0004 12V10C30.0004 9.73478 29.895 9.48043 29.7075 9.29289C29.52 9.10536 29.2656 9 29.0004 9H25.0004" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.25078 16H5.98828C4.92742 16 3.91 15.5786 3.15985 14.8284C2.40971 14.0783 1.98828 13.0609 1.98828 12V10C1.98828 9.73478 2.09364 9.48043 2.28117 9.29289C2.46871 9.10536 2.72306 9 2.98828 9H6.98828" stroke={color} stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
export default function TropfyIcon({ color }: Props) {
return (
<Box
sx={{
height: "30px",
width: "30px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<svg
width="32"
height="32"
viewBox="0 0 32 32"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M7 7V13.8875C7 18.85 10.975 22.9625 15.9375 23C17.1246 23.0082 18.3017 22.7815 19.4008 22.3329C20.5 21.8843 21.4995 21.2227 22.3419 20.3862C23.1843 19.5496 23.8528 18.5547 24.309 17.4586C24.7652 16.3626 25 15.1872 25 14V7C25 6.73478 24.8946 6.48043 24.7071 6.29289C24.5196 6.10536 24.2652 6 24 6H8C7.73478 6 7.48043 6.10536 7.29289 6.29289C7.10536 6.48043 7 6.73478 7 7Z"
fill={color}
stroke={color}
stroke-width="1.6"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12 28H20"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M16 23V28"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M24.7754 16H26.0004C27.0613 16 28.0787 15.5786 28.8288 14.8284C29.579 14.0783 30.0004 13.0609 30.0004 12V10C30.0004 9.73478 29.895 9.48043 29.7075 9.29289C29.52 9.10536 29.2656 9 29.0004 9H25.0004"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M7.25078 16H5.98828C4.92742 16 3.91 15.5786 3.15985 14.8284C2.40971 14.0783 1.98828 13.0609 1.98828 12V10C1.98828 9.73478 2.09364 9.48043 2.28117 9.29289C2.46871 9.10536 2.72306 9 2.98828 9H6.98828"
stroke={color}
stroke-width="2"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

63
src/assets/icons/telegramIcon.tsx
View File

@ -1,24 +1,47 @@
import { Box, useTheme } from "@mui/material";
export default function TelegramIcon() {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.24863 12.6484L16.6768 20.064C16.7742 20.1502 16.8923 20.2096 17.0196 20.2364C17.1469 20.2631 17.279 20.2563 17.4029 20.2166C17.5268 20.1769 17.6382 20.1057 17.7262 20.0099C17.8142 19.9141 17.8758 19.797 17.9049 19.6702L21.4299 4.27649C21.4594 4.14392 21.4524 4.00581 21.4096 3.87691C21.3668 3.748 21.2898 3.63314 21.1868 3.54459C21.0838 3.45604 20.9587 3.39711 20.8249 3.37411C20.691 3.35111 20.5534 3.3649 20.4268 3.41399L3.12051 10.2109C2.42676 10.4827 2.52051 11.4952 3.25176 11.6452L8.24863 12.6484Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8.25 12.6453L21.0094 3.42969" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12.4594 16.3516L9.53437 19.2766C9.43002 19.3825 9.29653 19.4551 9.15085 19.485C9.00517 19.5149 8.85388 19.5008 8.71622 19.4446C8.57856 19.3883 8.46073 19.2924 8.37772 19.169C8.2947 19.0456 8.25025 18.9003 8.25 18.7516V12.6484" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.24863 12.6484L16.6768 20.064C16.7742 20.1502 16.8923 20.2096 17.0196 20.2364C17.1469 20.2631 17.279 20.2563 17.4029 20.2166C17.5268 20.1769 17.6382 20.1057 17.7262 20.0099C17.8142 19.9141 17.8758 19.797 17.9049 19.6702L21.4299 4.27649C21.4594 4.14392 21.4524 4.00581 21.4096 3.87691C21.3668 3.748 21.2898 3.63314 21.1868 3.54459C21.0838 3.45604 20.9587 3.39711 20.8249 3.37411C20.691 3.35111 20.5534 3.3649 20.4268 3.41399L3.12051 10.2109C2.42676 10.4827 2.52051 11.4952 3.25176 11.6452L8.24863 12.6484Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M8.25 12.6453L21.0094 3.42969"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
<path
d="M12.4594 16.3516L9.53437 19.2766C9.43002 19.3825 9.29653 19.4551 9.15085 19.485C9.00517 19.5149 8.85388 19.5008 8.71622 19.4446C8.57856 19.3883 8.46073 19.2924 8.37772 19.169C8.2947 19.0456 8.25025 18.9003 8.25 18.7516V12.6484"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}

47
src/assets/icons/tiktokIcon.tsx
View File

@ -1,22 +1,33 @@
import { Box, useTheme } from "@mui/material";
export default function TiktokIcon() {
const theme = useTheme();
const theme = useTheme();
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.75 9.9375C17.28 11.0361 19.1164 11.6263 21 11.625V7.875C19.6076 7.875 18.2723 7.32188 17.2877 6.33731C16.3031 5.35274 15.75 4.01739 15.75 2.625H12V14.625C12 15.0948 11.8739 15.5559 11.6349 15.9603C11.3959 16.3647 11.0528 16.6976 10.6413 16.9242C10.2298 17.1508 9.76502 17.2629 9.29548 17.2486C8.82594 17.2344 8.36882 17.0944 7.97181 16.8433C7.5748 16.5922 7.25245 16.2392 7.03838 15.821C6.82432 15.4029 6.72639 14.9349 6.75481 14.466C6.78323 13.9971 6.93695 13.5445 7.19995 13.1552C7.46294 12.766 7.82557 12.4544 8.25 12.2531V8.35312C7.05617 8.56716 5.94816 9.11732 5.05605 9.93901C4.16394 10.7607 3.52474 11.8198 3.21349 12.9921C2.90224 14.1643 2.93185 15.4011 3.29885 16.5571C3.66585 17.7131 4.355 18.7404 5.28541 19.5185C6.21583 20.2965 7.34889 20.793 8.5516 20.9497C9.7543 21.1063 10.9767 20.9166 12.0754 20.4029C13.1741 19.8891 14.1034 19.0726 14.7543 18.0492C15.4052 17.0257 15.7506 15.8379 15.75 14.625V9.9375Z" stroke="#4D4D4D" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</Box>
);
}
return (
<Box
sx={{
height: "18px",
width: "18px",
display: "flex",
justifyContent: "center",
alignItems: "center",
}}
>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M15.75 9.9375C17.28 11.0361 19.1164 11.6263 21 11.625V7.875C19.6076 7.875 18.2723 7.32188 17.2877 6.33731C16.3031 5.35274 15.75 4.01739 15.75 2.625H12V14.625C12 15.0948 11.8739 15.5559 11.6349 15.9603C11.3959 16.3647 11.0528 16.6976 10.6413 16.9242C10.2298 17.1508 9.76502 17.2629 9.29548 17.2486C8.82594 17.2344 8.36882 17.0944 7.97181 16.8433C7.5748 16.5922 7.25245 16.2392 7.03838 15.821C6.82432 15.4029 6.72639 14.9349 6.75481 14.466C6.78323 13.9971 6.93695 13.5445 7.19995 13.1552C7.46294 12.766 7.82557 12.4544 8.25 12.2531V8.35312C7.05617 8.56716 5.94816 9.11732 5.05605 9.93901C4.16394 10.7607 3.52474 11.8198 3.21349 12.9921C2.90224 14.1643 2.93185 15.4011 3.29885 16.5571C3.66585 17.7131 4.355 18.7404 5.28541 19.5185C6.21583 20.2965 7.34889 20.793 8.5516 20.9497C9.7543 21.1063 10.9767 20.9166 12.0754 20.4029C13.1741 19.8891 14.1034 19.0726 14.7543 18.0492C15.4052 17.0257 15.7506 15.8379 15.75 14.625V9.9375Z"
stroke="#4D4D4D"
stroke-width="1.5"
stroke-linecap="round"
strokeLinejoin="round"
/>
</svg>
</Box>
);
}