src/lib/components/ChangelogModal.svelte

@@ -25,7 +25,8 @@
 	<div class="px-5 py-4 dark:text-gray-300">
 		<div class="flex justify-between items-start">
 			<div class="text-xl font-bold">
-				What’s New in {$WEBUI_NAME}
+				{$i18n.t('What’s New in')}
+				{$WEBUI_NAME}
 				<Confetti x={[-1, -0.25]} y={[0, 0.5]} />
 			</div>
 			<button

src/lib/components/admin/Settings/General.svelte

@@ -136,7 +136,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/admin/Settings/Users.svelte

@@ -78,7 +78,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/chat/Settings/About.svelte

@@ -58,9 +58,9 @@
 							target="_blank"
 						>
 							{updateAvailable === null
-								? 'Checking for updates...'
+								? $i18n.t('Checking for updates...')
 								: updateAvailable
-								? `(v${version.latest} available!)`
+								? `(v${version.latest} ${$i18n.t('available!')})`
 								: '(latest)'}
 						</a>
 					</div>
@@ -71,7 +71,7 @@
 							showChangelog.set(true);
 						}}
 					>
-						<div>See what's new</div>
+						<div>{$i18n.t("See what's new")}</div>
 					</button>
 				</div>
 
@@ -81,7 +81,7 @@
 						checkForVersionUpdates();
 					}}
 				>
-					Check for updates
+					{$i18n.t('Check for updates')}
 				</button>
 			</div>
 		</div>
@@ -125,7 +125,8 @@
 		</div>
 
 		<div class="mt-2 text-xs text-gray-400 dark:text-gray-500">
-			Created by <a
+			{$i18n.t('Created by')}
+			<a
 				class=" text-gray-500 dark:text-gray-300 font-medium"
 				href="https://github.com/tjbck"
 				target="_blank">Timothy J. Baek</a

src/lib/components/chat/Settings/Account.svelte

@@ -280,7 +280,7 @@
 				}
 			}}
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </div>

src/lib/components/chat/Settings/Advanced.svelte

@@ -149,7 +149,7 @@
 				dispatch('save');
 			}}
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </div>

src/lib/components/chat/Settings/Audio.svelte

@@ -262,7 +262,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/chat/Settings/Chats.svelte

@@ -154,7 +154,7 @@
 			</div>
 
 			<div class="text-xs text-left w-full font-medium mt-0.5">
-				This setting does not sync across browsers or devices.
+				{$i18n.t('This setting does not sync across browsers or devices.')}
 			</div>
 		</div>
 

src/lib/components/chat/Settings/Connections.svelte

@@ -148,13 +148,13 @@
 			</div>
 
 			<div class="mt-2 text-xs text-gray-400 dark:text-gray-500">
-				Trouble accessing Ollama?
+				{$i18n.t('Trouble accessing Ollama?')}
 				<a
 					class=" text-gray-300 font-medium"
 					href="https://github.com/open-webui/open-webui#troubleshooting"
 					target="_blank"
 				>
-					Click here for help.
+					{$i18n.t('Click here for help')}
 				</a>
 			</div>
 		</div>
@@ -165,7 +165,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/chat/Settings/General.svelte

@@ -310,7 +310,7 @@
 				dispatch('save');
 			}}
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </div>

src/lib/components/chat/Settings/Images.svelte

@@ -177,13 +177,14 @@
 		</div>
 
 		<div class="mt-2 text-xs text-gray-400 dark:text-gray-500">
-			Include `--api` flag when running stable-diffusion-webui
+			{$i18n.t('Include `--api` flag when running stable-diffusion-webui')}
 			<a
-				class=" text-gray-300 font-medium"
+				class=" text-gray-300 font-medium underline"
 				href="https://github.com/AUTOMATIC1111/stable-diffusion-webui/discussions/3734"
 				target="_blank"
 			>
-				(e.g. `sh webui.sh --api`)
+				<br />
+				{$i18n.t('(e.g. `sh webui.sh --api`)')}
 			</a>
 		</div>
 
@@ -248,7 +249,7 @@
 			type="submit"
 			disabled={loading}
 		>
