✨ Added Check Choices to practice mode

frontend/src/lib/practice/question.svelte

@@ -10,6 +10,7 @@
 	import { getLocalization } from '$lib/i18n';
 	import Spinner from '$lib/Spinner.svelte';
 	import { flip } from 'svelte/animate';
+	import BrownButton from '$lib/components/buttons/brown.svelte';
 
 	export let question: Question;
 
@@ -43,6 +44,8 @@
 	let text_input;
 	timer(question.time);
 
+	let check_choice_selected = [false, false, false, false];
+
 	function shuffleArray(a) {
 		for (let i = a.length - 1; i > 0; i--) {
 			const j = Math.floor(Math.random() * (i + 1));
@@ -303,5 +306,45 @@
 				{$t('words.submit')}
 			</button>
 		</div>
+	{:else if question.type === QuizQuestionType.CHECK}
+		{#if show_results}
+			<div>
+				{#each question.answers as answer, i}
+					<button
+						disabled
+						class:bg-green-500={question.answers[i].right}
+						class:bg-red-500={!question.answers[i].right}
+						class="p-2 rounded-lg flex justify-center w-full transition my-5 text-black"
+						>{answer.answer}</button
+					>
+				{/each}
+			</div>
+		{:else}
+			<div>
+				{#each question.answers as answer, i}
+					<button
+						disabled={selected_answer !== undefined || timer_res === '0'}
+						class="p-2 rounded-lg flex justify-center w-full transition bg-amber-300 my-5 disabled:grayscale text-black opacity-50"
+						class:opacity-100={check_choice_selected[i]}
+						on:click={() => {
+							check_choice_selected[i] = !check_choice_selected[i];
+						}}>{answer.answer}</button
+					>
+				{/each}
+				<BrownButton
+					on:click={() => {
+						timer_res = '0';
+					}}>{$t('words.submit')}</BrownButton
+				>
+				{#if timer_res === '0'}
+					<button
+						class="bg-orange-500 p-2 rounded-lg flex justify-center w-full transition my-5 text-black"
+						on:click={() => {
+							show_results = true;
+						}}>{$t('admin_page.get_results')}</button
+					>
+				{/if}
+			</div>
+		{/if}
 	{/if}
 </div>