initial production version

src/lib/components/layout/Navigation.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	import { Button } from '$lib/components/ui/button';
+	import { ThemeToggle } from '$lib/components/ui/theme-toggle';
+	import { LanguageToggle } from '$lib/components/ui/language-toggle';
+	import { LayoutDashboard } from 'lucide-svelte';
+	import { languageStore } from '$lib/stores/language.svelte';
+
+	let {
+		isAuthenticated = false,
+		showDashboardLink = false
+	}: {
+		isAuthenticated?: boolean;
+		showDashboardLink?: boolean;
+	} = $props();
+
+	const t = $derived(languageStore.t);
+</script>
+
+<nav class="flex items-center gap-1 sm:gap-2 mb-6 w-full">
+	{#if isAuthenticated}
+		<Button variant="outline" size="sm" onclick={() => (window.location.href = '/dashboard')} class="px-2 sm:px-3">
+			<LayoutDashboard class="w-4 h-4" />
+			<span class="hidden sm:inline sm:ml-2">{t.nav.dashboard}</span>
+		</Button>
+	{:else}
+		<Button variant="outline" size="sm" onclick={() => (window.location.href = '/signin')} class="px-2 sm:px-3">
+			{t.auth.signIn}
+		</Button>
+	{/if}
+	<div class="ml-auto flex items-center gap-1 sm:gap-2">
+		<LanguageToggle />
+		<ThemeToggle />
+	</div>
+</nav>