Enhance TransportationCard unlinked state logic and improve date handling; update TransportationModal for conditional rendering and add new background image in JSON.

frontend/src/lib/components/TransportationCard.svelte

@@ -22,23 +22,49 @@
 
 	let unlinked: boolean = false;
 
-	// unlinked if collection.start_date and collection.end_date are not within transportation.date and transportation.end_date. check for null in the collection dates first to avoid errors
 	$: {
 		if (collection?.start_date && collection.end_date) {
+			// Parse transportation dates
+			let transportationStartDate = transportation.date
+				? new Date(transportation.date.split('T')[0]) // Ensure proper date parsing
+				: null;
+			let transportationEndDate = transportation.end_date
+				? new Date(transportation.end_date.split('T')[0])
+				: null;
+
+			// Parse collection dates
+			let collectionStartDate = new Date(collection.start_date);
+			let collectionEndDate = new Date(collection.end_date);
+
+			// // Debugging outputs
+			// console.log(
+			// 	'Transportation Start Date:',
+			// 	transportationStartDate,
+			// 	'Transportation End Date:',
+			// 	transportationEndDate
+			// );
+			// console.log(
+			// 	'Collection Start Date:',
+			// 	collectionStartDate,
+			// 	'Collection End Date:',
+			// 	collectionEndDate
+			// );
+
+			// Check if the collection range is outside the transportation range
 			const startOutsideRange =
-				transportation.date &&
+				transportationStartDate &&
-				collection.start_date < transportation.date &&
+				collectionStartDate < transportationStartDate &&
-				collection.end_date < transportation.date;
+				collectionEndDate < transportationStartDate;
 
 			const endOutsideRange =
-				transportation.end_date &&
+				transportationEndDate &&
-				collection.start_date > transportation.end_date &&
+				collectionStartDate > transportationEndDate &&
-				collection.end_date > transportation.end_date;
+				collectionEndDate > transportationEndDate;
 
 			unlinked = !!(
 				startOutsideRange ||
 				endOutsideRange ||
-				(!transportation.date && !transportation.end_date)
+				(!transportationStartDate && !transportationEndDate)
 			);
 		}
 	}

frontend/src/lib/components/TransportationModal.svelte

@@ -429,7 +429,11 @@
 				<div class="collapse collapse-plus bg-base-200 mb-4">
 					<input type="checkbox" checked />
 					<div class="collapse-title text-xl font-medium">
-						{$t('adventures.flight_information')}
+						{#if transportation?.type == 'plane'}
+							{$t('adventures.flight_information')}
+						{:else}
+							{$t('adventures.location_information')}
+						{/if}
 					</div>
 
 					<div class="collapse-content">

frontend/src/lib/json/backgrounds.json

@@ -19,6 +19,11 @@
 			"url": "backgrounds/adventurelog_showcase_4.webp",
 			"author": "Sean Morley",
 			"location": "Great Sand Dunes National Park, Colorado, USA"
+		},
+		{
+			"url": "backgrounds/adventurelog_showcase_5.webp",
+			"author": "Sean Morley",
+			"location": "Hoboken, New Jersey, USA"
 		}
 	]
 }

frontend/src/routes/collections/[id]/+page.svelte

@@ -72,16 +72,32 @@
 
 	// Compute `dates` array reactively
 	$: {
+		dates = [];
+
 		if (adventures) {
-			dates = adventures.flatMap((adventure) =>
+			dates = dates.concat(
-				adventure.visits.map((visit) => ({
+				adventures.flatMap((adventure) =>
-					id: adventure.id,
+					adventure.visits.map((visit) => ({
-					start: visit.start_date, // Convert to ISO format if needed
+						id: adventure.id,
-					end: visit.end_date || visit.start_date,
+						start: visit.start_date || '', // Ensure it's a string
-					title: adventure.name + (adventure.category?.icon ? ' ' + adventure.category.icon : '')
+						end: visit.end_date || visit.start_date || '', // Ensure it's a string
+						title: adventure.name + (adventure.category?.icon ? ' ' + adventure.category.icon : '')
+					}))
+				)
+			);
+		}
+
+		if (transportations) {
+			dates = dates.concat(
+				transportations.map((transportation) => ({
+					id: transportation.id,
+					start: transportation.date || '', // Ensure it's a string
+					end: transportation.end_date || transportation.date || '', // Ensure it's a string
+					title: transportation.name + (transportation.type ? ` (${transportation.type})` : '')
 				}))
 			);
 		}
+
 		// Update `options.events` when `dates` changes
 		options = { ...options, events: dates };
 	}

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

@@ -110,14 +110,6 @@
 				id="name"
 				on:change={() => (property = 'name')}
 			/>
-			<input
-				class="join-item btn"
-				type="radio"
-				name="filter"
-				aria-label={$t('transportation.type')}
-				id="type"
-				on:change={() => (property = 'type')}
-			/>
 			<input
 				class="join-item btn"
 				type="radio"