diff --git a/src/routes/Header.svelte b/src/routes/Header.svelte
index 422612b..8e6e534 100644
--- a/src/routes/Header.svelte
+++ b/src/routes/Header.svelte
@@ -2,27 +2,36 @@
 
 <script lang="ts">
 	import discord from '$lib/images/discord.svg';
-	import * as DropdownMenu from '$lib/components/ui/dropdown-menu';
 	import { Button } from '$lib/components/ui/button';
 	import { themes } from '$lib/types/themes';
 	import UserSettingsStore from '$lib/stores/UserSettingsStore';
 	import * as Avatar from '$lib/components/ui/avatar';
-	import { Exit } from 'radix-icons-svelte';
+	import { CaretDown, CaretRight, Exit, EyeClosed, EyeOpen } from 'radix-icons-svelte';
 	import { Separator } from '$lib/components/ui/separator';
+	import * as Popover from '$lib/components/ui/popover';
 
 	let { page } = $props()
 
-	let user = {
-		loggedIn: true, // DEBUG
-		admin: true, // DEBUG
+	type User = {
+		token: string,
+		tokenVisible: boolean,
+		discord: string | undefined,
+		picture: string | undefined,
+		admin: boolean
 	}
 
-	function login() {
+	/*let user: User | undefined = $state({
 		user.loggedIn = true;
-	}
+		tokenVisible: false,
+		discord: "neshura",
+		picture: "/avatar.png",
+		admin: true, // DEBUG
+	})*/
+
+	let user: User | undefined = $state(undefined);
 
 	function logout() {
-		user.loggedIn = false;
+		user = undefined
 	}
 
 	function nextTheme() {
@@ -38,6 +47,18 @@
 
 <div class="flex gap-2 items-center justify-center py-3 bg-primary-foreground">
 	<!-- spacer -->
+		<Button
+			variant="link"
+			href="https://discord.gg/invite/BYNeHaPNh9"
+			target="_blank"
+			rel="noopener noreferrer"
+			class="h-8 w-8 items-center flex"
+		>
+			<Avatar.Root class="h-6 w-6">
+				<Avatar.Image src={discord} alt="DC" />
+				<Avatar.Fallback>US</Avatar.Fallback>
+			</Avatar.Root>
+		</Button>
 		<Button
 			variant="ghost"
 			href="/"
@@ -59,7 +80,7 @@
 		>
 			Archives
 		</Button>
-		{#if user.loggedIn && user.admin}
+		{#if user != undefined && user.admin}
 			<Button
 				variant="ghost"
 				href="/admin"
@@ -67,64 +88,89 @@
 			>
 				Admin
 			</Button>
+			<Button
+				variant="ghost"
+				href="/admin/new"
+				class="{$page.url.pathname == '/admin/new' ? 'text-accent-foreground bg-accent' : ''}"
+			>
+				Admin (New)
+			</Button>
 		{/if}
-		<div class="dropdown" href="user.loggedIn ? /account | /login"></div>
-		{#if user.loggedIn}
-			<DropdownMenu.Root>
-				<DropdownMenu.Trigger asChild let:builder>
+		{#if user != undefined}
+			<Popover.Root>
+				<Popover.Trigger>
 					<Button
 						variant="ghost"
-						builders={[builder]}
-						class="relative h-8 w-8 rounded-full"
+						class="relative h-8 w-8 rounded-full align-middle"
 					>
 						<Avatar.Root class="h-8 w-8">
-							<Avatar.Image src="/avatar.png" alt="@user" />
+							<Avatar.Image src={user.picture} alt="@user" />
 							<Avatar.Fallback>US</Avatar.Fallback>
 						</Avatar.Root>
 					</Button>
-				</DropdownMenu.Trigger>
-				<DropdownMenu.Content class="w-56">
-					<DropdownMenu.Label class="font-normal">
-						<div class="flex flex-col space-y-1 items-start">
-							<p class="text-sm font-medium leading-none">User Display</p>
-							<p class="text-xs leading-none text-muted-foreground">@User</p>
+				</Popover.Trigger>
+				<Popover.Content class="w-56 p-0">
+					<div class="w-full p-1">
+						<div class="px-2 py-1.5 font-normal">
+							<div class="flex flex-row items-center gap-1">
+								{#if user.tokenVisible}
+									<p class="text-sm font-medium leading-none w-12">{user.token}</p> <!--Make the UserToken hidden by default-->
+								{:else}
+									<p class="text-sm font-medium leading-none w-12">******</p>
+								{/if}
+								<Button variant="ghost" size="sm" class="p-0 h-2 justify-start" on:click={() => {user.tokenVisible = !user.tokenVisible}}>
+									{#if user.tokenVisible}
+										<EyeOpen />
+									{:else}
+										<EyeClosed />
+									{/if}
+								</Button>
+							</div>
+							{#if user.discord}
+								<p class="mt-1 text-xs leading-none text-muted-foreground">@{user.discord}</p>
+							{/if}
 						</div>
-					</DropdownMenu.Label>
-					<DropdownMenu.Separator />
-					<DropdownMenu.Group>
-						<DropdownMenu.Item href="/profile">
+					</div>
+					<Separator orientation="horizontal" />
+					<div class="w-full p-1">
+						<Button variant="ghost" class="justify-start h-8 px-2 py-1.5 text-sm w-full" href="/profile">
 							Profile
-						</DropdownMenu.Item>
-						<DropdownMenu.Item href="/settings">
+						</Button>
+						<Button variant="ghost" class="justify-start h-8 px-2 py-1.5 text-sm w-full" href="/settings">
 							Settings
-						</DropdownMenu.Item>
-					</DropdownMenu.Group>
-					<DropdownMenu.Separator />
-					<DropdownMenu.Item class="flex flex-row space-x-1" on:click={logout}>
-						<p>Log out </p>
-						<Exit />
-					</DropdownMenu.Item>
-				</DropdownMenu.Content>
-			</DropdownMenu.Root>
+						</Button>
+					</div>
+					<Separator orientation="horizontal" />
+					<div class="w-full p-1">
+						<Button variant="ghost" class="flex flex-row items-center justify-start h-8 space-x-1 px-2 py-1.5 text-sm w-full" on:click={logout}>
+							<p>Log out </p>
+							<Exit />
+						</Button>
+					</div>
+				</Popover.Content>
+			</Popover.Root>
 		{:else}
-			<Button
-				variant="ghost"
-				class="relative"
-			>
-				Log in
-			</Button>
+			<Popover.Root>
+				<Popover.Trigger>
+					<Button
+						variant="ghost"
+						class="relative"
+					>
+						Log In
+					</Button>
+				</Popover.Trigger>
+				<Popover.Content class="w-56 p-1">
+					<Button variant="ghost" class="justify-start h-8 px-2 py-1.5 text-sm w-full" href="/profile">
+						Token:
+
+						Log In
+					</Button>
+					<Button variant="ghost" class="flex flex-row items-center justify-start h-8 space-x-1 px-2 py-1.5 text-sm w-full" on:click={logout}>
+						<p>Sign Up </p>
+						<Exit />
+					</Button>
+				</Popover.Content>
+			</Popover.Root>
 		{/if}
-	<Button
-		variant="link"
-		href="https://discord.gg/invite/BYNeHaPNh9"
-		target="_blank"
-		rel="noopener noreferrer"
-		class="h-8 w-8 items-center flex"
-	>
-		<Avatar.Root class="h-6 w-6">
-			<Avatar.Image src={discord} alt="DC" />
-			<Avatar.Fallback>US</Avatar.Fallback>
-		</Avatar.Root>
-	</Button>
 </div>
 <Separator orientation="horizontal"></Separator>
diff --git a/src/routes/login/+page.svelte b/src/routes/sign-up/+page.svelte
similarity index 100%
rename from src/routes/login/+page.svelte
rename to src/routes/sign-up/+page.svelte