github-mirrors/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2025-04-19 04:05:55 -04:00
Code Issues Projects Releases Packages Wiki Activity

Fix item page text overlap on details #4187

Browse source
This commit is contained in:
advplyr 2025-04-07 17:19:48 -05:00
parent 31f48edcc3
commit c81071a7b3
1 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
client/components/content/LibraryItemDetails.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<div v-if="narrators?.length" class="flex py-0.5 mt-4"> <div v-if="narrators?.length" class="flex py-0.5 mt-4">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelNarrators }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelNarrators }}</span>
</div> </div>
<div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis"> <div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis">
@ -12,7 +12,7 @@
</div> </div>
</div> </div>
<div v-if="publishedYear" role="paragraph" class="flex py-0.5"> <div v-if="publishedYear" role="paragraph" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelPublishYear }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelPublishYear }}</span>
</div> </div>
<div> <div>
@ -20,7 +20,7 @@
</div> </div>
</div> </div>
<div v-if="publisher" role="paragraph" class="flex py-0.5"> <div v-if="publisher" role="paragraph" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelPublisher }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelPublisher }}</span>
</div> </div>
<div> <div>
@ -28,7 +28,7 @@
</div> </div>
</div> </div>
<div v-if="podcastType" role="paragraph" class="flex py-0.5"> <div v-if="podcastType" role="paragraph" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelPodcastType }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelPodcastType }}</span>
</div> </div>
<div class="capitalize"> <div class="capitalize">
@ -36,7 +36,7 @@
</div> </div>
</div> </div>
<div class="flex py-0.5" v-if="genres.length"> <div class="flex py-0.5" v-if="genres.length">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelGenres }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelGenres }}</span>
</div> </div>
<div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis"> <div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis">
@ -47,7 +47,7 @@
</div> </div>
</div> </div>
<div class="flex py-0.5" v-if="tags.length"> <div class="flex py-0.5" v-if="tags.length">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelTags }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelTags }}</span>
</div> </div>
<div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis"> <div class="max-w-[calc(100vw-10rem)] overflow-hidden text-ellipsis">
@ -58,7 +58,7 @@
</div> </div>
</div> </div>
<div v-if="language" class="flex py-0.5"> <div v-if="language" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelLanguage }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelLanguage }}</span>
</div> </div>
<div> <div>
@ -66,7 +66,7 @@
</div> </div>
</div> </div>
<div v-if="tracks.length || (isPodcast && totalPodcastDuration)" role="paragraph" class="flex py-0.5"> <div v-if="tracks.length || (isPodcast && totalPodcastDuration)" role="paragraph" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelDuration }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelDuration }}</span>
</div> </div>
<div> <div>
@ -74,7 +74,7 @@
</div> </div>
</div> </div>
<div role="paragraph" class="flex py-0.5"> <div role="paragraph" class="flex py-0.5">
<div class="w-24 min-w-24 sm:w-32 sm:min-w-32"> <div class="w-34 min-w-34 sm:w-34 sm:min-w-34 break-words">
<span class="text-white/60 uppercase text-sm">{{ $strings.LabelSize }}</span> <span class="text-white/60 uppercase text-sm">{{ $strings.LabelSize }}</span>
</div> </div>
<div> <div>