From: PhiTux <redacted>
Date: Wed, 27 Aug 2025 12:22:00 +0000 (+0200)
Subject: progress in i18n
X-Git-Url: http://git.99rst.org/?a=commitdiff_plain;h=00ff88c67f0898db0b452cfd592332da495fe0cc;p=DailyTxT.git

progress in i18n
---

diff --git a/frontend/src/lib/Datepicker.svelte b/frontend/src/lib/Datepicker.svelte
index 09df692..0d0e637 100644
--- a/frontend/src/lib/Datepicker.svelte
+++ b/frontend/src/lib/Datepicker.svelte
@@ -131,7 +131,15 @@
 	};
 
 	// weekdays
-	const weekDays = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
+	const weekDays = [
+		$t('calendar.day_short.monday'),
+		$t('calendar.day_short.tuesday'),
+		$t('calendar.day_short.wednesday'),
+		$t('calendar.day_short.thursday'),
+		$t('calendar.day_short.friday'),
+		$t('calendar.day_short.saturday'),
+		$t('calendar.day_short.sunday')
+	];
 </script>
 
 <div class="datepicker glassLight">
@@ -226,7 +234,7 @@
 								fill-rule: evenodd;
 							}
 						</style></defs
-					><title>add-bookmark</title>
+					><title>{$t('calendar.button_bookmark')}</title>
 					{#if !$cal.daysBookmarked.includes($selectedDate.day)}
 						<path
 							class="cls-1"
diff --git a/frontend/src/lib/Sidenav.svelte b/frontend/src/lib/Sidenav.svelte
index 133f33b..02644a6 100644
--- a/frontend/src/lib/Sidenav.svelte
+++ b/frontend/src/lib/Sidenav.svelte
@@ -12,6 +12,9 @@
 	import { API_URL } from '$lib/APIurl.js';
 	import axios from 'axios';
 	import { cal } from '$lib/calendarStore.js';
+	import { getTranslate } from '@tolgee/svelte';
+
+	const { t } = getTranslate();
 
 	let oc;
 
@@ -263,21 +266,10 @@
 				class="btnSearchPopover btn btn-outline-secondary glassLight"
 				data-bs-toggle="popover"
 				data-bs-title="Suche"
-				data-bs-content="Du kannst nach <b>Text</b>, <b>Dateinamen</b> und <b>Tags</b> suchen.<br>
-				Mit <span class='kbd'>Ctrl</span> + <span class='kbd'>F</span> wird das Suchfeld fokussiert.<br>
-				<ul>
-					<li><b><u>Text</u></b>: Bei Verwendung von mehreren Suchbegriffen gelten folgende Regeln:
-						<ul>
-							<li><b>EXAKT</b>: Setze den kompletten Suchbegriff in <u>doppelte Anführungszeichen</u>, um die exakte Wortfolge zu suchen.</li>
-							<li><b>ODER</b>: Trenne Suchbegriffe mit <b>|</b>, um Einträge zu finden, bei denen mindestens ein Begriff verwendet wurde.</li>
-							<li><b>UND</b>: Trenne Suchbegriffe mit <u>Leerzeichen</u>, um Einträge zu finden, bei denen alle Begriffe verwendet wurden. Die Reihenfolge der Begriffe ist dabei irrelevant, genauso wie die Distanz zwischen den Begriffen.</li>
-						</ul>
-					</li>
-					<li><b><u>Dateinamen</u></b>: Wenn der Suchbegriff nur aus <u>einem Wort</u> besteht, dann wird nicht nur nach Text, sondern auch nach Dateinamen gesucht.</li>
-					<li><b><u>Tags</u></b>: Der Suchbegriff muss mit <b>#</b> beginnen. Es wird nach jedem Datum gesucht, das mit dem Tag markiert ist.</li>
-				</ul>"
+				data-bs-content={$t('search.description')}
 				onclick={(event) => event.preventDefault()}><Fa icon={faQuestionCircle} /></button
 			>
+			<!--TODO: Description not working (html?!)! -->
 			{#if $searchTag.id}
 				<!-- If a tag is selected ... -->
 				<div class="ms-1 align-content-center">
@@ -298,7 +290,7 @@
 					type="text"
 					class="form-control"
 					placeholder="Suche"
-					aria-label="Suche"
+					aria-label={$t('search.search')}
 					aria-describedby="search-button"
 					onkeydown={handleKeyDown}
 					autocomplete="off"
@@ -316,7 +308,7 @@
 					{#if $isSearching}
 						<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
 					{:else}
-						Suche
+						{$t('search.search')}
 					{/if}
 				</button>
 			{/if}
@@ -324,7 +316,9 @@
 		{#if showTagDropdown}
 			<div class="searchTagDropdown glass">
 				{#if filteredTags.length === 0}
-					<em style="padding: 0.2rem;">Kein Tag gefunden...</em>
+					<em style="padding: 0.2rem;">
+						{$t('tags.no_tags_found')}
+					</em>
 				{:else}
 					{#each filteredTags as tag, index (tag.id)}
 						<!-- svelte-ignore a11y_click_events_have_key_events -->
@@ -379,7 +373,9 @@
 					</button>
 				{/each}
 			{:else}
-				<span class="noResult">Keine Ergebnisse</span>
+				<span class="noResult">
+					{$t('search.no_results')}
+				</span>
 			{/if}
 		</div>
 	</div>
@@ -394,7 +390,9 @@
 		aria-atomic="true"
 	>
 		<div class="d-flex">
-			<div class="toast-body">Fehler beim Suchen!</div>
+			<div class="toast-body">
+				{$t('search.toast.error')}
+			</div>
 		</div>
 	</div>
 
@@ -406,7 +404,9 @@
 		aria-atomic="true"
 	>
 		<div class="d-flex">
-			<div class="toast-body">Fehler beim Markieren des Tages!</div>
+			<div class="toast-body">
+				{$t('calendar.toast.error_bookmarking')}
+			</div>
 		</div>
 	</div>
 </div>
diff --git a/frontend/src/lib/settingsStore.js b/frontend/src/lib/settingsStore.js
index 77d0867..6e97eab 100644
--- a/frontend/src/lib/settingsStore.js
+++ b/frontend/src/lib/settingsStore.js
@@ -2,13 +2,6 @@ import {writable} from 'svelte/store';
 
 export const readingMode = writable('');
 
-// old, to be deleted
-export const useTrianglify = writable(true);
-export const trianglifyOpacity = writable(0.4);
-export const trianglifyColor = writable('');
-export const backgroundColor = writable('');
-//=========
-
 export const settings = writable({});
 
 export const tempSettings = writable({});
diff --git a/frontend/src/routes/(authed)/+layout.svelte b/frontend/src/routes/(authed)/+layout.svelte
index b2c21fc..2f75cc4 100644
--- a/frontend/src/routes/(authed)/+layout.svelte
+++ b/frontend/src/routes/(authed)/+layout.svelte
@@ -7,9 +7,7 @@
 		readingMode,
 		settings,
 		tempSettings,
-		autoLoadImagesThisDevice,
-		useTrianglify,
-		trianglifyOpacity
+		autoLoadImagesThisDevice
 	} from '$lib/settingsStore.js';
 	import { API_URL } from '$lib/APIurl.js';
 	import { tags } from '$lib/tagStore.js';
@@ -1939,26 +1937,10 @@
 		border-radius: 5px;
 	}
 
-	#trianglifyOpacity {
-		max-width: 300px;
-	}
-
-	#trianglifyOpacityNumber {
-		width: 80px;
-	}
-
 	.modal-body {
 		overflow-y: hidden;
 	}
 
-	.modal-content {
-		/* backdrop-filter: blur(10px) saturate(150%);
-		background-color: rgba(208, 208, 208, 0.61); */
-
-		/* background-color: rgba(43, 56, 78, 0.75); */
-		/* color: rgb(22, 22, 22); */
-	}
-
 	.modal-header {
 		border-bottom: 1px solid rgba(255, 255, 255, 0.2);
 	}
diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte
index d8a3b50..8e9b5a6 100644
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@@ -4,7 +4,6 @@
 	import { goto } from '$app/navigation';
 	import { onMount } from 'svelte';
 	import '../scss/styles.scss';
-	import { trianglifyOpacity } from '$lib/settingsStore.js';
 	import { page } from '$app/state';
 	import { API_URL } from '$lib/APIurl.js';
 	import { alwaysShowSidenav, generateNeonMesh } from '$lib/helpers.js';
@@ -71,14 +70,6 @@
 		}
 	);
 
-	$effect(() => {
-		if ($trianglifyOpacity) {
-			if (document.querySelector('canvas')) {
-				document.querySelector('canvas').style.opacity = $trianglifyOpacity;
-			}
-		}
-	});
-
 	function calculateResize() {
 		if (window.innerWidth > 840) {
 			$alwaysShowSidenav = true;