LobotomyLabs/classquiz-ai
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ Closes #186

Browse Source
This commit is contained in:
Mawoka
2022-12-03 18:09:22 +01:00
parent ac9a84c5e8
commit 9d8ffca654
1 changed files with 30 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/play/question.svelte
+30 -16
View File
@@ -104,11 +104,13 @@
{@html question.question} {@html question.question}
</h1> </h1>
<div class="mx-auto my-2"> <div class="mx-auto my-2">
<CircularTimer {#if game_mode !== 'kahoot'}
bind:text={timer_res} <CircularTimer
bind:progress={circular_prgoress} bind:text={timer_res}
color="#ef4444" bind:progress={circular_prgoress}
/> color="#ef4444"
/>
{/if}
</div> </div>
</div> </div>
{#if question.image !== null && game_mode !== 'kahoot'} {#if question.image !== null && game_mode !== 'kahoot'}
@@ -134,17 +136,29 @@
{/each} {/each}
</div> </div>
{:else if game_mode === 'kahoot'} {:else if game_mode === 'kahoot'}
<div class="grid grid-cols-2 gap-2 w-full p-4 h-5/6"> <div class="h-5/6 w-full relative">
{#each question.answers as answer, i} <div
<button class="absolute top-0 bottom-0 left-0 right-0 m-auto rounded-full h-fit w-fit border-2 border-black shadow-2xl"
class="rounded-lg h-full flex align-middle justify-center disabled:opacity-60 p-3" >
style="background-color: {answer.color ?? '#B45309'}" <CircularTimer
disabled={selected_answer !== undefined} bind:text={timer_res}
on:click={() => selectAnswer(answer.answer)} bind:progress={circular_prgoress}
> color="#ef4444"
<img class="w-10 inline-block" alt="Icon" src={kahoot_icons[i]} /> />
</button> </div>
{/each}
<div class="grid grid-cols-2 gap-2 w-full p-4 h-full">
{#each question.answers as answer, i}
<button
class="rounded-lg h-full flex align-middle justify-center disabled:opacity-60 p-3"
style="background-color: {answer.color ?? '#B45309'}"
disabled={selected_answer !== undefined}
on:click={() => selectAnswer(answer.answer)}
>
<img class="w-10 inline-block" alt="Icon" src={kahoot_icons[i]} />
</button>
{/each}
</div>
</div> </div>
{:else} {:else}
<p>Error</p> <p>Error</p>