shishantbiswas/bknd
1
0
Fork 0
mirror of https://github.com/shishantbiswas/bknd.git synced 2026-03-17 21:06:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(docs): note for NuxtLink usage, added geist font in example, minor cleanups

Browse Source
This commit is contained in:
Shishant Biswas
2026-03-14 22:57:05 +05:30
parent 7751ee5db8
commit 06f9c3ee15
6 changed files with 57 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
examples/nuxt/app/pages/index.vue
View File

@@ -21,15 +21,15 @@ async function handleSubmit(event: Event) {
<div v-if="todos !== undefined"
class="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20">
<main class="flex flex-col gap-8 row-start-2 items-center sm:items-start">
<div class="flex flex-row items-center ">
<img class="dark:invert size-24" src="/nuxt.svg" alt="Nuxt logo" />
<div class="flex flex-row items-center justify-evenly min-w-full">
<img class="size-24" src="/nuxt.svg" alt="Nuxt logo" />
<div class="ml-3.5 mr-2 font-mono opacity-70">&amp;</div>
<img class="dark:invert" src="/bknd.svg" alt="bknd logo" width="183" height="59" />
</div>
<List :items="['Get started with a full backend.', 'Focus on what matters instead of repetition.']" />
<div class="flex flex-col border border-foreground/15 w-full py-4 px-5 gap-2">
<div class="flex flex-col border border-black/15 dark:border-white/15 w-full py-4 px-5 gap-2">
<h2 class="font-mono mb-1 opacity-70"><code>What's next?</code></h2>
<div class="flex flex-col w-full gap-2">
<div v-if="todos.total > todos.limit"
@@ -40,7 +40,10 @@ async function handleSubmit(event: Event) {
<div class="flex flex-col gap-3">
<div v-for="todo in todos.todos" :key="String(todo.id)" class="flex flex-row">
<div class="flex flex-row flex-grow items-center gap-3 ml-1">
<input type="checkbox" class="flex-shrink-0 cursor-pointer" :checked="!!todo.done"
<input
type="checkbox"
class="flex-shrink-0 cursor-pointer"
:checked="Boolean(todo.done)"
@change="() => { toggleTodo(todo); refresh() }" />
<div class="text-foreground/90 leading-none">{{ todo.title }}</div>
</div>
@@ -52,8 +55,11 @@ async function handleSubmit(event: Event) {
</div>
<form class="flex flex-row w-full gap-3 mt-2" :key="todos.todos.map(t => t.id).join()" @submit="handleSubmit">
<input type="text" name="title" placeholder="New todo"
class="py-2 px-4 flex flex-grow rounded-sm bg-foreground/10 focus:bg-foreground/20 transition-colors outline-none" />
<input
type="text"
name="title"
placeholder="New todo"
class="py-2 px-4 flex flex-grow rounded-sm bg-black/5 focus:bg-black/10 dark:bg-white/5 dark:focus:bg-white/10 transition-colors outline-none" />
<button type="submit" class="cursor-pointer">Add</button>
</form>
</div>

22
examples/nuxt/app/pages/user.vue
View File

@@ -12,25 +12,31 @@ onMounted(() => {
<div
v-if="userStatus !== 'pending'"
className="flex flex-col items-center justify-center min-h-screen p-8 pb-20 gap-16 sm:p-20"
>
>
<main className="flex flex-col gap-8 row-start-2 justify-center items-center sm:items-start">
<div class="flex flex-row items-center ">
<img class="dark:invert size-24" src="/nuxt.svg" alt="Nuxt logo" />
<div class="flex flex-row items-center justify-evenly min-w-full">
<img class="size-24" src="/nuxt.svg" alt="Nuxt logo" />
<div class="ml-3.5 mr-2 font-mono opacity-70">&amp;</div>
<img class="dark:invert" src="/bknd.svg" alt="bknd logo" width="183" height="59" />
<img
class="dark:invert"
src="/bknd.svg"
alt="bknd logo"
width="183"
height="59"
/>
</div>
<div v-if="data?.user">
Logged in as {{ data.user.email }}.
<a className="font-medium underline" href='/api/auth/logout'>
<NuxtLink external className="font-medium underline" href='/api/auth/logout'>
Logout
</a>
</NuxtLink>
</div>
<div v-else className="flex flex-col gap-1">
<p>
Not logged in.
<a className="font-medium underline" href="/admin/auth/login">
<NuxtLink external className="font-medium underline" href="/admin/auth/login">
Login
</a>
</NuxtLink>
</p>
<p className="text-xs opacity-50">
Sign in with: