diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 3cebd44..9d6ef75 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -22,9 +22,9 @@ let showConfetti: boolean = false; function onProgressConfetti(progress: number){ - // console.log(progress > 0.225); + console.log(progress); - showConfetti = progress > 0.225; + showConfetti = !mobile && progress > 0.225 || mobile && progress > 0.32; } </script> @@ -60,9 +60,11 @@ <StickyLayer offset={(!mobile) ? ({ top: 0.4, bottom: 0.75 }) : ({ top: 0.4, bottom: 0.4 })} class="pointer-events-none"> <div class="prose font-mono pointer-events-auto h-full" style="max-width: 100%;"> <div class="flex justify-center items-center h-full relative"> - <div style="position: absolute; top: 30vh; {!mobile ? "max-width: 35vw;" : "width: 100%;"}"> + <div class="flex justify-center" style="position: absolute; top: 30vh; {!mobile ? "max-width: 35vw;" : "width: 100%;"}"> {#if showConfetti} - <Confetti amount={10} colorArray={["white"]} /> + <div> + <Confetti amount={10} colorArray={["white"]} /> + </div> {/if} </div> <div class="grid gap-4" style="{!mobile ? "max-width: 50vw;" : ""} background: linear-gradient(to bottom, transparent 0%, oklch(var(--b2)) 5%)">