summaryrefslogtreecommitdiff
path: root/packages/client/src/components/media-image.vue
diff options
context:
space:
mode:
authorsyuilo <Syuilotan@yahoo.co.jp>2022-07-05 23:01:23 +0900
committersyuilo <Syuilotan@yahoo.co.jp>2022-07-05 23:01:23 +0900
commitbc73ad2e5650217f8910f28eab994cc713af5659 (patch)
tree4a5d3769703d6074a354ec98df8d4ebf7675e5a7 /packages/client/src/components/media-image.vue
parentchore(client): remove unused class (diff)
downloadmisskey-bc73ad2e5650217f8910f28eab994cc713af5659.tar.gz
misskey-bc73ad2e5650217f8910f28eab994cc713af5659.tar.bz2
misskey-bc73ad2e5650217f8910f28eab994cc713af5659.zip
chore(client): rendering performance tweak a bit
Diffstat (limited to 'packages/client/src/components/media-image.vue')
-rw-r--r--packages/client/src/components/media-image.vue16
1 files changed, 6 insertions, 10 deletions
diff --git a/packages/client/src/components/media-image.vue b/packages/client/src/components/media-image.vue
index 43639f6771..9d417bd99f 100644
--- a/packages/client/src/components/media-image.vue
+++ b/packages/client/src/components/media-image.vue
@@ -2,9 +2,9 @@
<div v-if="hide" class="qjewsnkg" @click="hide = false">
<ImgWithBlurhash class="bg" :hash="image.blurhash" :title="image.comment" :alt="image.comment"/>
<div class="text">
- <div>
- <b><i class="fas fa-exclamation-triangle"></i> {{ $ts.sensitive }}</b>
- <span>{{ $ts.clickToShow }}</span>
+ <div class="wrapper">
+ <b style="display: block;"><i class="fas fa-exclamation-triangle"></i> {{ $ts.sensitive }}</b>
+ <span style="display: block;">{{ $ts.clickToShow }}</span>
</div>
</div>
</div>
@@ -37,8 +37,8 @@ let hide = $ref(true);
const url = (props.raw || defaultStore.state.loadRawImages)
? props.image.url
: defaultStore.state.disableShowingAnimatedImages
- ? getStaticImageUrl(props.image.thumbnailUrl)
- : props.image.thumbnailUrl;
+ ? getStaticImageUrl(props.image.thumbnailUrl)
+ : props.image.thumbnailUrl;
// Plugin:register_note_view_interruptor を使って書き換えられる可能性があるためwatchする
watch(() => props.image, () => {
@@ -68,15 +68,11 @@ watch(() => props.image, () => {
justify-content: center;
align-items: center;
- > div {
+ > .wrapper {
display: table-cell;
text-align: center;
font-size: 0.8em;
color: #fff;
-
- > * {
- display: block;
- }
}
}
}