From e06970997e5a402139d2f2b9c78cab8310cad293 Mon Sep 17 00:00:00 2001
From: Ku6epXBOCTuK <Ku6epXBOCTuK@gmail.com>
Date: Sun, 13 Sep 2026 05:36:38 +0500
Subject: [PATCH] fix: update i18n text in pages and layout

---
 web/src/routes/+layout.svelte          | 24 ++++++++++++------------
 web/src/routes/+page.svelte            |  5 ++---
 web/src/routes/list-tools/+page.svelte |  5 ++---
 web/src/routes/tools/[id]/+page.svelte |  7 ++++---
 4 files changed, 20 insertions(+), 21 deletions(-)

diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index f0a3709..07b0174 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -3,6 +3,9 @@
 	import Footer from "$lib/components/layout/Footer.svelte";
 	import TopBar from "$lib/components/layout/TopBar.svelte";
 	import { initLocale } from "$lib/i18n/locale.svelte";
+	import { toolTitle } from "$lib/i18n/schema-tool-strings";
+	import { t } from "$lib/i18n/t";
+	import { getTool } from "$lib/registry";
 	import { getTheme, initTheme, setTheme } from "$lib/theme.svelte";
 	import type { Snippet } from "svelte";
 	import { onMount } from "svelte";
@@ -27,19 +30,16 @@
 
 	let crumb = $derived(toCrumb(page.url.pathname));
 
-	const CRUMB: Record<string, string> = {
-		"/list-tools": "CATALOG",
-		"/tools/linear-gradient-png": "GRADIENT",
-		"/tools/remove-background-png": "BACKGROUND REMOVER",
-	};
-
 	function toCrumb(path: string): string {
-		return (
-			"/ " +
-			(CRUMB[path] ??
-				path.split("/").filter(Boolean).pop()?.toUpperCase() ??
-				"HOME")
-		);
+		if (path === "/") return "/ " + t("header.home");
+		if (path === "/list-tools") return "/ " + t("header.catalog");
+		if (path === "/kit") return "/ " + t("header.uiKit");
+		const match = /^\/tools\/([^/]+)$/.exec(path);
+		if (match) {
+			const tool = getTool(match[1]);
+			if (tool) return "/ " + toolTitle(tool);
+		}
+		return "/ " + t("header.home");
 	}
 </script>
 
diff --git a/web/src/routes/+page.svelte b/web/src/routes/+page.svelte
index 14b294b..c0cd848 100644
--- a/web/src/routes/+page.svelte
+++ b/web/src/routes/+page.svelte
@@ -4,6 +4,7 @@
 	import CatalogHeader from "$lib/components/CatalogHeader.svelte";
 	import CatalogToolbar from "$lib/components/CatalogToolbar.svelte";
 	import ToolCard from "$lib/components/ToolCard.svelte";
+	import { t } from "$lib/i18n/t";
 	import { TOOL_ICONS } from "$lib/tool-icons";
 
 	let query = $state("");
@@ -44,9 +45,7 @@
 			</CatalogGroup>
 		{/each}
 	</div>
-	<footer class="catalog-footer">
-		ALL OPERATIONS RUN LOCALLY <span>•</span> YOUR FILES NEVER LEAVE THIS DEVICE
-	</footer>
+	<footer class="catalog-footer">{t("header.footerNote")}</footer>
 </div>
 
 <style>
diff --git a/web/src/routes/list-tools/+page.svelte b/web/src/routes/list-tools/+page.svelte
index 9f9a908..df92f6c 100644
--- a/web/src/routes/list-tools/+page.svelte
+++ b/web/src/routes/list-tools/+page.svelte
@@ -4,6 +4,7 @@
 	import CatalogHeader from "$lib/components/CatalogHeader.svelte";
 	import CatalogToolbar from "$lib/components/CatalogToolbar.svelte";
 	import ToolCard from "$lib/components/ToolCard.svelte";
+	import { t } from "$lib/i18n/t";
 	import { TOOL_ICONS } from "$lib/tool-icons";
 
 	let query = $state("");
@@ -42,9 +43,7 @@
 			</CatalogGroup>
 		{/each}
 	</div>
-	<footer class="catalog-footer">
-		ALL OPERATIONS RUN LOCALLY <span>•</span> YOUR FILES NEVER LEAVE THIS DEVICE
-	</footer>
+	<footer class="catalog-footer">{t("header.footerNote")}</footer>
 </div>
 
 <style>
diff --git a/web/src/routes/tools/[id]/+page.svelte b/web/src/routes/tools/[id]/+page.svelte
index ea70b88..c3ba498 100644
--- a/web/src/routes/tools/[id]/+page.svelte
+++ b/web/src/routes/tools/[id]/+page.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import EmptyState from "$lib/components/EmptyState.svelte";
 	import SchemaToolView from "$lib/components/SchemaToolView.svelte";
+	import { t } from "$lib/i18n/t";
 	import { getTool } from "$lib/registry";
 	import { SlidersHorizontal as ToolIcon } from "@lucide/svelte";
 
@@ -13,15 +14,15 @@
 </script>
 
 <svelte:head>
-	<title>easy-png-tools / {tool?.title ?? "Tool"}</title>
+	<title>easy-png-tools / {tool?.title ?? t("toolPage.fallbackTitle")}</title>
 	<meta name="robots" content="noindex, nofollow" />
 </svelte:head>
 
 {#if !tool}
 	<div class="notfound">
 		<EmptyState
-			title="Tool not found"
-			description="No tool is registered under “{data.id}”."
+			title={t("errors.notFound")}
+			description={t("errors.toolUnknown", { id: data.id })}
 			icon={ToolIcon}
 		/>
 	</div>