pleroma-fe

commit: 830a03a0d13738ed1677d364fdf03821fbc507ab
parent 34d265467a77d4e680e3c56c254df7dfb904fc18
Author: Henry Jameson <me@hjkos.com>
Date:   Sun, 15 Aug 2021 21:04:28 +0300

inline description display

Diffstat:
M
src/components/attachment/attachment.js
12
+++++++++---
M
src/components/attachment/attachment.scss
13
++-----------
M
src/components/attachment/attachment.vue
8
++++++++

3 files changed, 19 insertions(+), 14 deletions(-)
diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js
@@ -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) &&
diff --git a/src/components/attachment/attachment.scss b/src/components/attachment/attachment.scss
@@ -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);
     }
   }
 
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
@@ -87,6 +87,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"
           @click.prevent="openModalForce"