Update Navbar and UserAvatar components, and +page styling

src/lib/components/Navbar.svelte

@@ -64,9 +64,8 @@
       on:click={goHome}>Home</button
     >
     {#if user}
-      <button
+      <button class="btn btn-primary my-2 md:my-0 md:mr-4" on:click={goToLog}
-        class="btn btn-primary my-2 md:my-0 md:mr-4 md:ml-2"
+        >My Log</button
-        on:click={goToLog}>My Log</button
       >
     {/if}
     <button class="btn btn-primary my-2 md:my-0" on:click={goToFeatured}
@@ -87,7 +86,7 @@
     {/if}
 
     {#if user}
-      <p>Adventures: {count}</p>
+      <p class="font-bold">Adventures: {count}</p>
       <UserAvatar {user} />
     {/if}
     <button class="btn btn-neutral ml-4" on:click={showModal}>About</button>

src/lib/components/UserAvatar.svelte

@@ -12,7 +12,7 @@
 <div class="dropdown dropdown-bottom dropdown-end" tabindex="0" role="button">
   <div class="avatar placeholder">
     <div class="bg-neutral text-neutral-content rounded-full w-10 ml-4">
-      <span class="text-2xl">{firstLetter}</span>
+      <span class="text-2xl -mt-0.5">{firstLetter}</span>
     </div>
   </div>
   <!-- svelte-ignore a11y-missing-attribute -->

src/routes/+page.svelte

@@ -13,13 +13,14 @@
 </script>
 
 <div class="flex flex-col items-center justify-center">
-  <article class="prose">
+  {#if data.user && data.user.username != ""}
-    {#if data.user && data.user.username != ""}
+    <h1 class="mb-6 text-4xl font-extrabold">
-      <h1 class="mb-4">Welcome {data.user.first_name}. Let's get Exploring!</h1>
+      Welcome {data.user.first_name}. Let's get Exploring!
-    {:else}
+    </h1>
-      <h1 class="mb-4">Welcome. Let's get Exploring!</h1>
+  {:else}
-    {/if}
+    <h1 class="mb-6 text-4xl font-extrabold">Welcome. Let's get Exploring!</h1>
-  </article>
+  {/if}
+
   <img src={campingDrawing} class="w-1/4 mb-4" alt="Logo" />
   <button on:click={navToLog} class="btn btn-primary">Open Log</button>
 

tailwind.config.js

@@ -6,6 +6,6 @@ export default {
   },
   plugins: [require("@tailwindcss/typography"), require("daisyui")],
   daisyui: {
-    themes: ["night"],
+    themes: ["sunset"],
   },
 };