<script lang="ts">
    import * as Card from "$lib/components/ui/card";
    import LoginForm from "./login-form.svelte";
    import type { PageData } from "./$types.js";
    export let data: PageData;
</script>

<svelte:head>
    <title>Lydstyrke - Login</title>
    <meta name="robots" content="noindex nofollow" />
</svelte:head>

<div class="h-full flex flex-col items-center justify-center">
    <Card.Root class="border-2 p-2">
        <Card.Header>
            <Card.Title class="text-center">Login</Card.Title>
            <Card.Description></Card.Description>
        </Card.Header>
        <Card.Content>
            <LoginForm data={data.form}></LoginForm>
        </Card.Content>
        <Card.Footer>
            <p class="text-xs text-secondary pt-4">Sign Up (not implemented)</p>
        </Card.Footer>
    </Card.Root>
</div>