1
0
mirror of https://github.com/misskey-dev/misskey.git synced 2026-05-03 05:36:16 +02:00

enhance(frontend): blurhash無効化オプションを追加

This commit is contained in:
syuilo
2025-05-11 14:17:08 +09:00
parent 039aacb31f
commit 4d08c0a82b
10 changed files with 45 additions and 10 deletions

View File

@@ -11,15 +11,24 @@ SPDX-License-Identifier: AGPL-3.0-only
[$style.large]: large,
}]"
>
<ImgWithBlurhash
v-if="isThumbnailAvailable"
<MkImgWithBlurhash
v-if="isThumbnailAvailable && prefer.s.enableHighQualityImagePlaceholders"
:hash="file.blurhash"
:src="file.thumbnailUrl"
:alt="file.name"
:title="file.name"
:class="$style.thumbnail"
:cover="fit !== 'contain'"
:forceBlurhash="forceBlurhash"
/>
<img
v-else-if="isThumbnailAvailable"
:src="file.thumbnailUrl"
:alt="file.name"
:title="file.name"
:class="$style.thumbnail"
:style="{ objectFit: fit }"
/>
<i v-else-if="is === 'image'" class="ti ti-photo" :class="$style.icon"></i>
<i v-else-if="is === 'video'" class="ti ti-video" :class="$style.icon"></i>
<i v-else-if="is === 'audio' || is === 'midi'" class="ti ti-file-music" :class="$style.icon"></i>
@@ -36,7 +45,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { computed } from 'vue';
import * as Misskey from 'misskey-js';
import ImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
import MkImgWithBlurhash from '@/components/MkImgWithBlurhash.vue';
import { prefer } from '@/preferences.js';
const props = defineProps<{
file: Misskey.entities.DriveFile;
@@ -115,4 +125,8 @@ const isThumbnailAvailable = computed(() => {
.large .icon {
font-size: 40px;
}
.thumbnail {
width: 100%;
}
</style>