dan/Portfolio
1
0
Fork 0
mirror of https://github.com/danbulant/Portfolio synced 2026-05-27 14:02:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: create own emailfield

Browse source
This commit is contained in:
EETagent 2022-11-29 11:45:49 +01:00
parent e322d931fd
commit dc3a36a4ad
2 changed files with 32 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
frontend/src/lib/components/textfield/EmailField.svelte Normal file
View file

@ -0,0 +1,27 @@
<script lang="ts">
import Email from '../icons/Email.svelte';
import TextField from './TextField.svelte';
export let placeholder: string = '';
export let value: string = '';
export let error: string = '';
</script>
<TextField
bind:error
bind:value
on:click
on:keydown
on:keyup
on:change
type="email"
{placeholder}
icon
>
<div slot="icon" class="flex items-center justify-center">
<Email />
</div>
</TextField>
<style>
</style>

16
frontend/src/routes/register/+page.svelte
View file

@ -6,6 +6,7 @@
import SchoolBadge from '$lib/components/icons/SchoolBadge.svelte'; import SchoolBadge from '$lib/components/icons/SchoolBadge.svelte';
import Telephone from '$lib/components/icons/Telephone.svelte'; import Telephone from '$lib/components/icons/Telephone.svelte';
import SplitLayout from '$lib/components/layout/SplitLayout.svelte'; import SplitLayout from '$lib/components/layout/SplitLayout.svelte';
import EmailField from '$lib/components/textfield/EmailField.svelte';
import IdField from '$lib/components/textfield/IdField.svelte'; import IdField from '$lib/components/textfield/IdField.svelte';
import TelephoneField from '$lib/components/textfield/TelephoneField.svelte'; import TelephoneField from '$lib/components/textfield/TelephoneField.svelte';
import TextField from '$lib/components/textfield/TextField.svelte'; import TextField from '$lib/components/textfield/TextField.svelte';
@ -115,18 +116,12 @@
/> />
</span> </span>
<span class="w-full mt-8 ml-2 md:ml-0"> <span class="w-full mt-8 ml-2 md:ml-0">
<TextField <EmailField
error={$errors.email} error={$errors.email}
on:change={handleChange} on:change={handleChange}
bind:value={$form.email} bind:value={$form.email}
type="e-mail" placeholder="E-mail"
placeholder="Email" />
icon
>
<div slot="icon" class="flex items-center justify-center">
<Email />
</div>
</TextField>
</span> </span>
</div> </div>
<div class="mt-8 w-full"> <div class="mt-8 w-full">
@ -206,11 +201,10 @@
</span> </span>
<div class="mt-8 flex flex-row items-center md:flex-col"> <div class="mt-8 flex flex-row items-center md:flex-col">
<span class="w-full"> <span class="w-full">
<TextField <EmailField
error={$errors.parentEmail} error={$errors.parentEmail}
on:change={handleChange} on:change={handleChange}
bind:value={$form.parentEmail} bind:value={$form.parentEmail}
type="e-mail"
placeholder="E-mail zákonného zástupce" placeholder="E-mail zákonného zástupce"
/> />
</span> </span>