feat: Detached pages and fix navigation actions

src/lib/components/Card/Card.svelte

@@ -11,7 +11,6 @@
 
 	export let tmdbId: number | undefined = undefined;
 	export let tvdbId: number | undefined = undefined;
-	export let openInModal = true;
 	export let jellyfinId: string = '';
 	export let type: TitleType = 'movie';
 	export let backdropUrl: string;
@@ -32,14 +31,8 @@
 <Container
 	active={focusable}
 	on:click={() => {
-		if (openInModal) {
-			if (tmdbId) {
-				//openTitleModal({ type, id: tmdbId, provider: 'tmdb' });
-			} else if (tvdbId) {
-				//openTitleModal({ type, id: tvdbId, provider: 'tvdb' });
-			}
-		} else if (tmdbId || tvdbId) {
-			navigate(`/${type}/${tmdbId || tvdbId}`);
+		if (tmdbId || tvdbId) {
+			navigate(`${type}/${tmdbId || tvdbId}`);
 		}
 	}}
 	class={classNames(

src/lib/components/Card/TmdbCard.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import Card from './Card.svelte';
+	import type { TmdbMovie2 } from '../../apis/tmdb/tmdb-api';
+	import type { ComponentProps } from 'svelte';
+	import { TMDB_POSTER_SMALL } from '../../constants';
+
+	export let item: TmdbMovie2;
+	const props: ComponentProps<Card> = {
+		tmdbId: item.id,
+		title: item.title,
+		subtitle: item.release_date,
+		backdropUrl: TMDB_POSTER_SMALL + item.poster_path,
+		type: 'movie',
+		orientation: 'portrait',
+		rating: item.vote_average
+	};
+</script>
+
+<Card {...props} />