34 lines
1.0 KiB
Svelte
34 lines
1.0 KiB
Svelte
<script lang="ts">
|
|
import { Button } from "$lib/components/ui/button/index.js";
|
|
import * as Card from "$lib/components/ui/card/index.js";
|
|
import { Input } from "$lib/components/ui/input/index.js";
|
|
import { Label } from "$lib/components/ui/label/index.js";
|
|
|
|
let { loggedin = $bindable() } = $props();
|
|
</script>
|
|
|
|
<div class="pt-48">
|
|
<form
|
|
onsubmit={() => {
|
|
loggedin = true;
|
|
}}
|
|
class="flex justify-center items-center overflow-hidden"
|
|
>
|
|
<Card.Root class="w-full max-w-sm">
|
|
<Card.Header>
|
|
<Card.Title class="text-2xl">Login</Card.Title>
|
|
<Card.Description>Please enter kiosk credentials.</Card.Description>
|
|
</Card.Header>
|
|
<Card.Content class="grid gap-4">
|
|
<div class="grid gap-2">
|
|
<Label for="password">Token</Label>
|
|
<Input id="password" type="password" required autofocus />
|
|
</div>
|
|
</Card.Content>
|
|
<Card.Footer>
|
|
<Button class="w-full" type="submit">Sign in</Button>
|
|
</Card.Footer>
|
|
</Card.Root>
|
|
</form>
|
|
</div>
|