From 0c5d05d3199c3aea64769a1f5f2c1535d8b3c9c6 Mon Sep 17 00:00:00 2001
From: advplyr <advplyr@protonmail.com>
Date: Sat, 7 Jun 2025 17:10:23 -0500
Subject: [PATCH] Fix chapter table on audiobook tools page uneven column
 widths

---
 client/pages/audiobook/_id/manage.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/client/pages/audiobook/_id/manage.vue b/client/pages/audiobook/_id/manage.vue
index 37734934..40672af2 100644
--- a/client/pages/audiobook/_id/manage.vue
+++ b/client/pages/audiobook/_id/manage.vue
@@ -28,14 +28,14 @@
     <div class="flex justify-center flex-wrap lg:flex-nowrap gap-4">
       <div class="w-full max-w-2xl border border-white/10 bg-bg">
         <div class="flex py-2 px-4">
-          <div class="w-1/3 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelMetaTag }}</div>
-          <div class="w-2/3 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelValue }}</div>
+          <div class="w-28 min-w-28 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelMetaTag }}</div>
+          <div class="grow text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelValue }}</div>
         </div>
         <div class="w-full max-h-72 overflow-auto">
           <template v-for="(value, key, index) in metadataObject">
             <div :key="key" class="flex py-1 px-4 text-sm" :class="index % 2 === 0 ? 'bg-primary/25' : ''">
-              <div class="w-1/3 font-semibold">{{ key }}</div>
-              <div class="w-2/3">
+              <div class="w-28 min-w-28 font-semibold">{{ key }}</div>
+              <div class="grow">
                 {{ value }}
               </div>
             </div>
@@ -45,18 +45,18 @@
       <div class="w-full max-w-2xl border border-white/10 bg-bg">
         <div class="flex py-2 px-4 bg-primary/25">
           <div class="grow text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelChapterTitle }}</div>
-          <div class="w-24 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelStart }}</div>
-          <div class="w-24 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelEnd }}</div>
+          <div class="w-16 min-w-16 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelStart }}</div>
+          <div class="w-16 min-w-16 text-xs font-semibold uppercase text-gray-200">{{ $strings.LabelEnd }}</div>
         </div>
         <div class="w-full max-h-72 overflow-auto">
           <p v-if="!metadataChapters.length" class="py-5 text-center text-gray-200">{{ $strings.MessageNoChapters }}</p>
           <template v-for="(chapter, index) in metadataChapters">
             <div :key="index" class="flex py-1 px-4 text-sm" :class="index % 2 === 1 ? 'bg-primary/25' : ''">
               <div class="grow font-semibold">{{ chapter.title }}</div>
-              <div class="w-24">
+              <div class="w-16 min-w-16">
                 {{ $secondsToTimestamp(chapter.start) }}
               </div>
-              <div class="w-24">
+              <div class="w-16 min-w-16">
                 {{ $secondsToTimestamp(chapter.end) }}
               </div>
             </div>