inline description display
This commit is contained in:
parent
34d265467a
commit
830a03a0d1
3 changed files with 19 additions and 14 deletions
|
@ -15,7 +15,8 @@ import {
|
||||||
faStop,
|
faStop,
|
||||||
faSearchPlus,
|
faSearchPlus,
|
||||||
faTrashAlt,
|
faTrashAlt,
|
||||||
faPencilAlt
|
faPencilAlt,
|
||||||
|
faAlignRight
|
||||||
} from '@fortawesome/free-solid-svg-icons'
|
} from '@fortawesome/free-solid-svg-icons'
|
||||||
|
|
||||||
library.add(
|
library.add(
|
||||||
|
@ -28,7 +29,8 @@ library.add(
|
||||||
faStop,
|
faStop,
|
||||||
faSearchPlus,
|
faSearchPlus,
|
||||||
faTrashAlt,
|
faTrashAlt,
|
||||||
faPencilAlt
|
faPencilAlt,
|
||||||
|
faAlignRight
|
||||||
)
|
)
|
||||||
|
|
||||||
const Attachment = {
|
const Attachment = {
|
||||||
|
@ -52,7 +54,8 @@ const Attachment = {
|
||||||
img: fileTypeService.fileType(this.attachment.mimetype) === 'image' && document.createElement('img'),
|
img: fileTypeService.fileType(this.attachment.mimetype) === 'image' && document.createElement('img'),
|
||||||
modalOpen: false,
|
modalOpen: false,
|
||||||
showHidden: false,
|
showHidden: false,
|
||||||
flashLoaded: false
|
flashLoaded: false,
|
||||||
|
showDescription: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
@ -157,6 +160,9 @@ const Attachment = {
|
||||||
setFlashLoaded (event) {
|
setFlashLoaded (event) {
|
||||||
this.flashLoaded = event
|
this.flashLoaded = event
|
||||||
},
|
},
|
||||||
|
toggleDescription () {
|
||||||
|
this.showDescription = !this.showDescription
|
||||||
|
},
|
||||||
toggleHidden (event) {
|
toggleHidden (event) {
|
||||||
if (
|
if (
|
||||||
(this.mergedConfig.useOneClickNsfw && !this.showHidden) &&
|
(this.mergedConfig.useOneClickNsfw && !this.showHidden) &&
|
||||||
|
|
|
@ -42,19 +42,10 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 0;
|
bottom: 0;
|
||||||
|
padding-top: 0;
|
||||||
background: var(--popover);
|
background: var(--popover);
|
||||||
box-shadow: var(--popupShadow);
|
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);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -86,6 +86,14 @@
|
||||||
>
|
>
|
||||||
<FAIcon icon="stop" />
|
<FAIcon icon="stop" />
|
||||||
</button>
|
</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
|
<button
|
||||||
v-if="!useModal"
|
v-if="!useModal"
|
||||||
class="button-unstyled attachment-button"
|
class="button-unstyled attachment-button"
|
||||||
|
|
Loading…
Reference in a new issue