mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-08-05 13:15:18 +02:00
UI changes and updates, collection page refresh
This commit is contained in:
Sean Morley
parent
c9dd5fe33d
commit
f7c998ab58
20 changed files with 834 additions and 834 deletions
|
|
@ -4,32 +4,47 @@
|
|||
import { t } from 'svelte-i18n';
|
||||
</script>
|
||||
|
||||
<h1 class="text-center font-extrabold text-4xl mb-6">{$t('settings.reset_password')}</h1>
|
||||
<section class="flex flex-col items-center justify-center min-h-screen px-4 py-8 bg-base-100">
|
||||
<h1 class="text-4xl font-bold text-center mb-6 text-primary">{$t('settings.reset_password')}</h1>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<form method="post" action="?/forgotPassword" class="w-full max-w-xs" use:enhance>
|
||||
<label for="email">{$t('auth.email')}</label>
|
||||
<input
|
||||
name="email"
|
||||
type="email"
|
||||
id="email"
|
||||
class="block mb-2 input input-bordered w-full max-w-xs"
|
||||
/><br />
|
||||
<button class="py-2 px-4 btn btn-primary mr-2">{$t('settings.reset_password')}</button>
|
||||
{#if $page.form?.message}
|
||||
<div class="text-center text-error mt-4">
|
||||
{$t(`settings.${$page.form?.message}`)}
|
||||
<div class="w-full max-w-md p-6 shadow-lg rounded-lg bg-base-200">
|
||||
<form method="post" action="?/forgotPassword" class="flex flex-col space-y-4" use:enhance>
|
||||
<div class="form-control">
|
||||
<label for="email" class="label">
|
||||
<span class="label-text">{$t('auth.email')}</span>
|
||||
</label>
|
||||
<input
|
||||
name="email"
|
||||
type="email"
|
||||
id="email"
|
||||
placeholder="Enter your email"
|
||||
class="input input-bordered w-full"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
{#if $page.form?.success}
|
||||
<div class="text-center text-success mt-4">
|
||||
{$t('settings.possible_reset')}
|
||||
|
||||
<div class="form-control mt-4">
|
||||
<button type="submit" class="btn btn-primary w-full">
|
||||
{$t('settings.reset_password')}
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{#if $page.form?.message}
|
||||
<div class="mt-4 text-center text-error">
|
||||
{$t(`settings.${$page.form?.message}`)}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if $page.form?.success}
|
||||
<div class="mt-4 text-center text-success">
|
||||
{$t('settings.possible_reset')}
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<svelte:head>
|
||||
<title>Forgot Password</title>
|
||||
<title>Reset Password</title>
|
||||
<meta name="description" content="Reset your password for AdventureLog." />
|
||||
</svelte:head>
|
||||
|
|
|
|||
|
|
@ -1,53 +1,66 @@
|
|||
<script lang="ts">
|
||||
import { enhance } from '$app/forms';
|
||||
import { page } from '$app/stores';
|
||||
import type { PageData } from '../../../$types';
|
||||
// import type { PageData } from '../../../$types';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
export let data: PageData;
|
||||
// export let data: PageData;
|
||||
</script>
|
||||
|
||||
<h1 class="text-center font-bold text-4xl mb-4">{$t('settings.change_password')}</h1>
|
||||
<section class="flex flex-col items-center justify-center min-h-screen px-4 py-8 bg-base-100">
|
||||
<h1 class="text-4xl font-bold text-center mb-6 text-primary">
|
||||
{$t('settings.change_password')}
|
||||
</h1>
|
||||
|
||||
<form method="POST" use:enhance class="flex flex-col items-center justify-center space-y-4">
|
||||
<div class="w-full max-w-xs">
|
||||
<label for="password" class="label">
|
||||
<span class="label-text">{$t('auth.new_password')}</span>
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
name="password"
|
||||
required
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
<div class="w-full max-w-md p-6 shadow-lg rounded-lg bg-base-200">
|
||||
<form method="POST" use:enhance class="flex flex-col space-y-6">
|
||||
<div class="form-control">
|
||||
<label for="password" class="label">
|
||||
<span class="label-text">{$t('auth.new_password')}</span>
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
name="password"
|
||||
placeholder="Enter new password"
|
||||
required
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-control">
|
||||
<label for="confirm_password" class="label">
|
||||
<span class="label-text">{$t('auth.confirm_password')}</span>
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
id="confirm_password"
|
||||
name="confirm_password"
|
||||
placeholder="Confirm new password"
|
||||
required
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-control mt-4">
|
||||
<button type="submit" class="btn btn-primary w-full">
|
||||
{$t('settings.reset_password')}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{#if $page.form?.message}
|
||||
<div class="mt-4 text-center text-error">
|
||||
{$t($page.form?.message)}
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="w-full max-w-xs">
|
||||
<label for="confirm_password" class="label">
|
||||
<span class="label-text">{$t('auth.confirm_password')}</span>
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
id="confirm_password"
|
||||
name="confirm_password"
|
||||
required
|
||||
class="input input-bordered w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary">
|
||||
{$t('settings.reset_password')}
|
||||
</button>
|
||||
|
||||
{#if $page.form?.message}
|
||||
<div class="text-error">
|
||||
{$t($page.form?.message)}
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</section>
|
||||
|
||||
<svelte:head>
|
||||
<title>Password Reset Confirm</title>
|
||||
<meta name="description" content="Confirm your password reset and make a new password." />
|
||||
<title>Change Password</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="Confirm your password reset and create a new password for AdventureLog."
|
||||
/>
|
||||
</svelte:head>
|
||||
|
|
|
|||
|
|
@ -5,10 +5,27 @@
|
|||
export let data: PageData;
|
||||
</script>
|
||||
|
||||
{#if data.verified}
|
||||
<h1>{$t('settings.email_verified')}</h1>
|
||||
<p>{$t('settings.email_verified_success')}</p>
|
||||
{:else}
|
||||
<h1>{$t('settings.email_verified_error')}</h1>
|
||||
<p>{$t('settings.email_verified_erorr_desc')}</p>
|
||||
{/if}
|
||||
<section class="flex flex-col items-center justify-center min-h-screen px-4 py-8 bg-base-100">
|
||||
<div class="w-full max-w-lg p-6 shadow-lg rounded-lg bg-base-200 text-center">
|
||||
{#if data.verified}
|
||||
<h1 class="text-4xl font-bold text-success mb-4">
|
||||
{$t('settings.email_verified')}
|
||||
</h1>
|
||||
<p class="text-lg text-base-content">
|
||||
{$t('settings.email_verified_success')}
|
||||
</p>
|
||||
{:else}
|
||||
<h1 class="text-4xl font-bold text-error mb-4">
|
||||
{$t('settings.email_verified_error')}
|
||||
</h1>
|
||||
<p class="text-lg text-base-content">
|
||||
{$t('settings.email_verified_erorr_desc')}
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<svelte:head>
|
||||
<title>Email Verification</title>
|
||||
<meta name="description" content="View your email verification status for AdventureLog." />
|
||||
</svelte:head>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue