refactor(CollectionAllView): enhance mobile responsiveness and clean up unused imports

frontend/src/lib/components/CollectionAllView.svelte

@@ -29,7 +29,6 @@
 	import LodgingCard from './LodgingCard.svelte';
 	import NoteCard from './NoteCard.svelte';
 	import ChecklistCard from './ChecklistCard.svelte';
-	import NotFound from './NotFound.svelte';
 
 	// Props
 	export let adventures: Adventure[] = [];
@@ -363,55 +362,61 @@
 		<span class="text-sm font-medium text-base-content/60">
 			{$t('adventures.show')}:
 		</span>
-		<div class="tabs tabs-boxed bg-base-200 overflow-x-auto">
+
-			<button
+		<!-- Scrollable container on mobile -->
-				class="tab tab-sm gap-2 {filterOption === 'all' ? 'tab-active' : ''} whitespace-nowrap"
+		<div class="w-full overflow-x-auto">
-				on:click={() => (filterOption = 'all')}
+			<div class="tabs tabs-boxed bg-base-200 flex-nowrap flex sm:flex-wrap w-max sm:w-auto">
-			>
+				<button
-				<Adventures class="w-3 h-3" />
+					class="tab tab-sm gap-2 {filterOption === 'all' ? 'tab-active' : ''} whitespace-nowrap"
-				{$t('adventures.all')}
+					on:click={() => (filterOption = 'all')}
-			</button>
+				>
-			<button
+					<Adventures class="w-3 h-3" />
-				class="tab tab-sm gap-2 {filterOption === 'adventures'
+					{$t('adventures.all')}
-					? 'tab-active'
+				</button>
-					: ''} whitespace-nowrap"
+				<button
-				on:click={() => (filterOption = 'adventures')}
+					class="tab tab-sm gap-2 {filterOption === 'adventures'
-			>
+						? 'tab-active'
-				<Adventures class="w-3 h-3" />
+						: ''} whitespace-nowrap"
-				{$t('navbar.adventures')}
+					on:click={() => (filterOption = 'adventures')}
-			</button>
+				>
-			<button
+					<Adventures class="w-3 h-3" />
-				class="tab tab-sm gap-2 {filterOption === 'transportation'
+					{$t('navbar.adventures')}
-					? 'tab-active'
+				</button>
-					: ''} whitespace-nowrap"
+				<button
-				on:click={() => (filterOption = 'transportation')}
+					class="tab tab-sm gap-2 {filterOption === 'transportation'
-			>
+						? 'tab-active'
-				<TransportationIcon class="w-3 h-3" />
+						: ''} whitespace-nowrap"
-				{$t('adventures.transportations')}
+					on:click={() => (filterOption = 'transportation')}
-			</button>
+				>
-			<button
+					<TransportationIcon class="w-3 h-3" />
-				class="tab tab-sm gap-2 {filterOption === 'lodging' ? 'tab-active' : ''} whitespace-nowrap"
+					{$t('adventures.transportations')}
-				on:click={() => (filterOption = 'lodging')}
+				</button>
-			>
+				<button
-				<Hotel class="w-3 h-3" />
+					class="tab tab-sm gap-2 {filterOption === 'lodging'
-				{$t('adventures.lodging')}
+						? 'tab-active'
-			</button>
+						: ''} whitespace-nowrap"
-			<button
+					on:click={() => (filterOption = 'lodging')}
-				class="tab tab-sm gap-2 {filterOption === 'notes' ? 'tab-active' : ''} whitespace-nowrap"
+				>
-				on:click={() => (filterOption = 'notes')}
+					<Hotel class="w-3 h-3" />
-			>
+					{$t('adventures.lodging')}
-				<NoteIcon class="w-3 h-3" />
+				</button>
-				{$t('adventures.notes')}
+				<button
-			</button>
+					class="tab tab-sm gap-2 {filterOption === 'notes' ? 'tab-active' : ''} whitespace-nowrap"
-			<button
+					on:click={() => (filterOption = 'notes')}
-				class="tab tab-sm gap-2 {filterOption === 'checklists'
+				>
-					? 'tab-active'
+					<NoteIcon class="w-3 h-3" />
-					: ''} whitespace-nowrap"
+					{$t('adventures.notes')}
-				on:click={() => (filterOption = 'checklists')}
+				</button>
-			>
+				<button
-				<ChecklistIcon class="w-3 h-3" />
+					class="tab tab-sm gap-2 {filterOption === 'checklists'
-				{$t('adventures.checklists')}
+						? 'tab-active'
-			</button>
+						: ''} whitespace-nowrap"
+					on:click={() => (filterOption = 'checklists')}
+				>
+					<ChecklistIcon class="w-3 h-3" />
+					{$t('adventures.checklists')}
+				</button>
+			</div>
 		</div>
 	</div>
 </div>
@@ -536,32 +541,10 @@
 	<div class="hero min-h-96">
 		<div class="hero-content text-center">
 			<div class="max-w-md">
-				<div class="mb-8">
+				<Clear class="w-16 h-16 text-base-content/30 mb-4" />
-					{#if searchQuery || filterOption !== 'all'}
+				<h1 class="text-3xl font-bold text-base-content/70">
-						<div class="p-8 bg-base-200/30 rounded-full inline-block">
+					{$t('immich.no_items_found')}
-							<Search class="w-16 h-16 text-base-content/30" />
+				</h1>
-						</div>
-					{:else}
-						<div class="p-8 bg-base-200/30 rounded-full inline-block">
-							<Adventures class="w-16 h-16 text-base-content/30" />
-						</div>
-					{/if}
-				</div>
-
-				{#if searchQuery || filterOption !== 'all'}
-					<h1 class="text-3xl font-bold text-base-content/70 mb-4">
-						{$t('immich.no_items_found')}
-					</h1>
-					<p class="text-base-content/50 mb-6">
-						{$t('collection.try_different_search')}
-					</p>
-					<button class="btn btn-primary gap-2" on:click={clearAllFilters}>
-						<Clear class="w-4 h-4" />
-						{$t('worldtravel.clear_filters')}
-					</button>
-				{:else}
-					<NotFound error={undefined} />
-				{/if}
 			</div>
 		</div>
 	</div>