39 lines
1.5 KiB
Svelte
39 lines
1.5 KiB
Svelte
<script lang="ts">
|
|
import { teamPopupOpen, teamPopupName } from '@app/website/signup/TeamPopup.ts';
|
|
import Input from '@components/input/Input.svelte';
|
|
import { onDestroy } from 'svelte';
|
|
|
|
let modal: HTMLDialogElement;
|
|
let form: HTMLFormElement;
|
|
|
|
const cancel = teamPopupOpen.subscribe((value) => {
|
|
if (value) modal.show();
|
|
else form?.reset();
|
|
});
|
|
|
|
onDestroy(cancel);
|
|
</script>
|
|
|
|
<dialog class="modal" bind:this={modal} onclose={() => ($teamPopupOpen = false)}>
|
|
<div class="modal-box">
|
|
<form method="dialog">
|
|
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
|
|
</form>
|
|
<form method="dialog" bind:this={form} onsubmit={() => ($teamPopupName = form.teamName.value)}>
|
|
<h3 class="text-lg font-geist">Team erstellen</h3>
|
|
<p class="py-4">Es wurde noch kein Team für dich und deinen Mitspieler erstellt. Wie soll euer Team heißen?</p>
|
|
<Input id="teamName" type="text" label="Teamname" required>
|
|
{#snippet notice()}
|
|
<span>
|
|
Dein Team ist erst vollständig registriert, wenn dein Teamparter sich ebenfalls angemeldet hat. Eine
|
|
Teilnahme ohne Teampartner ist nicht möglich.
|
|
<br />
|
|
Prüfe bitte nach, ob dein Team auf der Startseite aufgelistet wird, sobald beide Teammitglieder registriert sind!
|
|
</span>
|
|
{/snippet}
|
|
</Input>
|
|
<button class="mt-4 btn btn-neutral">Team registrieren</button>
|
|
</form>
|
|
</div>
|
|
</dialog>
|