correction of working capacity

SurveyFrontend/src/components/SurveyInfo/SurveyInfo.tsx

@@ -9,34 +9,50 @@ const SurveyInfo: React.FC = () => {
     const titleTextareaRef = useRef<HTMLTextAreaElement>(null);
     const descriptionTextareaRef = useRef<HTMLTextAreaElement>(null);
 
+    const adjustTextareaHeight = (textarea: HTMLTextAreaElement | null) => {
+        if (textarea) {
+            // Сброс высоты перед расчетом
+            textarea.style.height = 'auto';
+            // Устанавливаем высоту равной scrollHeight + небольшой отступ
+            textarea.style.height = `${textarea.scrollHeight}px`;
+            // Центрируем содержимое вертикально
+            textarea.style.paddingTop = `${Math.max(0, (textarea.clientHeight - textarea.scrollHeight) / 2)}px`;
+        }
+    };
+
     const handleDescriptionChange = (descripEvent: React.ChangeEvent<HTMLTextAreaElement>) => {
         setDescriptionSurvey(descripEvent.target.value);
-    }
+        adjustTextareaHeight(descripEvent.target);
+    };
 
     const handleNewTitleChange = (titleEvent: React.ChangeEvent<HTMLTextAreaElement>) => {
         setTitleSurvey(titleEvent.target.value);
-    }
+        adjustTextareaHeight(titleEvent.target);
+    };
+
+    useEffect(() => {
+        if (showNewTitleField && titleTextareaRef.current) {
+            titleTextareaRef.current.focus();
+            adjustTextareaHeight(titleTextareaRef.current);
+        }
+    }, [showNewTitleField]);
+
+    useEffect(() => {
+        if (showDescriptionField && descriptionTextareaRef.current) {
+            descriptionTextareaRef.current.focus();
+            adjustTextareaHeight(descriptionTextareaRef.current);
+        }
+    }, [showDescriptionField]);
+
 
     const handleAddNewTitleClick = () => {
         setShowNewTitleField(true);
     }
 
-    useEffect(() => {
-        if (showNewTitleField && titleTextareaRef.current) {
-            titleTextareaRef.current.focus();
-        }
-    }, [showNewTitleField]);
-
     const handleAddDescriptionClick = () => {
         setShowDescriptionField(true);
     }
 
-    useEffect(() => {
-        if (showDescriptionField && descriptionTextareaRef.current){
-            descriptionTextareaRef.current.focus();
-        }
-    }, [showDescriptionField]);
-
     const handleTitleKeyDown = (titleClickEnter: React.KeyboardEvent<HTMLTextAreaElement>) => {
         if (titleClickEnter.key === 'Enter'){
             titleClickEnter.preventDefault();
@@ -64,7 +80,7 @@ const SurveyInfo: React.FC = () => {
     };
 
 
-    const renderDescription = ()=> {
+    const renderDescription = () => {
         if (descriptionSurvey && !showDescriptionField) {
             return (
                 <button className={styles.description} onClick={handleParagraphClick}>
@@ -73,17 +89,18 @@ const SurveyInfo: React.FC = () => {
             );
         } else if (showDescriptionField) {
             return (
-                <p className={styles.description}>
-                    <textarea
-                        ref={descriptionTextareaRef}
-                        className={styles.textareaDescrip}
-                        value={descriptionSurvey}
-                        placeholder={'Добавить описание'}
-                        onChange={handleDescriptionChange}
-                        onKeyDown={handleDescriptionKeyDown}
-                        onBlur={handleDescriptionBlur}
-                    />
-                </p>
+                <div className={styles.descriptionWrapper}>
+                <textarea
+                    ref={descriptionTextareaRef}
+                    className={styles.textareaDescrip}
+                    value={descriptionSurvey}
+                    placeholder={'Добавить описание'}
+                    onChange={handleDescriptionChange}
+                    onKeyDown={handleDescriptionKeyDown}
+                    onBlur={handleDescriptionBlur}
+                    rows={1} // Начальное количество строк
+                />
+                </div>
             );
         } else {
             return (