Update startup.sh, +page.server.ts, FeaturedAdventureCard.svelte, and Navbar.svelte

src/lib/components/FeaturedAdventureCard.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+    import { createEventDispatcher } from 'svelte';
+    import locationDot from "$lib/assets/locationDot.svg";
+    import calendar from "$lib/assets/calendar.svg";
+    const dispatch = createEventDispatcher();
+
+    export let name:String;
+    export let location:String;
+
+    function add() {
+        dispatch('add', {name, location});
+    }
+</script>
+
+<div class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-neutral shadow-xl overflow-hidden">
+    <div class="card-body">
+      <h2 class="card-title overflow-ellipsis">{name}</h2>
+      <p><img src={locationDot} class="inline-block -mt-1 mr-1" alt="Logo" />{location}</p>
+      <div class="card-actions justify-end">
+        <button class="btn btn-primary" on:click={add}>Add</button>
+      </div>
+    </div>
+</div>
+

src/lib/components/Navbar.svelte

@@ -8,16 +8,20 @@
     async function goToLog() {
         goto('/log');
     }
+    async function goToFeatured() {
+        goto('/featured');
+    }
 </script>
 <div class="navbar bg-base-100 flex flex-col md:flex-row">
     <div class="navbar-start flex justify-around md:justify-start">
         <button class="btn btn-primary my-2 md:my-0 md:mr-4 md:ml-2" on:click={goHome}>Home</button>
-        <button class="btn btn-primary my-2 md:my-0" on:click={goToLog}>My Log</button>
+        <button class="btn btn-primary my-2 md:my-0 md:mr-4 md:ml-2" on:click={goToLog}>My Log</button>
+        <button class="btn btn-primary my-2 md:my-0" on:click={goToFeatured}>Featured</button>
     </div>
     <div class="navbar-center flex justify-center md:justify-center">
       <a class="btn btn-ghost text-xl" href="/">AdventureLog 🗺️</a>
     </div>
-    <div class="navbar-end flex justify-around md:justify-end">
+    <div class="navbar-end flex justify-around md:justify-end mr-4">
       <p>Adventures: {getNumberOfAdventures()} </p>
     </div>
 </div>