mirror of
https://github.com/BradNut/boredgame
synced 2025-09-08 17:40:22 +00:00
Fixing up logged in sheet.
This commit is contained in:
parent
98acc78ea3
commit
df665376ef
3 changed files with 105 additions and 77 deletions
|
|
@ -2,7 +2,7 @@
|
|||
import { enhance } from '$app/forms';
|
||||
import { LogOut } from 'lucide-svelte';
|
||||
import { Button } from '$lib/components/ui/button';
|
||||
import { Toggle } from "$lib/components/ui/toggle";
|
||||
// import { Toggle } from "$lib/components/ui/toggle"; -- TODO: Add light/dark toggle
|
||||
import * as Avatar from "$lib/components/ui/avatar";
|
||||
import * as Sheet from "$lib/components/ui/sheet";
|
||||
import Logo from '$components/logo.svelte';
|
||||
|
|
@ -34,9 +34,6 @@
|
|||
<Sheet.Content side="right">
|
||||
<Sheet.Header>
|
||||
<Sheet.Title>Menu</Sheet.Title>
|
||||
<Toggle aria-label="toggle bold">
|
||||
|
||||
</Toggle>
|
||||
</Sheet.Header>
|
||||
<div class="menu">
|
||||
<Sheet.Close asChild let:builder>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<div class="quote-wrapper">
|
||||
<blockquote class="quote">
|
||||
<p>
|
||||
"How many games do I own? What was the last one I played? What haven't I played in a long time? If this sound like you then Bored Game is your new best friend."
|
||||
"How many games do I own? What was the last one I played? What haven't I played in a long time? If this sounds like you then Bored Game is your new best friend."
|
||||
</p>
|
||||
<footer>Bradley</footer>
|
||||
</blockquote>
|
||||
|
|
|
|||
|
|
@ -43,14 +43,9 @@
|
|||
<title>Bored Game | Sign Up</title>
|
||||
</svelte:head>
|
||||
|
||||
<div class="page">
|
||||
<div class="sign-up">
|
||||
<form method="POST" action="/sign-up" use:enhance>
|
||||
<div class="grid w-full max-w-sm items-center gap-2.5">
|
||||
<h2
|
||||
class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0"
|
||||
>
|
||||
Signup for an account
|
||||
</h2>
|
||||
<h2>Signup for an account</h2>
|
||||
<Label for="username">Username</Label>
|
||||
<Input type="text" id="username" class={$errors.username && "outline outline-destructive"} name="username" placeholder="Username" autocomplete="username" data-invalid={$errors.username} bind:value={$form.username} />
|
||||
{#if $errors.username}
|
||||
|
|
@ -116,9 +111,45 @@
|
|||
</Alert.Description>
|
||||
</Alert.Root>
|
||||
{/if}
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<style scoped>
|
||||
<style lang="postcss">
|
||||
.sign-up {
|
||||
display: flex;
|
||||
margin-top: 1.5rem;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
|
||||
@media (min-width: 640px) {
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
form {
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
max-width: 24rem;
|
||||
|
||||
h2:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding-bottom: 0.5rem;
|
||||
border-bottom-width: 1px;
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.025em;
|
||||
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
|
||||
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-duration: 300ms;
|
||||
scroll-margin: 5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in a new issue