f4245a996a
- Run database migrations on startup if `RUN_MIGRATIONS=true` - Block public access to deactivated sites with a 503 page, allowing admin/login paths - Add `isSuperAdmin` boolean to session user type in app.d.ts
134 lines
3.0 KiB
Svelte
134 lines
3.0 KiB
Svelte
<script lang="ts">
|
|
import type { PageData } from './$types';
|
|
import { page } from '$app/stores';
|
|
import { createAuthClient } from 'better-auth/svelte';
|
|
|
|
let { data }: { data: PageData } = $props();
|
|
|
|
const authClient = createAuthClient();
|
|
|
|
const siteName = $derived(data.site?.name ?? 'The Collective Hub');
|
|
const errorMessage = $derived($page.url.searchParams.get('error'));
|
|
|
|
async function handleDiscordLogin() {
|
|
await authClient.signIn.social({
|
|
provider: 'discord',
|
|
callbackURL: '/'
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>Login — {siteName}</title>
|
|
</svelte:head>
|
|
|
|
<div class="login-container">
|
|
<h1>Login</h1>
|
|
<p>Sign in to manage {siteName}</p>
|
|
|
|
{#if errorMessage}
|
|
<div class="error-banner" role="alert">
|
|
<span class="error-icon">⚠</span>
|
|
<span class="error-text">{errorMessage}</span>
|
|
</div>
|
|
{/if}
|
|
|
|
<button class="discord-btn" onclick={handleDiscordLogin}>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 127.14 96.36"
|
|
width="24"
|
|
height="24"
|
|
fill="currentColor"
|
|
>
|
|
<path
|
|
d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"
|
|
/>
|
|
</svg>
|
|
Login with Discord
|
|
</button>
|
|
|
|
<p class="help-text">
|
|
You must be an approved member of this site to access the admin panel.
|
|
</p>
|
|
</div>
|
|
|
|
<style>
|
|
.login-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: 60vh;
|
|
text-align: center;
|
|
padding: 2rem;
|
|
font-family: system-ui, sans-serif;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2rem;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
p {
|
|
color: #888;
|
|
margin-bottom: 1.5rem;
|
|
max-width: 400px;
|
|
}
|
|
|
|
.discord-btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.75rem;
|
|
padding: 0.875rem 2rem;
|
|
background: #5865f2;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 0.5rem;
|
|
font-size: 1.1rem;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background 0.2s;
|
|
}
|
|
|
|
.discord-btn:hover {
|
|
background: #4752c4;
|
|
}
|
|
|
|
.discord-btn:active {
|
|
background: #3c45a5;
|
|
}
|
|
|
|
.error-banner {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.625rem;
|
|
padding: 0.75rem 1.25rem;
|
|
margin-bottom: 1.25rem;
|
|
background: #fef2f2;
|
|
border: 1px solid #fecaca;
|
|
border-radius: 0.5rem;
|
|
color: #991b1b;
|
|
font-size: 0.9rem;
|
|
max-width: 420px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.error-icon {
|
|
flex-shrink: 0;
|
|
font-size: 1.1rem;
|
|
}
|
|
|
|
.error-text {
|
|
text-align: left;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.help-text {
|
|
font-size: 0.85rem;
|
|
color: #666;
|
|
margin-top: 2rem;
|
|
}
|
|
</style>
|