Added streak percentage

This commit is contained in:
George Powell
2026-02-21 16:17:06 -05:00
parent c3307b3920
commit 6554ef8f41
6 changed files with 143 additions and 17 deletions

View File

@@ -90,7 +90,7 @@
return chapterCounts[bookId] || 1;
}
// Generate 6 random chapter options including the correct one
// Generate 4 random chapter options including the correct one
function generateChapterOptions(
correctChapter: number,
totalChapters: number,
@@ -98,14 +98,14 @@
const options = new Set<number>();
options.add(correctChapter);
if (totalChapters >= 6) {
while (options.size < 6) {
if (totalChapters >= 4) {
while (options.size < 4) {
const randomChapter =
Math.floor(Math.random() * totalChapters) + 1;
options.add(randomChapter);
}
} else {
while (options.size < 6) {
while (options.size < 4) {
const randomChapter = Math.floor(Math.random() * 10) + 1;
options.add(randomChapter);
}
@@ -167,18 +167,18 @@
</script>
<Container
class="w-full p-6 sm:p-8 bg-linear-to-br from-yellow-100/80 to-amber-200/80 text-gray-800 shadow-md"
class="w-full p-3 sm:p-4 bg-linear-to-br from-yellow-100/80 to-amber-200/80 text-gray-800 shadow-md"
>
<div class="text-center">
<p class="text-xl sm:text-2xl font-bold mb-2">Bonus Challenge</p>
<p class="text-sm sm:text-base opacity-80 mb-6">
Guess the chapter for an even higher grade
<p class="font-bold mb-3 text-lg sm:text-xl">
Bonus Challenge
<span class="text-base sm:text-lg opacity-60 font-normal"
>— guess the chapter for an even higher grade</span
>
</p>
<div
class="grid grid-cols-3 lg:grid-cols-6 gap-3 sm:gap-4 justify-center mx-auto mb-6"
>
{#each chapterOptions as chapter}
<div class="grid grid-cols-4 gap-2 justify-center mx-auto mb-3">
{#each chapterOptions as chapter (chapter)}
<button
onclick={() => handleChapterSelect(chapter)}
disabled={hasAnswered}