starred/pocket-id
1
0
Fork 0
mirror of https://github.com/pocket-id/pocket-id.git synced 2025-12-21 01:11:33 +03:00
Code Issues 121 Packages Projects Releases 16 Wiki Activity

feat: allow sign in with email (#100)

Browse Source
This commit is contained in:
Elias Schneider
2025-01-19 15:30:31 +01:00
committed by GitHub
parent e284e352e2
commit 06b90eddd6
42 changed files with 422 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
frontend/src/lib/components/login-wrapper.svelte
View File

@@ -2,22 +2,38 @@
import { browser } from '$app/environment';
import { browserSupportsWebAuthn } from '@simplewebauthn/browser';
import type { Snippet } from 'svelte';
import { Button } from './ui/button';
import * as Card from './ui/card';
import WebAuthnUnsupported from './web-authn-unsupported.svelte';
import { page } from '$app/stores';
let {
children
children,
showEmailOneTimeAccessButton = false
}: {
children: Snippet;
showEmailOneTimeAccessButton?: boolean;
} = $props();
</script>
<!-- Desktop -->
<div class="hidden h-screen items-center text-center lg:flex">
<div class="min-w-[650px] p-16">
<div class="h-full min-w-[650px] p-16 {showEmailOneTimeAccessButton ? 'pb-0' : ''}">
{#if browser && !browserSupportsWebAuthn()}
<WebAuthnUnsupported />
{:else}
{@render children()}
<div class="flex h-full flex-col">
<div class="flex flex-grow flex-col items-center justify-center">
{@render children()}
</div>
{#if showEmailOneTimeAccessButton}
<div class="mb-4 flex justify-center">
<Button href="/login/email?redirect={encodeURIComponent($page.url.pathname + $page.url.search)}" variant="link" class="text-muted-foreground text-xs">
Don't have access to your passkey?
</Button>
</div>
{/if}
</div>
{/if}
</div>
<img
@@ -27,15 +43,25 @@
/>
</div>
<!-- Mobile -->
<div
class="flex h-screen items-center justify-center bg-[url('/api/application-configuration/background-image')] bg-cover bg-center text-center lg:hidden"
>
<Card.Root class="mx-3">
<Card.CardContent class="px-4 py-10 sm:p-10">
<Card.CardContent
class="px-4 py-10 sm:p-10 {showEmailOneTimeAccessButton ? 'pb-3 sm:pb-3' : ''}"
>
{#if browser && !browserSupportsWebAuthn()}
<WebAuthnUnsupported />
{:else}
{@render children()}
{#if showEmailOneTimeAccessButton}
<div class="mt-5">
<Button href="/login/email?redirect={encodeURIComponent($page.url.pathname + $page.url.search)}" variant="link" class="text-muted-foreground text-xs">
Don't have access to your passkey?
</Button>
</div>
{/if}
{/if}
</Card.CardContent>
</Card.Root>