From 9390c23a871568e8697ab87ee2c4a0bd89fb5177 Mon Sep 17 00:00:00 2001
From: Samira <13108552+koninginsamira@users.noreply.github.com>
Date: Thu, 23 Apr 2026 17:52:23 +0200
Subject: [PATCH] Changed layout of episode cards for better readability

---
 andromeda.css | 24 +++++++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/andromeda.css b/andromeda.css
index 1cf68b6..e7fceb0 100644
--- a/andromeda.css
+++ b/andromeda.css
@@ -242,15 +242,26 @@
 
 /* Resize episode view */
 .listItem-content {
+    position: relative;
     height: 7.73em; /* Set height of container */
+    --poster-margin: .75em;
+    --poster-width: 19.5vw;
 }
-/* Fit content to container */
+
+/* Resize episode poster */
 .listItem-content .listItemImage.listItemImage-large {
+    margin-right: var(--poster-margin);
+    width: var(--poster-width);
     height: 100%;
+    background-position: 50%;
 }
+
+/* Resize episode body */
 .listItem-content .listItemBody {
-    padding: 0 .75em;
+    position: absolute;
+    left: calc(var(--poster-width) + var(--poster-margin));
     height: 100%;
+    padding: 0 .75em;
     display: flex;
     flex-flow: column;
 }
@@ -266,7 +277,7 @@
     padding-top: .5em;
 }
 
-/* Add fade-out on overflow */
+/* Add fade-out on episode body overflow */
 .listItem-content .listItemBody .listItem-overview p {
     margin: 0;
     height: 100%;
@@ -278,6 +289,13 @@
     ) 100% 50% / 100% 100% repeat-x;
 }
 
+/* Position episode buttons */
+.listItem-content .listViewUserDataButtons {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+}
+
 /* Floating indicator */
 .innerCardFooter {
     margin: .5em;