Autofocus search and login inputs on page load

src/routes/+layout.svelte

@@ -6,7 +6,6 @@
 
 	let {data, children} = $props();
     let notifications = getNotifications();
-    console.log(data.loggedIn);
 </script>
 
 <svelte:head>

src/routes/+page.svelte

@@ -1,5 +1,13 @@
+<script>
+    let searchInput;
+
+    $effect(()=>{
+        searchInput?.focus();
+    });
+</script>
+
 <form>
-    <input type="text" placeholder="Search Recipes">
+    <input type="text" placeholder="Search Recipes" bind:this={searchInput} required>
 
     <button>
         <svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" color="#000000">

src/routes/login/+page.svelte

@@ -2,6 +2,10 @@
     import {enhance} from "$app/forms";
 
     let emailInput;
+
+    $effect(()=>{
+        emailInput?.focus();
+    });
 </script>
 
 <div class="container">