diff options
Diffstat (limited to 'src/routes/+page.svelte')
| -rw-r--r-- | src/routes/+page.svelte | 89 |
1 files changed, 46 insertions, 43 deletions
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 25985f1..e4f78c5 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -96,57 +96,60 @@ > </div> -{#if addError || form?.error} - <p class="error">{addError || form?.error}</p> -{/if} +<main> + {#if addError || form?.error} + <p class="error">{addError || form?.error}</p> + {/if} -{#if localItems.length === 0} - <p class="empty">Rien à acheter</p> -{:else} - <form method="POST" action="?/toggle" use:enhance> - {#each groupByCategory(localItems) as [cat, items] (cat)} - <h3 class="category-name">{cat}</h3> - <ul class="item-list"> - {#each items as item (item.id)} - <li class="item-row item-row--fixed"> - <button - class="item-btn item-btn--grow" - name="id" - value={item.id} - type="submit" - aria-pressed={item.checked} - > - <span class="item-text"> - {item.name} - {#if item.bestRef} - <span class="best-ref" - >{item.bestRef.reference} - {#if item.bestRef.price && item.bestRef.unit} - {item.bestRef.price.toFixed(2)} {item.bestRef.unit} - {/if} - {#if item.bestRef.qualityScore != null} - ({item.bestRef.qualityScore}/100) - {/if} - </span> - {/if} - </span> - </button> - <a class="ref-link" href="/grocery/{item.id}?from=/">→</a> - </li> - {/each} - </ul> - {/each} - </form> -{/if} + {#if localItems.length === 0} + <p class="empty">Rien à acheter</p> + {:else} + <form method="POST" action="?/toggle" use:enhance> + {#each groupByCategory(localItems) as [cat, items] (cat)} + <h3 class="category-name">{cat}</h3> + <ul class="item-list"> + {#each items as item (item.id)} + <li class="item-row item-row--fixed"> + <button + class="item-btn item-btn--grow" + name="id" + value={item.id} + type="submit" + aria-pressed={item.checked} + > + <span class="item-text"> + {item.name} + {#if item.bestRef} + <span class="best-ref" + >{item.bestRef.reference} + {#if item.bestRef.price && item.bestRef.unit} + {item.bestRef.price.toFixed(2)} {item.bestRef.unit} + {/if} + {#if item.bestRef.qualityScore != null} + ({item.bestRef.qualityScore}/100) + {/if} + </span> + {/if} + </span> + </button> + <a class="ref-link" href="/grocery/{item.id}?from=/">→</a> + </li> + {/each} + </ul> + {/each} + </form> + {/if} +</main> <style> .add-bar { display: flex; gap: 0.5rem; - padding: 0.75rem 0; + padding: 0.5rem 1rem; position: sticky; - top: 3.1rem; + top: var(--nav-height); background: var(--bg); + border-bottom: 1px solid var(--border); z-index: 10; } |