dshgfdshjagd
This commit is contained in:
parent
52ebe1cb5a
commit
dfbb6a6d9c
10 changed files with 56 additions and 23 deletions
|
@ -1,3 +1,5 @@
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200..1000&display=swap');
|
||||||
|
|
||||||
@tailwind base;
|
@tailwind base;
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
@ -6,6 +8,11 @@ html {
|
||||||
@apply dark:bg-neutral-950;
|
@apply dark:bg-neutral-950;
|
||||||
@apply dark:text-neutral-200;
|
@apply dark:text-neutral-200;
|
||||||
@apply transition-colors;
|
@apply transition-colors;
|
||||||
|
|
||||||
|
font-family: 'Nunito', sans-serif;
|
||||||
|
font-optical-sizing: auto;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
strong {
|
strong {
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { redirect } from '@sveltejs/kit';
|
import { error, redirect } from '@sveltejs/kit';
|
||||||
import { getSession } from '$lib/server/database';
|
import { getSession } from '$lib/server/database';
|
||||||
import { COOKIE } from '$lib/config';
|
import { COOKIE } from '$lib/config';
|
||||||
|
|
||||||
|
@ -25,7 +25,9 @@ export async function handle({ event, resolve }) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (event.route.id) {
|
||||||
if (event.route.id.includes('(app)') && !user) return redirect(303, '/');
|
if (event.route.id.includes('(app)') && !user) return redirect(303, '/');
|
||||||
|
}
|
||||||
|
|
||||||
return await resolve(event);
|
return await resolve(event);
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,12 +9,14 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="relative w-fit text-sm">
|
<div class="flex relative w-fit">
|
||||||
<button class="w-min" on:click={toggle}><Menu></Menu></button>
|
<button class="my-auto w-min" on:click={toggle}>
|
||||||
|
<Menu class="w-5 h-5"></Menu>
|
||||||
|
</button>
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<button
|
<button
|
||||||
transition:slide
|
transition:slide
|
||||||
class="w-52 z-10 h-fit translate-y-12 py-2 bg-neutral-900 rounded-lg origin-top right-0 absolute"
|
class="w-[12rem] z-10 h-fit translate-y-12 py-2 bg-neutral-200 dark:bg-neutral-900 rounded-lg origin-top right-0 absolute transition-all"
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
</button>
|
</button>
|
||||||
|
|
|
@ -2,6 +2,9 @@
|
||||||
export let href = '';
|
export let href = '';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<a {href} class="flex px-3 py-1.5 space-x-1 transition-all hover:bg-neutral-600">
|
<a
|
||||||
|
{href}
|
||||||
|
class="flex px-3 py-1.5 space-x-1 transition-all hover:bg-neutral-300 hover:dark:bg-neutral-800"
|
||||||
|
>
|
||||||
<slot />
|
<slot />
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -1,24 +1,50 @@
|
||||||
<script>
|
<script>
|
||||||
|
import { Sun, Moon } from 'lucide-svelte';
|
||||||
|
|
||||||
|
import { user, darkMode } from '$lib/stores';
|
||||||
|
|
||||||
import HeaderLink from '$lib/components/HeaderLink.svelte';
|
import HeaderLink from '$lib/components/HeaderLink.svelte';
|
||||||
import Dropdown from '$lib/components/Dropdown.svelte';
|
import Dropdown from '$lib/components/Dropdown.svelte';
|
||||||
import DropdownButton from '$lib/components/DropdownButton.svelte';
|
import DropdownButton from '$lib/components/DropdownButton.svelte';
|
||||||
|
import Logo from '$lib/components/Logo.svelte';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="flex place-content-between px-4 w-full h-full rounded-xl transition-colors py-auto bg-neutral-200 dark:bg-neutral-900"
|
class="flex place-content-between px-4 my-2 w-full h-full rounded-xl transition-colors py-auto bg-neutral-200 dark:bg-neutral-900"
|
||||||
>
|
>
|
||||||
<div class="flex my-auto space-x-4">
|
<div class="flex my-auto space-x-6">
|
||||||
<p class="my-auto text-xl transition-all hover:scale-105 focus:scale-105 active:scale-95">
|
<a
|
||||||
File Uploader
|
href="/dashboard"
|
||||||
</p>
|
class="flex-none my-auto w-20 text-xl transition-all fill-black dark:fill-white hover:scale-105 focus:scale-105 active:scale-95"
|
||||||
<div class="flex my-auto space-x-2">
|
>
|
||||||
|
<Logo></Logo>
|
||||||
|
</a>
|
||||||
|
<div class="flex my-auto space-x-3">
|
||||||
<HeaderLink href="/dashboard">Dashboard</HeaderLink>
|
<HeaderLink href="/dashboard">Dashboard</HeaderLink>
|
||||||
|
<HeaderLink href="/uploads">Uploads</HeaderLink>
|
||||||
|
<HeaderLink href="/admin">Admin</HeaderLink>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex my-auto space-x-2">
|
<div class="flex my-auto space-x-2">
|
||||||
|
<p class="font-bold">{$user?.username}</p>
|
||||||
<Dropdown>
|
<Dropdown>
|
||||||
|
<div>
|
||||||
|
<button
|
||||||
|
class="flex px-3 py-1.5 space-x-1.5 w-full transition-all hover:bg-neutral-300 hover:dark:bg-neutral-800"
|
||||||
|
on:click={() => {
|
||||||
|
$darkMode = !$darkMode;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{#if $darkMode}
|
||||||
|
<Sun class="my-auto w-5 h-5" />
|
||||||
|
{:else}
|
||||||
|
<Moon class="my-auto w-5 h-5" />
|
||||||
|
{/if}
|
||||||
|
<p>Theme</p>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
<DropdownButton>
|
<DropdownButton>
|
||||||
<p class="my-auto">Uploads</p>
|
<p class="my-auto">ShareX Profile</p>
|
||||||
</DropdownButton>
|
</DropdownButton>
|
||||||
<DropdownButton>
|
<DropdownButton>
|
||||||
<p class="my-auto">Settings</p>
|
<p class="my-auto">Settings</p>
|
||||||
|
|
|
@ -11,13 +11,7 @@
|
||||||
{disabled}
|
{disabled}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="flex space-x-2 rounded-lg border-b-2 p-2 transition-colors
|
class="flex p-2 space-x-2 rounded-lg border-b-2 transition-colors border-neutral-400 bg-neutral-200 hover:border-neutral-500 hover:group-disabled/button:border-neutral-400 dark:border-neutral-700 dark:bg-neutral-900 hover:dark:border-neutral-500 hover:group-disabled/button:dark:border-neutral-700"
|
||||||
|
|
||||||
border-neutral-400 bg-neutral-200
|
|
||||||
hover:border-neutral-500 hover:group-disabled/button:border-neutral-400
|
|
||||||
|
|
||||||
dark:border-neutral-700 dark:bg-neutral-900
|
|
||||||
hover:dark:border-neutral-500 hover:group-disabled/button:dark:border-neutral-700"
|
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<Header></Header>
|
<Header></Header>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="w-full min-h-[calc(100vh-4rem)] my-2">
|
<div class="w-full min-h-[calc(100vh-4.5rem)] my-2">
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
0
src/routes/(app)/admin/+page.svelte
Normal file
0
src/routes/(app)/admin/+page.svelte
Normal file
|
@ -1,5 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import { user } from '$lib/stores';
|
import { user } from '$lib/stores';
|
||||||
|
import ThemeSwitcher from '$lib/components/ThemeSwitcher.svelte';
|
||||||
|
|
||||||
export let data;
|
export let data;
|
||||||
|
|
||||||
|
|
|
@ -16,11 +16,9 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="flex space-x-2">
|
<div class="flex space-x-2">
|
||||||
<Button click={goBack}>
|
<Button click={goBack}>
|
||||||
<Undo />
|
|
||||||
<p>Go Back</p>
|
<p>Go Back</p>
|
||||||
</Button>
|
</Button>
|
||||||
<Link style="button" href="/">
|
<Link style="button" href="/">
|
||||||
<Home />
|
|
||||||
<p>Go Home</p>
|
<p>Go Home</p>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue