BradNut/boredgame
1
0
Fork 0
mirror of https://github.com/BradNut/boredgame synced 2025-09-08 17:40:22 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixing up logged in sheet.

Browse source
This commit is contained in:
Bradley Shellnut 2023-09-12 16:49:04 -07:00
parent 98acc78ea3
commit df665376ef
3 changed files with 105 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/lib/components/header/index.svelte
View file

@ -2,7 +2,7 @@
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
import { LogOut } from 'lucide-svelte'; import { LogOut } from 'lucide-svelte';
import { Button } from '$lib/components/ui/button'; 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 Avatar from "$lib/components/ui/avatar";
import * as Sheet from "$lib/components/ui/sheet"; import * as Sheet from "$lib/components/ui/sheet";
import Logo from '$components/logo.svelte'; import Logo from '$components/logo.svelte';
@ -34,9 +34,6 @@
<Sheet.Content side="right"> <Sheet.Content side="right">
<Sheet.Header> <Sheet.Header>
<Sheet.Title>Menu</Sheet.Title> <Sheet.Title>Menu</Sheet.Title>
<Toggle aria-label="toggle bold">
</Toggle>
</Sheet.Header> </Sheet.Header>
<div class="menu"> <div class="menu">
<Sheet.Close asChild let:builder> <Sheet.Close asChild let:builder>

2
src/routes/(auth)/+layout.svelte
View file

@ -39,7 +39,7 @@
<div class="quote-wrapper"> <div class="quote-wrapper">
<blockquote class="quote"> <blockquote class="quote">
<p> <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> </p>
<footer>Bradley</footer> <footer>Bradley</footer>
</blockquote> </blockquote>

49
src/routes/(auth)/sign-up/+page.svelte
View file

@ -43,14 +43,9 @@
<title>Bored Game | Sign Up</title> <title>Bored Game | Sign Up</title>
</svelte:head> </svelte:head>
<div class="page"> <div class="sign-up">
<form method="POST" action="/sign-up" use:enhance> <form method="POST" action="/sign-up" use:enhance>
<div class="grid w-full max-w-sm items-center gap-2.5"> <h2>Signup for an account</h2>
<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>
<Label for="username">Username</Label> <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} /> <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} {#if $errors.username}
@ -116,9 +111,45 @@
</Alert.Description> </Alert.Description>
</Alert.Root> </Alert.Root>
{/if} {/if}
</div>
</form> </form>
</div> </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> </style>