feat: enhance Immich integration documentation and add warnings for localhost usage

documentation/docs/configuration/immich_integration.md

@@ -20,7 +20,7 @@ To integrate Immich with AdventureLog, you need to have an Immich server running
    - Click `New API Key` and name it something like `AdventureLog`.
    - Copy the generated API Key, you will need it in the next step.
 2. Go to the AdventureLog web interface, click on your user profile picture, go to `Settings` and scroll down to the `Immich Integration` section.
-   - Enter the URL of your Immich server, e.g. `https://immich.example.com`.
+   - Enter the URL of your Immich server, e.g. `https://immich.example.com`. Note that `localhost` or `127.0.0.1` will probably not work because Immich and AdventureLog are running on different docker networks. It is recommended to use the IP address of the server where Immich is running ex `http://my-server-ip:port` or a domain name.
    - Paste the API Key you obtained in the previous step.
    - Click `Enable Immich` to save the settings.
 3. Now, when you are adding images to an adventure, you will see an option to search for images in Immich or upload from an album.

frontend/src/lib/components/NoteModal.svelte

@@ -188,7 +188,7 @@
 						<div>
 							<label for="content">{$t('notes.content')}</label><br />
 							{#if !isReadOnly}
-								<MarkdownEditor bind:text={newNote.content} editor_height={'h-32'} />
+								<MarkdownEditor bind:text={newNote.content} editor_height={'h-72'} />
 							{:else if note}
 								<p class="text-sm text-muted-foreground" style="white-space: pre-wrap;"></p>
 								<article

frontend/src/lib/index.ts

@@ -296,7 +296,7 @@ export function getRandomBackground() {
 
 	const newYearsStart = new Date(today.getFullYear() - 1, 11, 31);
 	newYearsStart.setHours(0, 0, 0, 0);
-	const newYearsEnd = new Date(today.getFullYear(), 0, 7);
+	const newYearsEnd = new Date(today.getFullYear(), 0, 2);
 	newYearsEnd.setHours(23, 59, 59, 999);
 	if (today >= newYearsStart && today <= newYearsEnd) {
 		return {

frontend/src/locales/en.json

@@ -514,6 +514,8 @@
 		"api_key": "Immich API Key",
 		"enable_immich": "Enable Immich",
 		"update_integration": "Update Integration",
-		"immich_integration": "Immich Integration"
+		"immich_integration": "Immich Integration",
+		"localhost_note": "Note: localhost will most likely not work unless you have setup docker networks accordingly. It is recommended to use the IP address of the server or the domain name.",
+		"documentation": "Immich Integration Documentation"
 	}
 }

frontend/src/routes/settings/+page.svelte

@@ -433,6 +433,11 @@
 		<div class="bg-neutral p-6 rounded-lg shadow-md">
 			<p class="text-center text-neutral-content">
 				{$t('immich.immich_desc')}
+				<a
+					class="link link-primary"
+					href="https://adventurelog.app/docs/configuration/immich_integration.html"
+					target="_blank">{$t('immich.documentation')}</a
+				>
 			</p>
 			{#if immichIntegration}
 				<div class="flex flex-col items-center justify-center mt-1 space-y-2">
@@ -469,6 +474,11 @@
 								{$t('immich.api_note')}
 							</p>
 						{/if}
+						{#if newImmichIntegration.server_url && (newImmichIntegration.server_url.indexOf('localhost') !== -1 || newImmichIntegration.server_url.indexOf('127.0.0.1') !== -1)}
+							<p class="text-s text-warning mt-2">
+								{$t('immich.localhost_note')}
+							</p>
+						{/if}
 					</div>
 					<div class="mt-4">
 						<label for="immich_api_key" class="text-sm font-medium text-neutral-content"