From 96ba53fecc7b9d269f0d974051ab62836b0102bc Mon Sep 17 00:00:00 2001
From: Gauthier <mail@gauthierth.fr>
Date: Wed, 26 Jun 2024 16:33:46 +0200
Subject: [PATCH] fix: resize episode preview image (#842)

---
 src/components/TvDetails/Season/index.tsx | 14 ++++++++------
 tailwind.config.js                        | 21 +++++++++++++++++++++
 2 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/src/components/TvDetails/Season/index.tsx b/src/components/TvDetails/Season/index.tsx
index 75c56b017..09b2b6398 100644
--- a/src/components/TvDetails/Season/index.tsx
+++ b/src/components/TvDetails/Season/index.tsx
@@ -56,12 +56,14 @@ const Season = ({ seasonNumber, tvId }: SeasonProps) => {
                   {episode.overview && <p>{episode.overview}</p>}
                 </div>
                 {episode.stillPath && (
-                  <Image
-                    className="h-auto w-full rounded-lg xl:h-32 xl:w-auto"
-                    src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
-                    alt=""
-                    fill
-                  />
+                  <div className="relative aspect-video xl:h-32">
+                    <Image
+                      className="rounded-lg object-contain"
+                      src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
+                      alt=""
+                      fill
+                    />
+                  </div>
                 )}
               </div>
             );
diff --git a/tailwind.config.js b/tailwind.config.js
index b8b70fd54..f5b97ab56 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -63,6 +63,27 @@ module.exports = {
         },
       }),
     },
+    aspectRatio: {
+      auto: 'auto',
+      square: '1 / 1',
+      video: '16 / 9',
+      1: '1',
+      2: '2',
+      3: '3',
+      4: '4',
+      5: '5',
+      6: '6',
+      7: '7',
+      8: '8',
+      9: '9',
+      10: '10',
+      11: '11',
+      12: '12',
+      13: '13',
+      14: '14',
+      15: '15',
+      16: '16',
+    },
   },
   plugins: [
     require('@tailwindcss/forms'),