fix: resize episode preview image (#842)

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
+                  <div className="relative aspect-video xl:h-32">
-                    className="h-auto w-full rounded-lg xl:h-32 xl:w-auto"
+                    <Image
-                    src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
+                      className="rounded-lg object-contain"
-                    alt=""
+                      src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
-                    fill
+                      alt=""
-                  />
+                      fill
+                    />
+                  </div>
                 )}
               </div>
             );

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'),