diff --git a/lib/components/ViewPublicationPage/questions/Emoji.tsx b/lib/components/ViewPublicationPage/questions/Emoji.tsx index ee0c7df..798e00f 100644 --- a/lib/components/ViewPublicationPage/questions/Emoji.tsx +++ b/lib/components/ViewPublicationPage/questions/Emoji.tsx @@ -18,6 +18,10 @@ import { sendAnswer } from "@api/quizRelase"; import { enqueueSnackbar } from "notistack"; import type { QuizQuestionEmoji } from "../../../model/questionTypes/emoji"; import { useQuizData } from "@contexts/QuizDataContext"; +import { polyfillCountryFlagEmojis } from "country-flag-emoji-polyfill"; + + +polyfillCountryFlagEmojis(); import { useState } from "react"; type EmojiProps = { @@ -36,7 +40,11 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => { return ( - {currentQuestion.title} + {currentQuestion.title} { height: variant.answer.length <= 60 ? undefined : "60px", overflow: "auto", paddingLeft: "45px", + "&::-webkit-scrollbar": { + width: "4px", + }, + "&::-webkit-scrollbar-thumb": { + backgroundColor: "#b8babf", + } }, }} value={index} @@ -172,5 +186,4 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => { ); - }; diff --git a/lib/components/ViewPublicationPage/questions/Images.tsx b/lib/components/ViewPublicationPage/questions/Images.tsx index c77d713..7f564cf 100644 --- a/lib/components/ViewPublicationPage/questions/Images.tsx +++ b/lib/components/ViewPublicationPage/questions/Images.tsx @@ -22,7 +22,7 @@ type ImagesProps = { }; export const Images = ({ currentQuestion }: ImagesProps) => { - const { quizId } =useQuizData(); + const { quizId } = useQuizData(); const { answers } = useQuizViewStore(); const theme = useTheme(); const answer = answers.find(({ questionId }) => questionId === currentQuestion.id)?.answer; @@ -31,7 +31,7 @@ export const Images = ({ currentQuestion }: ImagesProps) => { return ( - {currentQuestion.title} + {currentQuestion.title} { onClick={async (event) => { event.preventDefault(); - console.log("пытаюсь передать qid") - console.log(quizId) try { await sendAnswer({ @@ -94,8 +92,6 @@ export const Images = ({ currentQuestion }: ImagesProps) => { deleteAnswer(currentQuestion.id); try { - console.log("пытаюсь передать qid") - console.log(quizId) await sendAnswer({ questionId: currentQuestion.id, body: "", @@ -142,6 +138,12 @@ export const Images = ({ currentQuestion }: ImagesProps) => { height: variant.answer.length <= 60 ? undefined : "60px", overflow: "auto", paddingLeft: "45px", + "&::-webkit-scrollbar": { + width: "4px", + }, + "&::-webkit-scrollbar-thumb": { + backgroundColor: "#b8babf", + } }, }} value={index} diff --git a/lib/components/ViewPublicationPage/questions/Rating.tsx b/lib/components/ViewPublicationPage/questions/Rating.tsx index 652085c..cc4209d 100644 --- a/lib/components/ViewPublicationPage/questions/Rating.tsx +++ b/lib/components/ViewPublicationPage/questions/Rating.tsx @@ -71,7 +71,7 @@ export const Rating = ({ currentQuestion }: RatingProps) => { return ( - {currentQuestion.title} + {currentQuestion.title} { height: variant.answer.length <= 60 ? undefined : "60px", overflow: "auto", paddingLeft: "45px", + "&::-webkit-scrollbar": { + width: "4px", + }, + "&::-webkit-scrollbar-thumb": { + backgroundColor: "#b8babf", + } } }} value={index} diff --git a/lib/utils/themes/generic.ts b/lib/utils/themes/generic.ts index a50e66f..e658b98 100644 --- a/lib/utils/themes/generic.ts +++ b/lib/utils/themes/generic.ts @@ -89,6 +89,7 @@ const theme = createTheme({ fontWeight: 500, }, fontFamily: [ + "Twemoji Country Flags", "Rubik", "-apple-system", "BlinkMacSystemFont", @@ -134,4 +135,4 @@ theme.typography.infographic = { } }; -export default theme; \ No newline at end of file +export default theme; diff --git a/package.json b/package.json index abab542..567f75c 100755 --- a/package.json +++ b/package.json @@ -36,30 +36,30 @@ "@mui/material": "^5.10.14", "@mui/x-date-pickers": "^6.16.1", "@types/node": "^16.7.13", - "@types/react-dom": "^18.2.17", "@types/react": "^18.2.43", + "@types/react-dom": "^18.2.17", "@typescript-eslint/eslint-plugin": "^6.14.0", "@typescript-eslint/parser": "^6.14.0", "@vitejs/plugin-react": "^4.2.1", "axios": "^1.5.1", "cypress": "^13.6.1", "emoji-mart": "^5.5.2", + "eslint": "^8.55.0", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.5", - "eslint": "^8.55.0", "immer": "^10.0.3", "moment": "^2.30.1", "nanoid": "^5.0.3", "notistack": "^3.0.1", + "react": "^18.2.0", "react-dom": "^18.2.0", "react-error-boundary": "^4.0.12", "react-router-dom": "^6.21.3", - "react": "^18.2.0", "swr": "^2.2.4", "typescript": "^5.2.2", "use-debounce": "^9.0.4", - "vite-plugin-dts": "^3.7.2", "vite": "^5.0.8", + "vite-plugin-dts": "^3.7.2", "zustand": "^4.3.8" }, "peerDependencies": { @@ -76,12 +76,15 @@ "moment": "^2.30.1", "nanoid": "^5.0.3", "notistack": "^3.0.1", + "react": "^18.2.0", "react-dom": "^18.2.0", "react-error-boundary": "^4.0.12", "react-router-dom": "^6.21.3", - "react": "^18.2.0", "swr": "^2.2.4", "use-debounce": "^9.0.4", "zustand": "^4.3.8" + }, + "dependencies": { + "country-flag-emoji-polyfill": "^0.1.8" } } diff --git a/yarn.lock b/yarn.lock index fbe71e5..841478e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1574,6 +1574,11 @@ cosmiconfig@^7.0.0: path-type "^4.0.0" yaml "^1.10.0" +country-flag-emoji-polyfill@^0.1.8: + version "0.1.8" + resolved "https://registry.yarnpkg.com/country-flag-emoji-polyfill/-/country-flag-emoji-polyfill-0.1.8.tgz#d2cfb23dd2f949b80d83eb9822b613bf62957173" + integrity sha512-Mbah52sADS3gshUYhK5142gtUuJpHYOXlXtLFI3Ly4RqgkmPMvhX9kMZSTqDM8P7UqtSW99eHKFphhQSGXA3Cg== + cross-spawn@^7.0.0, cross-spawn@^7.0.2: version "7.0.3" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"