From a73217fd7f614709d30f3b2f9bbea35a4c7e2597 Mon Sep 17 00:00:00 2001
From: Felipe D'Abrantes <felidabrantes@gmail>
Date: Sat, 22 Apr 2023 01:47:06 +0100
Subject: [PATCH] Define minimum widths and heights

---
 .../src/components/questions/QuestionList.tsx              | 7 ++-----
 daily-thought-frontend/src/pages/questions.tsx             | 3 ++-
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/daily-thought-frontend/src/components/questions/QuestionList.tsx b/daily-thought-frontend/src/components/questions/QuestionList.tsx
index e4a38427..06e75722 100644
--- a/daily-thought-frontend/src/components/questions/QuestionList.tsx
+++ b/daily-thought-frontend/src/components/questions/QuestionList.tsx
@@ -11,15 +11,12 @@ type QuestionListProps = {
 const QuestionList: FC<QuestionListProps> = ({ questions, onDeleteClick }) => (
   <ul
     role="list"
-    className={
-      'flex flex-col min-h-min max-w-lg overflow-y-scroll divide-y divide-gray-100 mt-4 ' +
-      styles['scrollbox-shadows']
-    }
+    className={`flex flex-col min-h-min max-w-lg overflow-y-scroll divide-y divide-gray-100 mt-4 min-w-[24rem] ${styles['scrollbox-shadows']}`}
   >
     {questions.map((question: QuestionRecord) => (
       <li
         key={question.id}
-        className="flex flex-row items-center justify-between gap-x-6 py-5 px-4 "
+        className="flex flex-row items-center justify-between gap-x-6 py-5 px-4"
       >
         <p className="text-base font-semibold leading-6 text-gray-900">{question.content}</p>
         <TrashIcon className="shrink-0 h-6 w-6 cursor-pointer" type='button' onClick={() => onDeleteClick(question.id)} />
diff --git a/daily-thought-frontend/src/pages/questions.tsx b/daily-thought-frontend/src/pages/questions.tsx
index 5848ae48..57b6c06a 100644
--- a/daily-thought-frontend/src/pages/questions.tsx
+++ b/daily-thought-frontend/src/pages/questions.tsx
@@ -67,6 +67,7 @@ const Questions = () => {
 
   const onQuestionDelete = async (questionId: string): Promise<void> => {
     await deleteQuestion(questionId);
+    setStatusMessage(undefined);
     setRehydrateQuestions(true);
   };
 
@@ -86,7 +87,7 @@ const Questions = () => {
       />
 
       {/* List of Questions */}
-      <div className="flex flex-col items-center w-full shadow-lg min-h-32 pb-4 overflow-auto">
+      <div className="flex flex-col items-center w-full shadow-lg h-full pb-4 overflow-auto">
         <h2 className="text-xl font-semibold leading-10 pt-4 text-gray-900">Questions Stored</h2>
         {questions === undefined ? <p>Loading</p> : <QuestionList questions={questions} onDeleteClick={onQuestionDelete}/>}
       </div>
-- 
GitLab