fix: rating inputs

src/constants/rating.ts

@@ -12,7 +12,6 @@ export const QUIZ_QUESTION_RATING: Omit<QuizQuestionRating, "id"> = {
     innerName: "",
     steps: 5,
     ratingExpanded: false,
-    ratingDescription: "",
     form: "star",
     ratingNegativeDescription: "",
     ratingPositiveDescription: "",

src/model/questionTypes/rating.ts

@@ -15,7 +15,6 @@ export interface QuizQuestionRating extends QuizQuestionBase {
     innerName: string;
     steps: number;
     ratingExpanded: boolean;
-    ratingDescription: string;
     /** Форма иконки */
     form: string;
     hint: QuestionHint;

src/pages/Questions/RatingOptions/RatingOptions.tsx

@@ -98,17 +98,17 @@ export default function RatingOptions({ totalIndex }: Props) {
     <>
       <Box
         sx={{
-          width: isMobile ? "auto" : `${question.content.steps * 44}px`,
-          minWidth: "200px",
-          maxWidth: "440px",
           display: "flex",
           px: "20px",
           flexDirection: "column",
           gap: "20px",
+          marginTop: isMobile ? "20px" : 0,
         }}
       >
         <Box
           sx={{
+            width: isMobile ? "auto" : `${question.content.steps * 44}px`,
+            maxWidth: "440px",
             display: "flex",
             justifyContent: "space-between",
             padding: "0 10px",
@@ -154,17 +154,17 @@ export default function RatingOptions({ totalIndex }: Props) {
             </Box>
           ))}
         </Box>
-        {!question.content.ratingDescription && (
+        <Box
-          <Box
+          sx={{
-            sx={{
+            mb: "20px",
-              mb: "20px",
+            display: "flex",
-              display: "flex",
+            alignItems: "center",
-              alignItems: "center",
+            justifyContent: "space-between",
-              justifyContent: "space-between",
+            maxWidth: "410px",
-              maxWidth: isMobile ? "303px" : "290px",
+            width: "100%",
-              width: "100%",
+          }}
-            }}
+        >
-          >
+          <Box sx={{ minWidth: isMobile ? "140px" : "205px" }}>
             <Typography
               ref={negativeRef}
               sx={{
@@ -190,10 +190,10 @@ export default function RatingOptions({ totalIndex }: Props) {
               onBlur={({ target }) => debounceNegativeDescription(target.value)}
               sx={{
                 width: negativeTextWidth + 10 + "px",
+                maxWidth: isMobile ? "140px" : "230px",
                 background: "transparent",
                 fontSize: "18px",
                 minWidth: "95px",
-                maxWidth: "230px",
                 transition: "0.2s",
                 "& .MuiInputBase-root": {
                   "& .MuiInputBase-input": {
@@ -214,6 +214,8 @@ export default function RatingOptions({ totalIndex }: Props) {
                 },
               }}
             />
+          </Box>
+          <Box sx={{ minWidth: isMobile ? "140px" : "205px" }}>
             <Typography
               ref={positiveRef}
               sx={{
@@ -238,10 +240,10 @@ export default function RatingOptions({ totalIndex }: Props) {
               onBlur={({ target }) => debouncePositiveDescription(target.value)}
               sx={{
                 width: positiveTextWidth + 10 + "px",
+                maxWidth: isMobile ? "140px" : "230px",
                 background: "transparent",
                 fontSize: "18px",
                 minWidth: "95px",
-                maxWidth: "230px",
                 transition: "0.2s",
                 "& .MuiInputBase-root": {
                   "& .MuiInputBase-input": {
@@ -263,7 +265,7 @@ export default function RatingOptions({ totalIndex }: Props) {
               }}
             />
           </Box>
-        )}
+        </Box>
       </Box>
       <ButtonsOptions
         switchState={switchState}