Mirrored_Repos/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2026-08-21 13:11:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: make long comments collapsable

Browse Source
This commit is contained in:
Bnyro
2023-09-11 19:13:05 +02:00
parent 82d574fcaf
commit 53f5eab757
2 changed files with 10 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/CollapsableText.vue
View File

@@ -4,9 +4,9 @@
<span v-if="showFullText" v-html="fullText()" />
<!-- eslint-disable-next-line vue/no-v-html -->
<span v-else v-html="colapsedText()" />
<span v-if="text.length > 100 && !showFullText">...</span>
<span v-if="text.length > visibleLimit && !showFullText">...</span>
<button
v-if="text.length > 100"
v-if="text.length > visibleLimit"
class="block whitespace-normal font-semibold text-neutral-500 hover:underline"
@click="showFullText = !showFullText"
>
@@ -24,6 +24,10 @@ export default {
type: String,
default: null,
},
visibleLimit: {
type: Number,
default: 100,
},
},
data() {
return {
@@ -35,7 +39,7 @@ export default {
return purifyHTML(rewriteDescription(this.text));
},
colapsedText() {
return purifyHTML(rewriteDescription(this.text.slice(0, 100)));
return purifyHTML(rewriteDescription(this.text.slice(0, this.visibleLimit)));
},
},
};