Fixed the duplicated buttons

This commit is contained in:
Alex Stan 2024-06-02 09:22:27 +03:00
parent f042f07cf9
commit ba0b31d0d2

View file

@ -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>
)