From 47126ec94a2969ec4dfdd5488fd354ea69261c16 Mon Sep 17 00:00:00 2001
From: AdLer-Lukas <95357660+AdLer-Lukas@users.noreply.github.com>
Date: Tue, 20 Feb 2024 15:00:21 +0100
Subject: [PATCH] changed style and text of AdaptivityElement Feedback and Hint

---
 .../AdaptivityElementAnswerFeedback.tsx            | 14 ++++++++------
 .../AdaptivityElementDialogContainer.tsx           |  6 +++---
 .../UIComponents/AdaptivityElementHint.tsx         |  4 +++-
 .../LearningSpaceGoalPanel.tsx                     |  6 +++---
 .../AdaptivityElementDialogContainer.test.tsx.snap |  2 +-
 .../AdaptivityElementHint.test.tsx.snap            |  2 +-
 src/localize/de/learningElement.json               |  6 +++---
 7 files changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementAnswerFeedback.tsx b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementAnswerFeedback.tsx
index 2536c0bef..713150a7d 100644
--- a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementAnswerFeedback.tsx
+++ b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementAnswerFeedback.tsx
@@ -49,12 +49,14 @@ export default function AdaptivityElementAnswerFeedback({
   }, [currentQuestion, currentTask, isCorrect, translate]);
 
   return (
-    <div className="flex flex-col w-full my-4 h-fit">
-      {currentQuestion.isRequired && isCorrect && (
-        <div>{translate("requiredQuestionSolvedCorrectly")}</div>
-      )}
-      {contentText && <div className="h-10">{contentText.current}</div>}
-      <div className="flex justify-end w-1/2">
+    <div className="flex flex-col my-4 pl-4 pr-2 h-fit gap-4">
+      <div className="flex flex-col items-start justify-start p-2 bg-buttonbgblue rounded-xl gap-2">
+        {currentQuestion.isRequired && isCorrect && (
+          <div className="">{translate("requiredQuestionSolvedCorrectly")}</div>
+        )}
+        {contentText && <div className="">{contentText.current}</div>}
+      </div>
+      <div className="flex justify-end w-full">
         <StyledButton shape="freefloatcenter" onClick={closeFeedback}>
           <p className="text-sm">{translate("nextButton")}</p>
         </StyledButton>
diff --git a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementDialogContainer.tsx b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementDialogContainer.tsx
index ccb5816a3..6d547460e 100644
--- a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementDialogContainer.tsx
+++ b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementDialogContainer.tsx
@@ -183,7 +183,7 @@ export default function AdaptivityElementDialogContainer({
 
               {/* Content */}
               {currentTask === null && currentQuestion === null && (
-                <div className="flex items-center justify-center px-1 mb-4 h-fit rounded-lg font-regular !text-sm lg:m-4">
+                <div className="flex items-center justify-center px-1 mb-4 h-fit rounded-lg font-regular !text-sm lg:mx-4">
                   <AdaptivityElementTaskSelection
                     tasks={contentData.tasks}
                     setHeaderText={setHeaderText}
@@ -192,7 +192,7 @@ export default function AdaptivityElementDialogContainer({
                 </div>
               )}
               {currentTask !== null && currentQuestion === null && (
-                <div className="flex items-center justify-center px-1 mb-4 rounded-lg font-regular lg:m-4">
+                <div className="flex items-center justify-center px-1 mb-4 rounded-lg font-regular lg:mx-4">
                   <AdaptivityElementQuestionSelection
                     selectedTask={currentTask}
                     setHeaderText={setHeaderText}
@@ -206,7 +206,7 @@ export default function AdaptivityElementDialogContainer({
                 currentQuestion !== null &&
                 !showAnswerFeedback &&
                 selectedHint === null && (
-                  <div className="flex items-center justify-center px-1 mb-4 rounded-lg font-regular h-fit lg:m-4">
+                  <div className="flex items-center justify-center px-1 mb-4 rounded-lg font-regular h-fit lg:mx-4">
                     <AdaptivityElementAnswerSelection
                       question={currentQuestion}
                       setHeaderText={setHeaderText}
diff --git a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementHint.tsx b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementHint.tsx
index 61f451276..aa94ede22 100644
--- a/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementHint.tsx
+++ b/src/Components/Core/Presentation/Adaptivity/AdaptivityElement/UIComponents/AdaptivityElementHint.tsx
@@ -21,7 +21,9 @@ export default function AdaptivityElementHint({
       {hint.hintAction.hintActionType ===
         AdaptivityElementActionTypes.CommentAction &&
         hint.hintAction.textData !== undefined && (
-          <div className="pl-4 my-4 font-bold">{hint.hintAction.textData}</div>
+          <div className="pl-4 my-4 flex items-center justify-center p-2 bg-buttonbgblue rounded-xl">
+            {hint.hintAction.textData}
+          </div>
         )}
 
       {hint.hintAction.hintActionType ===
diff --git a/src/Components/Core/Presentation/React/LearningSpaceDisplay/LearningSpaceGoalPanel/LearningSpaceGoalPanel.tsx b/src/Components/Core/Presentation/React/LearningSpaceDisplay/LearningSpaceGoalPanel/LearningSpaceGoalPanel.tsx
index 2b0c642a1..c9a68d57d 100644
--- a/src/Components/Core/Presentation/React/LearningSpaceDisplay/LearningSpaceGoalPanel/LearningSpaceGoalPanel.tsx
+++ b/src/Components/Core/Presentation/React/LearningSpaceDisplay/LearningSpaceGoalPanel/LearningSpaceGoalPanel.tsx
@@ -25,7 +25,7 @@ export default function LearningSpaceGoalPanel() {
   if (!viewModel || !controller || goals?.length <= 0) return null;
 
   return (
-    <>
+    <div>
       <img
         className="w-[48px] lg:w-[69px]"
         src={GoalIcon}
@@ -34,7 +34,7 @@ export default function LearningSpaceGoalPanel() {
       ></img>
 
       {isOpen && (
-        <StyledContainer className="fixed z-10 max-w-2xl p-2 overflow-hidden rounded-lg top-12 right-0 md:top-20 lg:right-40 bg-buttonbgblue">
+        <StyledContainer className="fixed z-10 max-w-2xl max-h-[90vh] p-2 overflow-auto rounded-lg top-12 right-0 md:top-20 lg:right-40 bg-buttonbgblue">
           <div className="flex flex-col gap-4 m-2">
             {goals && (
               <div className="flex flex-row">
@@ -97,6 +97,6 @@ export default function LearningSpaceGoalPanel() {
           </div>
         </StyledContainer>
       )}
-    </>
+    </div>
   );
 }
diff --git a/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementDialogContainer.test.tsx.snap b/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementDialogContainer.test.tsx.snap
index a92470518..fd641ed97 100644
--- a/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementDialogContainer.test.tsx.snap
+++ b/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementDialogContainer.test.tsx.snap
@@ -59,7 +59,7 @@ exports[`AdaptivityElementDialogContainer should render 1`] = `
               </div>
             </div>
             <div
-              class="flex items-center justify-center px-1 mb-4 rounded-lg font-regular h-fit lg:m-4"
+              class="flex items-center justify-center px-1 mb-4 rounded-lg font-regular h-fit lg:mx-4"
             >
               <div
                 class="flex flex-col lg:justify-between lg:flex-row w-full p-2 m-auto"
diff --git a/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementHint.test.tsx.snap b/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementHint.test.tsx.snap
index da4e00c10..85e00bc0b 100644
--- a/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementHint.test.tsx.snap
+++ b/src/Components/CoreTest/Presentation/Adaptivity/AdaptivityElement/UIComponents/__snapshots__/AdaptivityElementHint.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`AdaptivityElementHint should render CommentAction 1`] = `
 <div>
   <div
-    class="pl-4 my-4 font-bold"
+    class="pl-4 my-4 flex items-center justify-center p-2 bg-buttonbgblue rounded-xl"
   >
     test
   </div>
diff --git a/src/localize/de/learningElement.json b/src/localize/de/learningElement.json
index 10bea6e06..15f56f1f5 100644
--- a/src/localize/de/learningElement.json
+++ b/src/localize/de/learningElement.json
@@ -12,9 +12,9 @@
   "tooManyHints": "Der hier hinterlegte Hinweis ist nicht eindeutig zuordbar. Bitte fülle einen Bugreport aus.",
   "wrongAnswer": "Schade, leider war deine Antwort falsch.",
   "rightAnswer": "Glückwunsch! Diese Antwort war richtig!",
-  "requiredQuestionSolvedCorrectly": "Durch die Beantwortung dieser Frage wurde die Aufgabe abgeschlossen.",
-  "questionSolvedWithHigherDifficultyQuestionAvailable": "In der Fragenauswahl ist eine Frage mit höherer Schwierigkeit verfügbar.",
-  "questionSolvedWithLowerDifficultyQuestionAvailable": "In der Fragenauswahl ist eine Frage mit niedrigerer Schwierigkeit verfügbar.",
+  "requiredQuestionSolvedCorrectly": "Du hast die Aufgabe in der erforderlichen Schwierigkeit abgeschlossen.",
+  "questionSolvedWithHigherDifficultyQuestionAvailable": "Du kannst es noch in einer höheren Schwierigkeit versuchen.",
+  "questionSolvedWithLowerDifficultyQuestionAvailable": "Du kannst es erst Mal in einer niedrigeren Schwierigkeit versuchen.",
   "nextButton": "Weiter",
   "submitAnswer": "Antwort abgeben",
   "submitAnswers": "Antworten abgeben",