From ea0e802015041cc7b0cdbab24711e8d67216b176 Mon Sep 17 00:00:00 2001
From: thecashewtrader <thecashewtrader@protonmail.com>
Date: Mon, 28 Nov 2022 20:59:09 +0530
Subject: [PATCH] Fix long chapter titles squishing video

---
 src/components/ChaptersBar.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ChaptersBar.vue b/src/components/ChaptersBar.vue
index 63e25186..64d5b013 100644
--- a/src/components/ChaptersBar.vue
+++ b/src/components/ChaptersBar.vue
@@ -1,6 +1,6 @@
 <template>
     <!-- desktop view -->
-    <div v-if="!mobileLayout" class="flex-col overflow-y-scroll max-h-75vh min-h-64 lt-lg:hidden">
+    <div v-if="!mobileLayout" class="flex-col overflow-y-scroll max-w-35vw max-h-75vh min-h-64 lt-lg:hidden">
         <h2 class="mb-2 bg-gray-500/50 p-2" aria-label="chapters" title="chapters">
             {{ $t("video.chapters") }} ({{ chapters.length }})
         </h2>
@@ -13,7 +13,7 @@
         >
             <div class="flex">
                 <span class="mt-5 mr-2 text-current" v-text="index + 1" />
-                <img :src="chapter.image" :alt="chapter.title" />
+                <img class="shrink-0" :src="chapter.image" :alt="chapter.title" />
                 <div class="flex flex-col m-2">
                     <span class="text-sm" :title="chapter.title" v-text="chapter.title" />
                     <span class="text-sm font-bold text-blue-500" v-text="timeFormat(chapter.start)" />