-			Save
+			{$i18n.t('Save')}
 
 			{#if loading}
 				<div class="ml-2 self-center">

src/lib/components/chat/Settings/Interface.svelte

@@ -317,7 +317,7 @@
 
 				{#if promptSuggestions.length > 0}
 					<div class="text-xs text-left w-full mt-2">
-						Adjusting these settings will apply changes universally to all users.
+						{$i18n.t('Adjusting these settings will apply changes universally to all users.')}
 					</div>
 				{/if}
 			</div>
@@ -329,7 +329,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/chat/Settings/Models.svelte

@@ -84,7 +84,9 @@
 				if (!data.success) {
 					toast.error(data.error);
 				} else {
-					toast.success($i18n.t(`Model '{{modelName}}' has been successfully downloaded.`, {modelName}));
+					toast.success(
+						$i18n.t(`Model '{{modelName}}' has been successfully downloaded.`, { modelName })
+					);
 
 					const notification = new Notification($WEBUI_NAME, {
 						body: $i18n.t(`Model '{{modelName}}' has been successfully downloaded.`, { modelName }),
@@ -376,7 +378,7 @@
 		{#if ollamaVersion}
 			<div class="space-y-2 pr-1.5">
 				<div>
-					<div class=" mb-2 text-sm font-medium">Manage Ollama Models</div>
+					<div class=" mb-2 text-sm font-medium">{$i18n.t('Manage Ollama Models')}</div>
 
 					<div class=" mb-2 text-sm font-medium">{$i18n.t('Pull a model from Ollama.com')}</div>
 					<div class="flex w-full">
@@ -439,7 +441,8 @@
 					</div>
 
 					<div class="mt-2 mb-1 text-xs text-gray-400 dark:text-gray-500">
-						To access the available model names for downloading, <a
+						{$i18n.t('To access the available model names for downloading,')}
+						<a
 							class=" text-gray-500 dark:text-gray-300 font-medium underline"
 							href="https://ollama.com/library"
 							target="_blank">{$i18n.t('click here.')}</a
@@ -515,7 +518,7 @@
 							type="button"
 							on:click={() => {
 								showExperimentalOllama = !showExperimentalOllama;
-							}}>{showExperimentalOllama ? 'Show' : 'Hide'}</button
+							}}>{showExperimentalOllama ? $i18n.t('Show') : $i18n.t('Hide')}</button
 						>
 					</div>
 				</div>
@@ -701,7 +704,7 @@
 								type="button"
 								on:click={() => {
 									showLiteLLMParams = !showLiteLLMParams;
-								}}>{showLiteLLMParams ? 'Advanced' : 'Default'}</button
+								}}>{showLiteLLMParams ? $i18n.t('Advanced') : $i18n.t('Default')}</button
 							>
 						</div>
 					</div>
@@ -796,13 +799,13 @@
 					</div>
 
 					<div class="mb-2 text-xs text-gray-400 dark:text-gray-500">
-						Not sure what to add?
+						{$i18n.t('Not sure what to add?')}
 						<a
 							class=" text-gray-300 font-medium underline"
 							href="https://litellm.vercel.app/docs/proxy/configs#quick-start"
 							target="_blank"
 						>
-							Click here for help.
+							{$i18n.t('Click here for help')}
 						</a>
 					</div>
 

src/lib/components/documents/AddDocModal.svelte

@@ -158,7 +158,7 @@
 							class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 							type="submit"
 						>
-							Save
+							{$i18n.t('Save')}
 						</button>
 					</div>
 				</form>

src/lib/components/documents/EditDocModal.svelte

@@ -161,7 +161,7 @@
 							class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 							type="submit"
 						>
-							Save
+							{$i18n.t('Save')}
 						</button>
 					</div>
 				</form>

src/lib/components/documents/Settings/General.svelte

@@ -176,7 +176,7 @@
 			class=" px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-gray-100 transition rounded"
 			type="submit"
 		>
-			Save
+			{$i18n.t('Save')}
 		</button>
 	</div>
 </form>

src/lib/components/layout/Sidebar.svelte

@@ -240,9 +240,11 @@
 					<div class=" text-left px-5 py-2">
 						<div class=" font-medium">{$i18n.t('Chat History is off for this browser.')}</div>
 						<div class="text-xs mt-2">
-							When history is turned off, new chats on this browser won't appear in your history on
+							{$i18n.t(
-							any of your devices. <span class=" font-semibold"
+								"When history is turned off, new chats on this browser won't appear in your history on any of your devices."
-								>This setting does not sync across browsers or devices.</span
+							)}
+							<span class=" font-semibold"
+								>{$i18n.t('This setting does not sync across browsers or devices.')}</span
 							>
 						</div>
 
@@ -269,7 +271,7 @@
 									/>
 								</svg>
 
-								<div>Enable Chat History</div>
+								<div>{$i18n.t('Enable Chat History')}</div>
 							</button>
 						</div>
 					</div>
@@ -295,7 +297,7 @@
 
 					<input
 						class="w-full rounded-r-xl py-1.5 pl-2.5 pr-4 text-sm text-gray-300 bg-gray-950 outline-none"
-						placeholder="Search"
+						placeholder={$i18n.t('Search')}
 						bind:value={search}
 						on:focus={() => {
 							enrichChatsWithContent($chats);

src/lib/i18n/locales/de/common.json

@@ -188,7 +188,7 @@
 	"Save & Update": "Speichern und aktualisieren",
 	"Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through": "Das direkte Speichern von Chat-Protokollen im Browser-Speicher wird nicht mehr unterstützt. Bitte nehmen Sie sich einen Moment Zeit, um Ihre Chat-Protokolle herunterzuladen und zu löschen, indem Sie auf die Schaltfläche unten klicken. Keine Sorge, Sie können Ihre Chat-Protokolle problemlos über das Backend wieder importieren.",
 	"Scan complete!": "Scan abgeschlossen!",
-	"Scan for documents from {{path}}'": "Dokumente von {{path}} scannen'",
+	"Scan for documents from {{path}}": "Dokumente von {{path}} scannen",
 	"Scan": "Scannen",
 	"Seed": "Seed",
 	"See readme.md for instructions": "Anleitung in readme.md anzeigen",
@@ -244,7 +244,7 @@
 	"{{webui_name}} Backend Required": "{{webui_name}}-Backend erforderlich",
 	"WebUI Settings": "WebUI-Einstellungen",
 	"Web": "Web",
-	"Whisper (Local)": "Flüstern (Lokal)",
+	"Whisper (Local)": "Whisper (Lokal)",
 	"You're now logged in.": "Sie sind jetzt angemeldet.",
 	"Hide": "Verbergen",
 	"Show": "Anzeigen",
@@ -252,5 +252,38 @@
 	"Enter OpenAI API Key": "OpenAI-API-Key eingeben",
 	"Current Model": "Aktuelles Modell",
 	"Display the username instead of You in the Chat": "Den Benutzernamen anstelle von 'Sie' im Chat anzeigen",
-	"Default titleGenerationPromt": "Erstelle einen prägnanten Satz mit 3-5 Wörtern als Überschrift für die folgende Abfrage. Halte dich dabei strikt an die 3-5-Wort-Grenze und vermeide die Verwendung des Wortes Titel:"
+	"Default titleGenerationPromt": "Erstelle einen prägnanten Satz mit 3-5 Wörtern als Überschrift für die folgende Abfrage. Halte dich dabei strikt an die 3-5-Wort-Grenze und vermeide die Verwendung des Wortes Titel:",
+	"Search": "Suchen",
+	"Search Documents": "Dokumente suchen",
+	"Use '#' in the prompt input to load and select your documents.": "Verwenden Sie '#' in der Prompt-Eingabe, um Ihre Dokumente zu laden und auszuwählen.",
+	"All Users": "Alle Benutzer",
+	"Click on the user role button to change a user's role.": "Klicken Sie auf die Benutzerrollenschaltfläche, um die Rolle eines Benutzers zu ändern.",
+	"Manage Ollama Models": "Ollama-Modelle verwalten",
+	"Advanced": "Angepasst",
+	"Click here for help": "Klicken Sie hier für Hilfe",
+	"Not sure what to add?": "Nicht sicher, was hinzugefügt werden soll?",
+	"Adjusting these settings will apply changes universally to all users.": "Das Anpassen dieser Einstellungen wirkt sich universell auf alle Benutzer aus.",
+	"Trouble accessing Ollama?": "Probleme beim Zugriff auf Ollama?",
+	"(e.g. `sh webui.sh --api`)": "(z.B. `sh webui.sh --api`)",
+	"Include `--api` flag when running stable-diffusion-webui": "Fügen Sie das `--api`-Flag hinzu, wenn Sie stable-diffusion-webui ausführen",
+	"This setting does not sync across browsers or devices.": "Diese Einstellung wird nicht zwischen Browsern oder Geräten synchronisiert.",
+	"When history is turned off, new chats on this browser won't appear in your history on any of your devices.": "Wenn die Historie ausgeschaltet ist, werden neue Chats auf diesem Browser nicht in Ihrer Historie auf einem Ihrer Geräte angezeigt.",
+	"Enable Chat History": "Chat-Verlauf aktivieren",
+	"Search Prompts": "Prompts suchen",
+	"available!": "verfügbar!",
+	"Created by": "Erstellt von",
+	"Check for updates": "Nach Updates suchen",
+	"See what's new": "Was gibt's Neues",
+	"Checking for updates...": "Nach Updates suchen...",
+	"What’s New in": "Was gibt's Neues in",
+	"Enter Your Email": "Geben Sie Ihre E-Mail-Adresse ein",
+	"Enter Your Password": "Geben Sie Ihr Passwort ein",
+	"Enter Your Full Name": "Geben Sie Ihren vollständigen Namen ein",
+	"Sign in": "Anmelden",
+	"Sign up": "Registrieren",
+	"Create Account": "Konto erstellen",
+	"Don't have an account?": "Sie haben noch kein Konto?",
+	"Already have an account?": "Sie haben bereits ein Konto?",
+	"to": "für",
+	"does not make any external connections, and your data stays securely on your locally hosted server.": "stellt keine externen Verbindungen her, und Ihre Daten bleiben sicher auf Ihrem lokal gehosteten Server."
 }

src/lib/i18n/locales/en/common.json

@@ -188,7 +188,7 @@
 	"Save & Update": "Save & Update",
 	"Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through": "Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through",
 	"Scan complete!": "Scan complete!",
-	"Scan for documents from {{path}}'": "Scan for documents from {{path}}'",
+	"Scan for documents from {{path}}": "Scan for documents from {{path}}",
 	"Scan": "Scan",
 	"Seed": "Seed",
 	"See readme.md for instructions": "See readme.md for instructions",
@@ -252,5 +252,38 @@
 	"Enter OpenAI API Key": "Enter OpenAI API Key",
 	"Current Model": "Current Model",
 	"Display the username instead of You in the Chat": "Display the username instead of 'You' in the Chat",
-	"Default titleGenerationPromt": "Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title':"
+	"Default titleGenerationPromt": "Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title':",
+	"Search": "Search",
+	"Search Documents": "Search Documents",
+	"Use '#' in the prompt input to load and select your documents.": "Use '#' in the prompt input to load and select your documents.",
+	"All Users": "All Users",
+	"Click on the user role button to change a user's role.": "Click on the user role button to change a user's role.",
+	"Manage Ollama Models": "Manage Ollama Models",
+	"Advanced": "Advanced",
+	"Click here for help": "Click here for help",
+	"Not sure what to add?": "Not sure what to add?",
+	"Adjusting these settings will apply changes universally to all users.": "Adjusting these settings will apply changes universally to all users.",
+	"Trouble accessing Ollama?": "Trouble accessing Ollama?",
+	"(e.g. `sh webui.sh --api`)": "(e.g. `sh webui.sh --api`)",
+	"Include `--api` flag when running stable-diffusion-webui": "Include `--api` flag when running stable-diffusion-webui",
+	"This setting does not sync across browsers or devices.": "This setting does not sync across browsers or devices.",
+	"When history is turned off, new chats on this browser won't appear in your history on any of your devices.": "When history is turned off, new chats on this browser won't appear in your history on any of your devices.",
+	"Enable Chat History": "Enable Chat History",
+	"Search Prompts": "Search Prompts",
+	"available!": "available!",
+	"Created by": "Created by",
+	"Check for updates": "Check for updates",
+	"See what's new": "See what's new",
+	"Checking for updates...": "Checking for updates...",
+	"What’s New in": "hat’s New in",
+	"Enter Your Email": "Enter Your Email",
+	"Enter Your Password": "Enter Your Password",
+	"Enter Your Full Name": "Enter Your Full Name",
+	"Sign in": "Sign in",
+	"Sign up": "Sign up",
+	"Create Account": "Create Account",
+	"Don't have an account?": "Don't have an account?",
+	"Already have an account?": "Already have an account?",
+	"to": "to",
+	"does not make any external connections, and your data stays securely on your locally hosted server.": "does not make any external connections, and your data stays securely on your locally hosted server."
 }

src/lib/i18n/locales/fa/common.json

@@ -188,7 +188,7 @@
 	"Save & Update": "ذخیره و به‌روزرسانی",
 	"Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through": "Saving chat logs directly to your browser's storage is no longer supported. Please take a moment to download and delete your chat logs by clicking the button below. Don't worry, you can easily re-import your chat logs to the backend through",
 	"Scan complete!": "اسکن کامل شد!",
-	"Scan for documents from {{path}}'": "Scan for documents from {{path}}'",
+	"Scan for documents from {{path}}": "Scan for documents from {{path}}",
 	"Scan": "اسکن",
 	"Seed": "Seed",
 	"See readme.md for instructions": "See readme.md for instructions",
@@ -252,5 +252,38 @@
 	"Enter OpenAI API Key": "Enter OpenAI API Key",
 	"Current Model": "Current Model",
 	"Display the username instead of You in the Chat": "Display the username instead of 'You' in the Chat",
-	"Default titleGenerationPromt": "Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title':"
+	"Default titleGenerationPromt": "Create a concise, 3-5 word phrase as a header for the following query, strictly adhering to the 3-5 word limit and avoiding the use of the word 'title':",
+	"Search": "Search",
+	"Search Documents": "Search Documents",
+	"Use '#' in the prompt input to load and select your documents.": "Use '#' in the prompt input to load and select your documents.",
+	"All Users": "All Users",
+	"Click on the user role button to change a user's role.": "Click on the user role button to change a user's role.",
+	"Manage Ollama Models": "Manage Ollama Models",
+	"Advanced": "Advanced",
+	"Click here for help": "Click here for help",
+	"Not sure what to add?": "Not sure what to add?",
+	"Adjusting these settings will apply changes universally to all users.": "Adjusting these settings will apply changes universally to all users.",
+	"Trouble accessing Ollama?": "Trouble accessing Ollama?",
+	"(e.g. `sh webui.sh --api`)": "(e.g. `sh webui.sh --api`)",
+	"Include `--api` flag when running stable-diffusion-webui": "Include `--api` flag when running stable-diffusion-webui",
+	"This setting does not sync across browsers or devices.": "This setting does not sync across browsers or devices.",
+	"When history is turned off, new chats on this browser won't appear in your history on any of your devices.": "When history is turned off, new chats on this browser won't appear in your history on any of your devices.",
+	"Enable Chat History": "Enable Chat History",
+	"Search Prompts": "Search Prompts",
+	"available!": "available!",
+	"Created by": "Created by",
+	"Check for updates": "Check for updates",
+	"See what's new": "See what's new",
+	"Checking for updates...": "Checking for updates...",
+	"What’s New in": "hat’s New in",
+	"Enter Your Email": "Enter Your Email",
+	"Enter Your Password": "Enter Your Password",
+	"Enter Your Full Name": "Enter Your Full Name",
+	"Sign in": "Sign in",
+	"Sign up": "Sign up",
+	"Create Account": "Create Account",
+	"Don't have an account?": "Don't have an account?",
+	"Already have an account?": "Already have an account?",
+	"to": "to",
+	"does not make any external connections, and your data stays securely on your locally hosted server.": "does not make any external connections, and your data stays securely on your locally hosted server."
 }

src/routes/(app)/admin/+page.svelte

@@ -90,7 +90,7 @@
 					<div class=" flex flex-col justify-center">
 						<div class=" flex justify-between items-center">
 							<div class="flex items-center text-2xl font-semibold">
-								All Users
+								{$i18n.t('All Users')}
 								<div class="flex self-center w-[1px] h-6 mx-2.5 bg-gray-200 dark:bg-gray-700" />
 								<span class="text-lg font-medium text-gray-500 dark:text-gray-300"
 									>{users.length}</span
@@ -122,7 +122,7 @@
 							</div>
 						</div>
 						<div class=" text-gray-500 text-xs mt-1">
-							ⓘ Click on the user role button to change a user's role.
+							ⓘ {$i18n.t("Click on the user role button to change a user's role.")}
 						</div>
 
 						<hr class=" my-3 dark:border-gray-600" />

src/routes/(app)/documents/+page.svelte

@@ -219,7 +219,7 @@
 					</div>
 				</div>
 				<div class=" text-gray-500 text-xs mt-1">
-					ⓘ Use '#' in the prompt input to load and select your documents.
+					ⓘ {$i18n.t("Use '#' in the prompt input to load and select your documents.")}
 				</div>
 			</div>
 
@@ -242,7 +242,7 @@
 					<input
 						class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-none bg-transparent"
 						bind:value={query}
-						placeholder="Search Document"
+						placeholder={$i18n.t('Search Documents')}
 					/>
 				</div>
 

src/routes/(app)/prompts/+page.svelte

@@ -70,7 +70,7 @@
 					<input
 						class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-none bg-transparent"
 						bind:value={query}
-						placeholder="Search Prompt"
+						placeholder={$i18n.t('Search Prompts')}
 					/>
 				</div>
 

src/routes/auth/+page.svelte

@@ -98,13 +98,17 @@
 					}}
 				>
 					<div class=" text-xl sm:text-2xl font-bold">
