tuki testeaduki y andanduki

Front/src/Componentes/NavBarLogin.svelte

@@ -2,7 +2,12 @@
     import { Navbar, NavbarBrand, NavbarToggler, NavItem, Nav, NavLink, Collapse } from "@sveltestrap/sveltestrap";
     
     let isOpen:boolean = false;
- 
+    let theme = $state(localStorage.getItem("theme") ?? "light"); 
+  const toggleTheme = () => {
+    theme = theme === "light" ? "dark" : "light";
+    document.body.setAttribute("data-bs-theme", theme);
+    localStorage.setItem("theme", theme);
+  };
 </script>
 
 
@@ -10,6 +15,15 @@
   <NavbarBrand href="/">
     AlquilaFacil
   </NavbarBrand>
+  <div>
+    <button class="badge btn" onclick={toggleTheme} style="background-color: cadetblue;">
+      {#if theme === "light" }
+      <img src="/toggle-left.svg" alt=""/>
+      {:else}
+      <img src="/toggle-right.svg" alt=""/>
+      {/if}
+    </button>
+  </div>
   <NavbarToggler on:click={() => (isOpen = !isOpen)} />
   <Collapse isOpen={isOpen} navbar expand="md">
     <Nav class="ms-auto" navbar>