All checks were successful
Docker Deploy / build-and-push (push) Successful in 4m0s
82 lines
2.5 KiB
Plaintext
82 lines
2.5 KiB
Plaintext
---
|
|
import Layout from '../layouts/Layout.astro';
|
|
import { Icon } from 'astro-icon/components';
|
|
import PasskeyLogin from '../components/auth/PasskeyLogin.vue';
|
|
|
|
if (Astro.locals.user) {
|
|
return Astro.redirect('/dashboard');
|
|
}
|
|
|
|
const error = Astro.url.searchParams.get('error');
|
|
const errorMessage =
|
|
error === 'invalid_credentials'
|
|
? 'Invalid email or password'
|
|
: error === 'missing_fields'
|
|
? 'Please fill in all fields'
|
|
: null;
|
|
---
|
|
|
|
<Layout title="Login - Chronus">
|
|
<div class="flex justify-center items-center flex-1 bg-base-100">
|
|
<div class="card bg-base-100 shadow-2xl w-full max-w-md mx-4">
|
|
<div class="card-body">
|
|
<img src="/logo.webp" alt="Chronus" class="h-16 w-16 mx-auto mb-4" />
|
|
<h2 class="text-3xl font-bold text-center mb-2">Welcome Back</h2>
|
|
<p class="text-center text-base-content/60 mb-6">Sign in to continue to Chronus</p>
|
|
|
|
{errorMessage && (
|
|
<div role="alert" class="alert alert-error mb-4">
|
|
<Icon name="heroicons:exclamation-circle" class="w-6 h-6" />
|
|
<span>{errorMessage}</span>
|
|
</div>
|
|
)}
|
|
|
|
<form action="/api/auth/login" method="POST" class="space-y-4">
|
|
<div class="form-control">
|
|
<label class="label font-medium" for="email">
|
|
Email
|
|
</label>
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
placeholder="your@email.com"
|
|
class="input input-bordered w-full"
|
|
autocomplete="email"
|
|
required
|
|
/>
|
|
</div>
|
|
|
|
<div class="form-control">
|
|
<label class="label font-medium" for="password">
|
|
Password
|
|
</label>
|
|
<input
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
placeholder="Enter your password"
|
|
class="input input-bordered w-full"
|
|
autocomplete="current-password"
|
|
required
|
|
/>
|
|
</div>
|
|
|
|
<button class="btn btn-primary w-full mt-6">Sign In</button>
|
|
</form>
|
|
|
|
<PasskeyLogin client:idle />
|
|
|
|
<div class="divider">OR</div>
|
|
|
|
<div class="text-center">
|
|
<p class="text-sm text-base-content/70">
|
|
Don't have an account?
|
|
<a href="/signup" class="link link-primary font-semibold">Create one</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Layout>
|