scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-10-31 16:49:40 +08:00
Code Issues Projects Releases Packages Wiki Activity

Change experiment description to be one line [SCI-9990]

Browse source
This commit is contained in:
Ivan Kljun 2024-01-16 11:46:00 +01:00
parent 5f6b74a247
commit 08b7d0a081
1 changed files with 9 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
app/javascript/vue/experiments/renderers/description.vue
View file

@ -1,13 +1,11 @@
<template>
<div class="group leading-5 relative line-clamp-2 group-hover:marker"
:class="{'cursor-pointer': showMoreButton}"
>
<span v-html="params.data.sa_description"></span>
<div v-if="showMoreButton" @click.stop="showMore"
class="opacity-0 group-hover:opacity-100 text-xs text-sn-blue absolute bottom-0 right-0
p-0.5 pl-8 bg-gradient-to-r from-transparent from-0% to-sn-super-light-grey to-30%">
{{ i18n.t('experiments.card.more') }}
</div>
<div class="group relative flex items-center group-hover:marker">
<span v-if="shouldTruncateText"
class="line-clamp-1 cursor-pointer"
@click.stop="showDescriptionModal"
v-html="params.data.sa_description">
</span>
<span v-else v-html="params.data.sa_description"></span>
</div>
</template>
@ -18,15 +16,14 @@ export default {
params: {
required: true,
},
},
computed: {
showMoreButton() {
shouldTruncateText() {
return this.params.data.description.length > 80;
},
},
methods: {
showMore() {
showDescriptionModal() {
this.params.dtComponent.$emit('showDescription', null, [this.params.data]);
},
},