devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ENCOA-138 Changed the 'Confirm Submission' title and the 'Submit' button to red and increased the font size of the modal

Browse Source
This commit is contained in:
Carlos Mesquita
2024-08-30 10:17:24 +01:00
parent 3892fe1a67
commit 4865b47393
3 changed files with 318 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/QuestionsModal.tsx
View File

@@ -68,13 +68,13 @@ export default function QuestionsModal({ isOpen, onClose, type = "module", unans
)}
{type === "blankQuestions" && (
<>
<Dialog.Title className="font-bold text-xl">Questions Unanswered</Dialog.Title>
<div className="flex flex-col text-lg gap-2">
<Dialog.Title className="font-bold text-2xl">Questions Unanswered</Dialog.Title>
<div className="flex flex-col text-xl gap-2">
<p>You have left some questions unanswered in the current part.</p>
<p>If you wish to continue, you can still access this part later using the navigation bar at the top or the &quot;Back&quot; button.</p>
<p>Do you want to proceed to the next part, or would you like to go back and complete the unanswered questions in the current part?</p>
</div>
<div className="w-full flex justify-between mt-6">
<div className="w-full flex justify-between mt-4">
<Button color="purple" onClick={() => blockMultipleClicksClose(false)} variant="outline" className="max-w-[200px] self-end w-full">
Go Back
</Button>
@@ -86,27 +86,27 @@ export default function QuestionsModal({ isOpen, onClose, type = "module", unans
)}
{type === "submit" && (
<>
<Dialog.Title className="font-bold text-xl">Confirm Submission</Dialog.Title>
<span>
<Dialog.Title className="font-bold text-3xl text-mti-rose-light">Confirm Submission</Dialog.Title>
<span className="text-xl">
{unanswered ? (
<>
By clicking &quot;Submit,&quot; you are finalizing your exam with some <b>questions left unanswered</b>. Once you submit, you will not be able to review or change any of your answers, including the unanswered ones. <br />
By clicking &quot;Submit&quot;, you are finalizing your exam with some <b>questions left unanswered</b>. Once you submit, you will not be able to review or change any of your answers, including the unanswered ones. <br />
<br />
Are you sure you want to submit and complete the exam with unanswered questions?
Are you sure you want to submit and complete the exam <b>with unanswered questions</b>?
</>
) : (
<>
By clicking &quot;Submit,&quot; you are finalizing your exam. Once you submit, you will not be able to review or change any of your answers. <br />
By clicking &quot;Submit&quot;, you are finalizing your exam. Once you submit, you will not be able to review or change any of your answers. <br />
<br />
Are you sure you want to submit and complete the exam?
</>
)}
</span>
<div className="w-full flex justify-between mt-8">
<Button color="purple" onClick={() => blockMultipleClicksClose(false)} variant="outline" className="max-w-[200px] self-end w-full">
<div className="w-full flex justify-between mt-4">
<Button color="purple" onClick={() => blockMultipleClicksClose(false)} variant="outline" className="max-w-[200px] self-end w-full !text-xl">
Go Back
</Button>
<Button color="purple" onClick={() => blockMultipleClicksClose(true)} className="max-w-[200px] self-end w-full">
<Button color="rose" onClick={() => blockMultipleClicksClose(true)} className="max-w-[200px] self-end w-full !text-xl">
Submit
</Button>
</div>