<form name="login-server" class="flex flex-col">
    <label class="label my-3">
        <span>Username:</span>
        <input type="email" name="email" id="login-email" class="input" bind:value={email}>
    </label>
    <label class="label my-3">
        <span>Password:</span>
        <input type="password" name="password" id="login-password" class="input" bind:value={password}>
    </label>
    <button type="button" id="login-server-submit" class="btn variant-filled-primary my-3" on:click={handleLogin}>Submit</button>

    <div class="flex justify-between">
        {#if globals.server.caps.register }
            <a href="/account/register">Register</a>
        {/if}
        {#if globals.server.caps.reset }
            <a href="/account/reset">Reset your password</a>
        {/if}
    </div>

</form>

<style lang="scss">

</style>

<script lang="js">
    import { urls } from "../../../stores.js";
    import { createEventDispatcher } from 'svelte';

    var email = '';
    var password = '';

    export let globals;

    const dispatch = createEventDispatcher();

    function handleLogin() {
        dispatch('message', {text: 'Not yet implemented'})
    }
</script>