commit: a58a6d3c357592f34007c67bbf7fdf740864212a
parent b4cbbefbd2dac62a0e334da43d1e076d4bef00a7
Author: tusooa <tusooa@kazv.moe>
Date: Sat, 14 Jan 2023 23:20:28 -0500
Fix notification attachment icon overflow
Diffstat:
6 files changed, 15 insertions(+), 4 deletions(-)
diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js
@@ -36,6 +36,7 @@ library.add(
const Attachment = {
props: [
'attachment',
+ 'compact',
'description',
'hideDescription',
'nsfw',
@@ -71,7 +72,8 @@ const Attachment = {
{
'-loading': this.loading,
'-nsfw-placeholder': this.hidden,
- '-editable': this.edit !== undefined
+ '-editable': this.edit !== undefined,
+ '-compact': this.compact
},
'-type-' + this.type,
this.size && '-size-' + this.size,
diff --git a/src/components/attachment/attachment.scss b/src/components/attachment/attachment.scss
@@ -102,7 +102,6 @@
padding-top: 0.5em;
}
-
.play-icon {
position: absolute;
font-size: 64px;
@@ -265,4 +264,10 @@
object-fit: cover;
}
}
+
+ &.-compact {
+ .placeholder-container {
+ padding-bottom: 0.5em;
+ }
+ }
}
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
@@ -162,10 +162,11 @@
target="_blank"
>
<FAIcon
- size="5x"
+ :size="compact ? '2x' : '5x'"
:icon="placeholderIconClass"
+ :title="localDescription"
/>
- <p>
+ <p v-if="!compact">
{{ localDescription }}
</p>
</a>
diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
@@ -4,6 +4,7 @@ import { sumBy, set } from 'lodash'
const Gallery = {
props: [
'attachments',
+ 'compact',
'limitRows',
'descriptions',
'limit',
diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
@@ -20,6 +20,7 @@
v-for="(attachment, attachmentIndex) in row.items"
:key="attachment.id"
class="gallery-item"
+ :compact="compact"
:nsfw="nsfw"
:attachment="attachment"
:size="size"
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
@@ -33,6 +33,7 @@
<gallery
v-if="status.attachments.length !== 0"
class="attachments media-body"
+ :compact="compact"
:nsfw="nsfwClickthrough"
:attachments="status.attachments"
:limit="compact ? 1 : 0"