init

frontend/src/routes/+page.svelte

@@ -0,0 +1,70 @@
+<script lang="ts">
+  import { auth } from '$lib/auth.svelte';
+</script>
+
+<svelte:head>
+  <title>//WANTLIST</title>
+</svelte:head>
+
+{#if auth.loaded && auth.user}
+  <!-- Logged-in placeholder dashboard -->
+  <section class="space-y-6">
+    <div>
+      <p class="label">logged in as</p>
+      <h1 class="font-display text-3xl font-bold">
+        {auth.user.display_name ?? auth.user.email}
+      </h1>
+    </div>
+
+    <div class="panel panel-acid p-6">
+      <p class="tag mb-3 inline-block border-acid text-acid">phase 2</p>
+      <h2 class="mb-2 text-xl font-bold">your lists land here</h2>
+      <p class="max-w-prose text-mute">
+        topic-based wantlists (clothes, gear, whatever), item tracking, and pasted
+        product URLs that get refetched for price drops. building it next.
+      </p>
+    </div>
+
+    <div class="grid gap-4 sm:grid-cols-3">
+      {#each [['LISTS', 'soon'], ['TRACKED URLS', 'soon'], ['DEAL ALERTS', 'soon']] as [k, v]}
+        <div class="panel p-4">
+          <p class="label">{k}</p>
+          <p class="font-display text-2xl text-blood">{v}</p>
+        </div>
+      {/each}
+    </div>
+  </section>
+{:else}
+  <!-- Marketing hero -->
+  <section class="space-y-10">
+    <div class="space-y-4">
+      <p class="tag inline-block border-cyber text-cyber">self-hosted · rust core</p>
+      <h1
+        class="glitch font-display text-5xl font-bold leading-[0.95] sm:text-7xl"
+        data-text="TRACK WHAT YOU WANT. STRIKE ON THE DROP."
+      >
+        TRACK WHAT YOU WANT. STRIKE ON THE DROP.
+      </h1>
+      <p class="max-w-xl text-lg text-mute">
+        Topic-based shopping lists for the things you actually want. Paste a product
+        URL, and get mailed the moment the price tanks. No feed. No algorithm. Your
+        server, your rules.
+      </p>
+    </div>
+
+    <div class="flex flex-wrap gap-3">
+      <a href="/register" class="btn btn-acid">make an account →</a>
+      <a href="/login" class="btn btn-ghost">log in</a>
+    </div>
+
+    <div class="grid gap-4 sm:grid-cols-3">
+      {#each [['01', 'LIST IT', 'group wants by topic'], ['02', 'PASTE URL', 'we watch the price'], ['03', 'GET MAILED', 'strike on the drop']] as [n, t, d]}
+        <div class="panel p-5">
+          <p class="font-term text-4xl text-blood">{n}</p>
+          <p class="mt-1 font-display text-lg font-bold">{t}</p>
+          <p class="text-sm text-mute">{d}</p>
+        </div>
+      {/each}
+    </div>
+  </section>
+{/if}