change QuestionList, style QuestionItem

SurveyFrontend/src/components/QuestionItem/QuestionItem.module.css

@@ -9,11 +9,32 @@
     border-radius: 14px;
 }
 
-.questionCard:last-child{
-    margin-bottom: 0;
-}
-
 .questionContainer{
     display: flex;
     flex-direction: column;
+}
+
+.questionTextarea{
+    border: none;
+    outline: none;
+    resize: none;
+    margin-bottom: 5px;
+    font-size: 24px;
+    font-weight: 600;
+}
+
+.buttonQuestion{
+    border: none;
+    outline: none;
+    background-color: #ffffff;
+    padding: 0;
+}
+
+.textQuestion{
+    margin-top: 0;
+    width: 100%;
+    font-size: 24px;
+    font-weight: 600;
+    margin-bottom: 35px;
+    text-align: start;
 }

SurveyFrontend/src/components/QuestionItem/QuestionItem.tsx

@@ -83,8 +83,8 @@ const QuestionItem: React.FC<QuestionItemProps> = ({indexQuestion, initialTextQu
                         placeholder={initialTextQuestion}
                     />
                 ) : (
-                    <button className={styles.textQuestion} onClick={handleQuestionClick}>
-                        <h2>{textQuestion || initialTextQuestion}</h2>
+                    <button className={styles.buttonQuestion} onClick={handleQuestionClick}>
+                        <h2 className={styles.textQuestion}>{textQuestion || initialTextQuestion}</h2>
                     </button>
                 )}
                 {answerOption.map((answerText, index) => (

SurveyFrontend/src/components/QuestionsList/QuestionsList.tsx

@@ -6,20 +6,28 @@ interface QuestionsListProps {}
 
 interface Question {
     id: number;
+    text: string
 }
 
 const QuestionsList: React.FC<QuestionsListProps> = () => {
     const [questions, setQuestions] = useState<Question[]>([
-        {id: 1},
+        {id: 1, text: ''},
     ]);
 
     const handleAddQuestion = () => {
-        // Find the highest ID in the current questions list
         const maxId = questions.reduce((max, question) => Math.max(max, question.id), 0);
         const newQuestion: Question = {
-            id: maxId + 1, // Increment the ID
+            id: maxId + 1,
+            text: ''
         };
-        setQuestions([...questions, newQuestion]); // Add the new question to the state
+        setQuestions([...questions, newQuestion]);
+    };
+
+    const handleQuestionChange = (index: number, value: string) => {
+        const newQuestions = [...questions];
+        newQuestions[index] = {...newQuestions[index], text: value};
+
+        setQuestions(newQuestions);
     };
 
     return (
@@ -28,6 +36,8 @@ const QuestionsList: React.FC<QuestionsListProps> = () => {
                 <QuestionItem
                     key={question.id}
                     indexQuestion={index + 1}
+                    valueQuestion={''}
+                    onChangeQuestion={(value) => handleQuestionChange(index, value)}
                 />
             ))}
             <AddQuestionButton onClick={handleAddQuestion} />

SurveyFrontend/src/components/SurveyInfo/SurveyInfo.module.css

@@ -24,12 +24,14 @@
     text-align: center;
     font-size: 20px;
     font-weight: 600;
+    line-height: 20px;
     margin-bottom: 23px;
     word-break: break-word;
     padding: 0;
 }
 
 .textareaTitle{
+    margin-top: -17px;
     width: 80%;
     padding-top: 35px;
     resize: none;