christoph/svelte-formula11
1
Fork 0
Code Issues 23 Actions Packages Projects 1 Activity

Compare commits

base: christoph:750c89823d31adaeaab88e8ceab18492b507a991
Branches Tags
christoph:master
...
compare: christoph:d4d44a79f6aa2267d3c0a504da02f694201578b1
Branches Tags
christoph:master

2 Commits
750c89823d ... d4d44a79f6

Author SHA1 Message Date
Christoph Urlacher
d4d44a79f6 Seasonpicks: Fix accordion lag
All checks were successful
Build Formula11 Docker Image / pocketbase-docker (push) Successful in 27s
Details
2025-02-27 00:55:58 +01:00
Christoph Urlacher
63ba16bd4d Racepicks: Fix accordion lag 2025-02-27 00:55:52 +01:00
2 changed files with 74 additions and 78 deletions
Expand all files Collapse all files

4
src/routes/racepicks/+page.svelte
View File

@ -69,7 +69,7 @@
</svelte:head> </svelte:head>
{#if data.currentrace} {#if data.currentrace}
{#await data.drivers then drivers} {#await Promise.all( [data.drivers, data.currentpickedusers, pickedusers, outstandingusers], ) then [drivers, currentpicked, picked, outstanding]}
<Accordion class="card mx-auto bg-surface-500 shadow" regionPanel="pt-0" width="w-full"> <Accordion class="card mx-auto bg-surface-500 shadow" regionPanel="pt-0" width="w-full">
<AccordionItem> <AccordionItem>
<svelte:fragment slot="lead"><ChequeredFlagIcon /></svelte:fragment> <svelte:fragment slot="lead"><ChequeredFlagIcon /></svelte:fragment>
@ -154,7 +154,6 @@
{/if} {/if}
<!-- Show users that have and have not picked yet --> <!-- Show users that have and have not picked yet -->
{#await Promise.all( [data.currentpickedusers, pickedusers, outstandingusers], ) then [currentpicked, picked, outstanding]}
<div class="mt-2 flex max-h-[155px] gap-2 overflow-y-scroll"> <div class="mt-2 flex max-h-[155px] gap-2 overflow-y-scroll">
<div class="card w-full min-w-40 p-2 shadow lg:max-w-40"> <div class="card w-full min-w-40 p-2 shadow lg:max-w-40">
<h1 class="text-nowrap font-bold"> <h1 class="text-nowrap font-bold">
@ -191,7 +190,6 @@
</div> </div>
</div> </div>
</div> </div>
{/await}
</div> </div>
</svelte:fragment> </svelte:fragment>
</AccordionItem> </AccordionItem>

4
src/routes/seasonpicks/+page.svelte
View File

@ -59,7 +59,7 @@
</svelte:head> </svelte:head>
<!-- Await this here so the accordion doesn't lag when opening --> <!-- Await this here so the accordion doesn't lag when opening -->
{#await Promise.all([data.drivers, data.teams]) then [drivers, teams]} {#await Promise.all( [data.drivers, data.teams, data.seasonpicks, data.seasonpickedusers, pickedusers, outstandingusers], ) then [drivers, teams, seasonpicks, currentpicked, picked, outstanding]}
<Accordion class="card mx-auto bg-surface-500 shadow" regionPanel="pt-2" width="w-full"> <Accordion class="card mx-auto bg-surface-500 shadow" regionPanel="pt-2" width="w-full">
<AccordionItem> <AccordionItem>
<svelte:fragment slot="lead"><ChequeredFlagIcon /></svelte:fragment> <svelte:fragment slot="lead"><ChequeredFlagIcon /></svelte:fragment>
@ -191,7 +191,6 @@
{/if} {/if}
<!-- Show users that have and have not picked yet --> <!-- Show users that have and have not picked yet -->
{#await Promise.all( [data.seasonpicks, data.seasonpickedusers, pickedusers, outstandingusers], ) then [seasonpicks, currentpicked, picked, outstanding]}
{#if seasonpicks.length === 0} {#if seasonpicks.length === 0}
<div class="mt-2 flex gap-2"> <div class="mt-2 flex gap-2">
<div <div
@ -232,7 +231,6 @@
</div> </div>
</div> </div>
{/if} {/if}
{/await}
</div> </div>
</svelte:fragment> </svelte:fragment>
</AccordionItem> </AccordionItem>