From 1777ed8e0c22fd3e656cc71fe063a023cac18ef5 Mon Sep 17 00:00:00 2001
From: Eddy <eddy@alles-watt-laeuft.de>
Date: Mon, 13 Apr 2026 22:18:10 +0200
Subject: [PATCH] Footer-Statusleiste mit Token, Kosten, Modell-Badge

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/routes/+layout.svelte | 37 +++++++++++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index be80cd3..2b51e4b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -74,9 +74,20 @@
 		<slot />
 	</main>
 
-	<!-- STOPP-Footer -->
-	<footer class="stop-footer" class:active={$isProcessing}>
+	<!-- Footer: STOPP + Stats -->
+	<footer class="footer" class:active={$isProcessing}>
 		<StopButton on:click={handleStop} disabled={!$isProcessing} />
+		<div class="footer-stats">
+			<span>Token: {formatTokens($sessionStats.totalTokensIn)} in / {formatTokens($sessionStats.totalTokensOut)} out</span>
+			<span class="sep">|</span>
+			<span>Kosten: {formatCost($sessionStats.totalCost)}</span>
+			<span class="sep">|</span>
+			<span>{$sessionStats.messageCount} Antworten</span>
+			{#if $currentModel}
+				<span class="sep">|</span>
+				<span class="model">{$currentModel.replace('claude-', '').replace(/-\d{8}$/, '').replace(/(\D)-(\d)/g, '$1 $2').replace(/(\d)-(\d)/g, '$1.$2').replace(/\b[a-z]/g, c => c.toUpperCase())}</span>
+			{/if}
+		</div>
 	</footer>
 </div>
 
@@ -154,16 +165,34 @@
 		overflow: hidden;
 	}
 
-	.stop-footer {
+	.footer {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
+		gap: var(--spacing-xs);
 		padding: var(--spacing-xs) var(--spacing-md);
 		background: var(--bg-secondary);
 		border-top: 1px solid var(--border);
 	}
 
-	.stop-footer.active {
+	.footer.active {
 		border-top: 2px solid var(--error);
 	}
+
+	.footer-stats {
+		display: flex;
+		gap: var(--spacing-sm);
+		font-size: 0.65rem;
+		color: var(--text-secondary);
+		font-family: var(--font-mono);
+	}
+
+	.footer-stats .sep {
+		opacity: 0.3;
+	}
+
+	.footer-stats .model {
+		color: var(--accent);
+		font-weight: 600;
+	}
 </style>