use summary image sizes

website/src/lib/components/self/SEO.svelte

@@ -10,7 +10,8 @@
 		keywords = '',
 		author = 'Outpoot',
 		canonicalUrl = '',
-		noindex = false
+		noindex = false,
+		twitterCard = 'summary_large_image'
 	}: {
 		title?: string;
 		description?: string;
@@ -21,6 +22,7 @@
 		author?: string;
 		canonicalUrl?: string;
 		noindex?: boolean;
+		twitterCard?: 'summary' | 'summary_large_image';
 	} = $props();
 
 	let currentUrl = $derived($page?.url?.href || '');
@@ -64,7 +66,7 @@
 	<meta property="og:locale" content="en_US" />
 
 	<!-- Twitter Card Meta Tags -->
-	<meta name="twitter:card" content="summary_large_image" />
+	<meta name="twitter:card" content={twitterCard} />
 	<meta name="twitter:title" content={title} />
 	<meta name="twitter:description" content={description} />
 	<meta name="twitter:image" content={fullImageUrl} />

website/src/routes/coin/[coinSymbol]/+page.svelte

@@ -370,6 +370,7 @@
 		: `${coinSymbol} virtual cryptocurrency, crypto trading simulation, virtual coin trading`}
 	image={coin?.icon ? getPublicUrl(coin.icon) : '/apple-touch-icon.png'}
 	imageAlt={coin ? `${coin.name} (${coin.symbol}) logo` : `${coinSymbol} cryptocurrency logo`}
+	twitterCard="summary"
 />
 
 <SignInConfirmDialog bind:open={shouldSignIn} />

website/src/routes/user/[username]/+page.svelte

@@ -357,6 +357,7 @@
 		? `${profileData.profile.name}'s profile picture`
 		: `@${username}'s profile`}
 	keywords="crypto trader profile game, virtual trading portfolio, cryptocurrency simulation game, user portfolio simulator"
+	twitterCard="summary"
 />
 
 <div class="container mx-auto max-w-6xl p-6">