mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-08-05 10:35:42 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix description line clamp show more

Browse source
This commit is contained in:
advplyr 2023-03-06 15:51:11 -06:00
parent 3963ffa0e2
commit c590087578
1 changed files with 8 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

12
pages/item/_id/index.vue
View file

@ -117,10 +117,10 @@
<div v-if="publishedYear" class="text-sm">{{ publishedYear }}</div>
</div>
<div class="w-full py-2">
<div v-if="description" class="w-full py-2">
<p ref="description" class="text-sm text-justify whitespace-pre-line font-light" :class="{ 'line-clamp-4': !showFullDescription }" style="hyphens: auto">{{ description }}</p>
<div class="text-white text-sm py-2" @click="showFullDescription = !showFullDescription">
<div v-if="descriptionClamped" class="text-white text-sm py-2" @click="showFullDescription = !showFullDescription">
{{ showFullDescription ? 'Read less' : 'Read more' }}
<span class="material-icons align-middle text-base -mt-px">{{ showFullDescription ? 'expand_less' : 'expand_more' }}</span>
</div>
@ -722,8 +722,12 @@ export default {
}
},
checkDescriptionClamped() {
if (!this.$refs.description || this.showFullDescription) return
this.descriptionClamped = this.$refs.description.scrollHeight > this.$refs.description.clientHeight
if (this.showFullDescription) return
if (!this.$refs.description) {
this.descriptionClamped = false
} else {
this.descriptionClamped = this.$refs.description.scrollHeight > this.$refs.description.clientHeight
}
},
windowResized() {
this.windowWidth = window.innerWidth