diff options
Diffstat (limited to 'apps/kit/src/routes/(main)/(public)')
3 files changed, 48 insertions, 34 deletions
diff --git a/apps/kit/src/routes/(main)/(public)/reset-password/+page.svelte b/apps/kit/src/routes/(main)/(public)/reset-password/+page.svelte index 865be10..9ee4a83 100644 --- a/apps/kit/src/routes/(main)/(public)/reset-password/+page.svelte +++ b/apps/kit/src/routes/(main)/(public)/reset-password/+page.svelte @@ -17,13 +17,16 @@ title: "", } as ErrorResult; + let loading = false; let showSuccessAlert = false; async function submitFormAsync() { errorData.text = ""; errorData.title = ""; showSuccessAlert = false; + loading = true; const request = await create_forgot_password_request(formData.email); + loading = false; if (!request.ok) { errorData.text = request.data.text ?? $LL.tryAgainSoon(); errorData.title = request.data.title ?? $LL.unexpectedError(); @@ -38,12 +41,12 @@ <h2 class="mt-6 text-center text-3xl tracking-tight font-bold text-gray-900" > - {$LL["reset-password"].requestAPasswordReset()} + {$LL.requestAPasswordReset()} </h2> <p class="mt-2 text-center text-sm text-gray-600"> - {$LL.or()} + {$LL.or().toLowerCase()} <a href="/sign-in" class="link"> - {$LL["reset-password"].signIntoYourAccount()} + {$LL.signIntoYourAccount()} </a> </p> </div> @@ -61,7 +64,7 @@ <Alert type="success" title={$LL.success()} - message={$LL["reset-password"].requestSentMessage()} + message={$LL.requestSentMessage()} visible={showSuccessAlert} /> diff --git a/apps/kit/src/routes/(main)/(public)/sign-in/+page.svelte b/apps/kit/src/routes/(main)/(public)/sign-in/+page.svelte index d47f924..16d8c3a 100644 --- a/apps/kit/src/routes/(main)/(public)/sign-in/+page.svelte +++ b/apps/kit/src/routes/(main)/(public)/sign-in/+page.svelte @@ -39,12 +39,12 @@ <h2 class="mt-6 text-center text-3xl tracking-tight font-bold text-gray-900" > - {$LL["sign-in"].signIn()} + {$LL.signIn()} </h2> <p class="mt-2 text-center text-sm text-gray-600"> {$LL.or().toLowerCase()} <a href="/sign-up" class="link" - >{$LL["sign-in"].createANewAccount()}</a + >{$LL.createANewAccount()}</a > </p> </div> @@ -88,17 +88,17 @@ <Checkbox id="remember-me" name="remember-me" - label={$LL["sign-in"].notMyComputer()} + label={$LL.notMyComputer()} /> <div class="text-sm"> <a href="/reset-password" class="link"> - {$LL["sign-in"].resetPassword()} + {$LL.resetPassword()} </a> </div> </div> <Button - text={$LL["sign-in"].signIn()} + text={$LL.signIn()} fullWidth type="submit" {loading} diff --git a/apps/kit/src/routes/(main)/(public)/sign-up/+page.svelte b/apps/kit/src/routes/(main)/(public)/sign-up/+page.svelte index 92ebfbd..8b89190 100644 --- a/apps/kit/src/routes/(main)/(public)/sign-up/+page.svelte +++ b/apps/kit/src/routes/(main)/(public)/sign-up/+page.svelte @@ -1,37 +1,48 @@ +<script> + import { Button, Input } from "$lib/components"; + import LL from "$lib/i18n/i18n-svelte"; + + const formData = { + emailAddress: "", + password: "", + }; +</script> + <div class="min-h-full flex flex-col justify-center py-12 sm:px-6 lg:px-8"> <div class="sm:mx-auto sm:w-full sm:max-w-md"> - <h2 class="mt-6 text-center text-3xl tracking-tight font-bold text-gray-900">Create your new account</h2> + <h2 + class="mt-6 text-center text-3xl tracking-tight font-bold text-gray-900" + > + {$LL.createYourNewAccount()} + </h2> <p class="mt-2 text-center text-sm text-gray-600"> - Or - <a href="/sign-in" class="font-medium text-indigo-600 hover:text-indigo-500">sign into an existing one</a> + {$LL.or().toLowerCase()} + <a href="/sign-in" class="link">{$LL.signIntoYourAccount()}</a> </p> </div> <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md"> <div class="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10"> - <form class="space-y-6" action="#" method="POST"> - <div> - <label for="email" class="block text-sm font-medium text-gray-700"> Email address </label> - <div class="mt-1"> - <input id="email" name="email" type="email" autocomplete="email" required - class="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"> - </div> - </div> - - <div> - <label for="password" class="block text-sm font-medium text-gray-700"> Password </label> - <div class="mt-1"> - <input id="password" name="password" type="password" autocomplete="current-password" required - class="appearance-none block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"> - </div> - </div> + <form class="space-y-6" action="#"> + <Input + label={$LL.emailAddress()} + id="email" + name="email" + autocomplete="email" + required + type="email" + bind:value={formData.emailAddress} + /> - <div> - <button type="submit" - class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"> - Create account - </button> - </div> + <Input + label={$LL.password()} + id="password" + name="password" + required + type="password" + bind:value={formData.password} + /> + <Button type="submit" text={$LL.submit()} fullWidth /> </form> </div> </div> |