Add lots of style and layout

1 files changed, 11 insertions, 1 deletions

diff --git a/hi-ui/src/lib/LogOut.svelte b/hi-ui/src/lib/LogOut.svelte
index 439a530..64d26c9 100644
--- a/hi-ui/src/lib/LogOut.svelte
+++ b/hi-ui/src/lib/LogOut.svelte
@@ -2,6 +2,12 @@
     import { logOut} from '../apiServer';
     import { currentUser } from '../store';
 
+    let user;
+
+    currentUser.subscribe((value) => {
+        user = value;
+    });
+
     async function handleLogout(event) {
         event.preventDefault();
         const response = await logOut();
@@ -12,7 +18,11 @@
 </script>
 
 <form on:submit={handleLogout}>
-    <button type="submit">log out</button>
+    @{user.username}
+    <button
+        class="border-slate-500 border-solid border-2 font-bold p-1 rounded"
+        type="submit"
+    >log out</button>
 </form>
 
 <style>