inline description display

This commit is contained in:
Henry Jameson 2021-08-15 21:04:28 +03:00
parent 34d265467a
commit 830a03a0d1
3 changed files with 19 additions and 14 deletions

View file

@ -15,7 +15,8 @@ import {
faStop,
faSearchPlus,
faTrashAlt,
faPencilAlt
faPencilAlt,
faAlignRight
} from '@fortawesome/free-solid-svg-icons'
library.add(
@ -28,7 +29,8 @@ library.add(
faStop,
faSearchPlus,
faTrashAlt,
faPencilAlt
faPencilAlt,
faAlignRight
)
const Attachment = {
@ -52,7 +54,8 @@ const Attachment = {
img: fileTypeService.fileType(this.attachment.mimetype) === 'image' && document.createElement('img'),
modalOpen: false,
showHidden: false,
flashLoaded: false
flashLoaded: false,
showDescription: false
}
},
components: {
@ -157,6 +160,9 @@ const Attachment = {
setFlashLoaded (event) {
this.flashLoaded = event
},
toggleDescription () {
this.showDescription = !this.showDescription
},
toggleHidden (event) {
if (
(this.mergedConfig.useOneClickNsfw && !this.showHidden) &&

View file

@ -42,19 +42,10 @@
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
padding-top: 0;
background: var(--popover);
box-shadow: var(--popupShadow);
opacity: 0;
transition: 0.35s all;
transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
}
&:hover {
.description-container.-static {
opacity: 1;
transform: translateY(-3em);
}
}

View file

@ -86,6 +86,14 @@
>
<FAIcon icon="stop" />
</button>
<button
v-if="attachment.description && size !== 'small' && !edit"
class="button-unstyled attachment-button"
@click.prevent="toggleDescription"
:title="$t('status.show_attachment_description')"
>
<FAIcon icon="align-right" />
</button>
<button
v-if="!useModal"
class="button-unstyled attachment-button"