diff --git a/daily-thought-frontend/src/components/questions/QuestionList.tsx b/daily-thought-frontend/src/components/questions/QuestionList.tsx index e4a384272a80a856b62f60bca57ff9b1ef4dfc44..06e75722b112986dd31a9c6a30a71b8220e9f4a7 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 5848ae48c2ff36160cc46e06b830196bd9eb62f1..57b6c06a9774e22faa38ae9e77f731a9858b66f2 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>