-						{mode === 'signin' ? 'Sign in' : 'Sign up'} to {$WEBUI_NAME}
+						{mode === 'signin' ? $i18n.t('Sign in') : $i18n.t('Sign up')}
+						{$i18n.t('to')}
+						{$WEBUI_NAME}
 					</div>
 
 					{#if mode === 'signup'}
 						<div class=" mt-1 text-xs font-medium text-gray-500">
-							ⓘ {$WEBUI_NAME} does not make any external connections, and your data stays securely on
+							ⓘ {$WEBUI_NAME}
-							your locally hosted server.
+							{$i18n.t(
+								'does not make any external connections, and your data stays securely on your locally hosted server.'
+							)}
 						</div>
 					{/if}
 
@@ -117,7 +121,7 @@
 									type="text"
 									class=" border px-4 py-2.5 rounded-2xl w-full text-sm"
 									autocomplete="name"
-									placeholder="Enter Your Full Name"
+									placeholder={$i18n.t('Enter Your Full Name')}
 									required
 								/>
 							</div>
@@ -132,7 +136,7 @@
 								type="email"
 								class=" border px-4 py-2.5 rounded-2xl w-full text-sm"
 								autocomplete="email"
-								placeholder="Enter Your Email"
+								placeholder={$i18n.t('Enter Your Email')}
 								required
 							/>
 						</div>
@@ -143,7 +147,7 @@
 								bind:value={password}
 								type="password"
 								class=" border px-4 py-2.5 rounded-2xl w-full text-sm"
-								placeholder="Enter Your Password"
+								placeholder={$i18n.t('Enter Your Password')}
 								autocomplete="current-password"
 								required
 							/>
@@ -155,11 +159,13 @@
 							class=" bg-gray-900 hover:bg-gray-800 w-full rounded-full text-white font-semibold text-sm py-3 transition"
 							type="submit"
 						>
-							{mode === 'signin' ? 'Sign In' : 'Create Account'}
+							{mode === 'signin' ? $i18n.t('Sign in') : $i18n.t('Create Account')}
 						</button>
 
 						<div class=" mt-4 text-sm text-center">
-							{mode === 'signin' ? `Don't have an account?` : `Already have an account?`}
+							{mode === 'signin'
+								? $i18n.t("Don't have an account?")
+								: $i18n.t('Already have an account?')}
 
 							<button
 								class=" font-medium underline"
@@ -172,7 +178,7 @@
 									}
 								}}
 							>
-								{mode === 'signin' ? `Sign up` : `Sign In`}
+								{mode === 'signin' ? $i18n.t('Sign up') : $i18n.t('Sign in')}
 							</button>
 						</div>
 					</div>