diff options
| author | Louis Chemineau <louis@chmn.me> | 2023-03-17 15:04:08 +0100 |
|---|---|---|
| committer | Louis Chemineau <louis@chmn.me> | 2023-03-17 15:04:08 +0100 |
| commit | 901236e44e2a8592adf3a4f8957de7ba236c304d (patch) | |
| tree | 4325512d34da53173cf3e9e0d2bba3edb668b368 | |
| parent | f95a8c57c410e3bca961c0687d7ac861c6fa0aee (diff) | |
Improve attachments rendering
Signed-off-by: Louis Chemineau <louis@chmn.me>
| -rw-r--r-- | src/components/Composer/Composer.vue | 5 | ||||
| -rw-r--r-- | src/components/PostAttachment.vue | 9 | ||||
| -rw-r--r-- | src/components/TimelinePost.vue | 4 |
3 files changed, 13 insertions, 5 deletions
diff --git a/src/components/Composer/Composer.vue b/src/components/Composer/Composer.vue index 057aec55..ec30c227 100644 --- a/src/components/Composer/Composer.vue +++ b/src/components/Composer/Composer.vue @@ -265,9 +265,14 @@ export default { computed: { /** @return {boolean} */ canPost() { + if (Object.values(this.attachments).some(({ data }) => data === null)) { + return false + } + if (Object.keys(this.attachments).length > 0) { return true } + return this.statusContent.length !== 0 && this.statusContent !== '<br>' }, }, diff --git a/src/components/PostAttachment.vue b/src/components/PostAttachment.vue index 54f0c317..35a429c4 100644 --- a/src/components/PostAttachment.vue +++ b/src/components/PostAttachment.vue @@ -7,7 +7,7 @@ @click="showModal(index)"> <MediaAttachment :attachment="item" /> </div> - <div v-if="attachments.length > 4" class="attachment more-attachments"> + <div v-if="attachments.length > 4" class="attachment more-attachments" @click="showModal(3)"> + </div> </div> @@ -83,13 +83,14 @@ export default { width: 100%; border-radius: var(--border-radius-large); overflow: hidden; - height: 40vh; + background: var(--color-background-dark); .attachment { flex-grow: 1; flex-shrink: 1; flex-basis: calc(50% - 2px); cursor: pointer; + height: 20vh; } .more-attachments { @@ -98,6 +99,10 @@ export default { justify-content: center; font-size: 42px; line-height: 0px; + + &:hover { + background: var(--color-background-darker); + } } } } diff --git a/src/components/TimelinePost.vue b/src/components/TimelinePost.vue index 74df90ec..70e3b50b 100644 --- a/src/components/TimelinePost.vue +++ b/src/components/TimelinePost.vue @@ -26,9 +26,7 @@ </div> <!-- eslint-disable-next-line vue/no-v-html --> <div v-else class="post-message" v-html="item.account.note" /> - <div v-if="hasAttachments" class="post-attachments"> - <PostAttachment :attachments="item.media_attachments || []" /> - </div> + <PostAttachment v-if="hasAttachments" :attachments="item.media_attachments || []" /> <div v-if="$route && $route.params.type !== 'notifications' && !serverData.public" class="post-actions"> <NcButton v-tooltip="t('social', 'Reply')" type="tertiary-no-background" |