From fe39d7e46ac8923008a413e158a7bd75654d34fc Mon Sep 17 00:00:00 2001
From: Makhuta <matykubla@gmail.com>
Date: Sun, 8 Mar 2026 15:49:52 +0100
Subject: [PATCH] Made that video stats like author avatar, channel name, views
 and release date are always on the bottom

---
 .../src/lib/components/thumbnail/VideoThumbnail.svelte | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/materialious/src/lib/components/thumbnail/VideoThumbnail.svelte b/materialious/src/lib/components/thumbnail/VideoThumbnail.svelte
index f2674220..84f6f410 100644
--- a/materialious/src/lib/components/thumbnail/VideoThumbnail.svelte
+++ b/materialious/src/lib/components/thumbnail/VideoThumbnail.svelte
@@ -110,7 +110,7 @@
 	}
 </script>
 
-<div class:sideways-root={sideways} tabindex="0" role="button">
+<div class:sideways-root={sideways} style="height: 100%; display: flex; flex-direction: column;" tabindex="0" role="button">
 	<div id="thumbnail-container">
 		<!-- eslint-disable svelte/no-navigation-without-resolve -->
 		<a
@@ -168,8 +168,8 @@
 		</a>
 	</div>
 
-	<div class="thumbnail-details video-title">
-		<div class="video-title">
+	<div class="thumbnail-details video-title" style="flex: 1;">
+		<div class="video-title" style="height: 100%; display: flex; flex-direction: column;">
 			<a
 				tabindex="-1"
 				style="padding-left: 1px;"
@@ -178,10 +178,10 @@
 				href={watchUrl.toString()}
 				onclick={onVideoSelected}
 			>
-				<span class="bold">{letterCase(video.title.trimEnd())}</span>
+				<span class="bold" style="width: 100%;">{letterCase(video.title.trimEnd())}</span>
 			</a>
 
-			<nav>
+			<nav style="flex: 1; align-items: end;">
 				{#if !sideways && 'authorId' in video}
 					<AuthorAvatar author={video.author} authorId={video.authorId} />
 				{/if}