From 183537f7e7f9812896451471bb5503f11727b774 Mon Sep 17 00:00:00 2001
From: John O'Keefe <jokeefe@fastmail.com>
Date: Fri, 26 Jul 2024 16:49:04 -0400
Subject: [PATCH] created the user header dialogue

---
 frontend/src/UserDialogue.svelte       |  0
 frontend/src/UserHeaderDialogue.svelte | 34 ++++++++++++++++++++++++++
 2 files changed, 34 insertions(+)
 delete mode 100644 frontend/src/UserDialogue.svelte
 create mode 100644 frontend/src/UserHeaderDialogue.svelte

diff --git a/frontend/src/UserDialogue.svelte b/frontend/src/UserDialogue.svelte
deleted file mode 100644
index e69de29..0000000
diff --git a/frontend/src/UserHeaderDialogue.svelte b/frontend/src/UserHeaderDialogue.svelte
new file mode 100644
index 0000000..5b8e24a
--- /dev/null
+++ b/frontend/src/UserHeaderDialogue.svelte
@@ -0,0 +1,34 @@
+<script lang="ts">
+    let loggedIn = false
+</script>
+
+
+<div id="avatarButton" type="button" data-dropdown-toggle="userDropdown" data-dropdown-placement="bottom-start" class="relative w-10 h-10 overflow-hidden bg-gray-100 rounded-full dark:bg-gray-600">
+    {#if loggedIn}
+        <img class="w-10 h-10 rounded-full cursor-pointer" src="/docs/images/people/profile-picture-5.jpg" alt="User dropdown">
+    {:else}
+        <svg class="absolute w-12 h-12 text-gray-400 -left-1" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"></path></svg>
+    {/if}
+</div>
+
+<!-- Dropdown menu -->
+<div id="userDropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow w-44 dark:bg-gray-700 dark:divide-gray-600">
+    <div class="px-4 py-3 text-sm text-gray-900 dark:text-white">
+        <div>Bonnie Green</div>
+        <div class="font-medium truncate">name@flowbite.com</div>
+    </div>
+    <ul class="py-2 text-sm text-gray-700 dark:text-gray-200" aria-labelledby="avatarButton">
+        <li>
+            <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Dashboard</a>
+        </li>
+        <li>
+            <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Settings</a>
+        </li>
+        <li>
+            <a href="#" class="block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Earnings</a>
+        </li>
+    </ul>
+    <div class="py-1">
+        <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white">Sign out</a>
+    </div>
+</div>