From ba0b31d0d24e5f2f780bf8b8dce78b97348c3078 Mon Sep 17 00:00:00 2001
From: Alex Stan <alex.stan.2010@proton.me>
Date: Sun, 2 Jun 2024 09:22:27 +0300
Subject: [PATCH] Fixed the duplicated buttons

---
 app/components/question_component.tsx | 38 +++++++++++++--------------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/app/components/question_component.tsx b/app/components/question_component.tsx
index 97a153c..f0fae3e 100644
--- a/app/components/question_component.tsx
+++ b/app/components/question_component.tsx
@@ -39,7 +39,7 @@ const QuestionView = ({ question, setState, state }: { question: Question, setSt
           <div><p className="mt-6 text-lg leading-8 text-gray-200">
             {question.answer}
           </p>
-          <div className="mt-10 flex items-center justify-center gap-x-6">
+          {/* <div className="mt-10 flex items-center justify-center gap-x-6">
             <button
               onClick={() => { handleAnswerClick( true )}}
               className="rounded-md bg-indigo-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
@@ -52,28 +52,28 @@ const QuestionView = ({ question, setState, state }: { question: Question, setSt
             >
               I didn't know that!
             </button>
+          </div> */}
+          <div className="mt-10 flex items-center justify-center gap-x-6">
+            <button
+              onClick={() => { handleAnswerClick( true )}}
+              className="rounded-md bg-green-600 px-3.5 py-2.5 text-xs font-semibold text-white shadow-sm hover:bg-green-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+              style={{width:'30%', height:'30%'}}
+            >
+              <CheckCircleIcon></CheckCircleIcon>
+              I knew that!
+            </button>
+            <button
+              onClick={() => {handleAnswerClick( false )}}
+              className="rounded-md bg-red-600 px-3.5 py-2.5 text-xs font-semibold text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+              style={{width:'30%', height:'30%'}}
+            >
+              <XCircleIcon></XCircleIcon>
+              I didn't know that!
+            </button>
           </div>
         </div>) : (<button className="text-sm font-semibold leading-6 text-gray-200" onClick={handleOpenClick}>
             Show answer
         </button>)}
-        <div className="mt-10 flex items-center justify-center gap-x-6">
-          <button
-            onClick={() => { handleAnswerClick( true )}}
-            className="rounded-md bg-green-600 px-3.5 py-2.5 text-xs font-semibold text-white shadow-sm hover:bg-green-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
-            style={{width:'30%', height:'30%'}}
-          >
-            <CheckCircleIcon></CheckCircleIcon>
-            I knew that!
-          </button>
-          <button
-            onClick={() => {handleAnswerClick( false )}}
-            className="rounded-md bg-red-600 px-3.5 py-2.5 text-xs font-semibold text-white shadow-sm hover:bg-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
-            style={{width:'30%', height:'30%'}}
-          >
-            <XCircleIcon></XCircleIcon>
-            I didn't know that!
-          </button>
-        </div>
       </div>
     </div>
   )