enhance(client): 1枚だけのメディアリストの画像のアスペクト比を画像に応じて縦長にする (#10452)

* ✌️

* fix

* ✌️

* 422px上限

* 334

* min-height: 130px

* 64px

* fix

* wip

* ✌️

* fix

* max-height: none

* MkImgWithBlurHashでratioを計算する

* wip

* fix

* fix?

* Revert "fix?"

This reverts commit e39d832dd1498ae58a2372b6dc527585ae165bac.

* Revert "fix"

This reverts commit 15be36ba55a411c5aac69037f693e1d922451f15.

* Revert "wip"

This reverts commit af7d86f69dd89e138d98f1285976b502f382e6c6.

* fix

* Revert "Revert "wip""

This reverts commit bb0036ae22ea2bca896ee9bb500bae624e81049b.

* Revert "Revert "fix""

This reverts commit c1d94a45c575cc843e061a0c55df1106bf033035.

* Revert "Revert "fix?""

This reverts commit 9cb4fbfd96db9adaf92cf3ec1f6f15b1b257d7b3.

* fix

* use clamp

* readable

* add 1:1, 3:4

* moveComment

* 3:4 → 2:3

* fix

* default

* fallback

* Revert "fallback"

This reverts commit 741717dd4903ed89b6536d8ea1ca061aacfa7dcb.

* Fix?(server): Content-Dispositionのパースでエラーが発生した場合にもダウンロードが完了するように
#10626
This commit is contained in:
tamaina 2023-04-15 21:35:19 +09:00 committed by GitHub
parent 38fdc73d01
commit 15761a0fa8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 138 additions and 35 deletions

View file

@ -1,6 +1,6 @@
<template>
<div v-if="hide" :class="$style.hidden" @click="hide = false">
<ImgWithBlurhash style="filter: brightness(0.5);" :hash="image.blurhash" :title="image.comment" :alt="image.comment" :force-blurhash="defaultStore.state.enableDataSaverMode" />
<ImgWithBlurhash style="filter: brightness(0.5);" :hash="image.blurhash" :title="image.comment" :alt="image.comment" :width="image.properties.width" :height="image.properties.height" :force-blurhash="defaultStore.state.enableDataSaverMode" />
<div :class="$style.hiddenText">
<div :class="$style.hiddenTextWrapper">
<b v-if="image.isSensitive" style="display: block;"><i class="ti ti-alert-triangle"></i> {{ i18n.ts.sensitive }}{{ defaultStore.state.enableDataSaverMode ? ` (${i18n.ts.image}${image.size ? ' ' + bytes(image.size) : ''})` : '' }}</b>
@ -15,7 +15,7 @@
:href="image.url"
:title="image.name"
>
<ImgWithBlurhash :hash="image.blurhash" :src="url" :alt="image.comment || image.name" :title="image.comment || image.name" :cover="false"/>
<ImgWithBlurhash :hash="image.blurhash" :src="url" :alt="image.comment || image.name" :title="image.comment || image.name" :width="image.properties.width" :height="image.properties.height" :cover="false"/>
</a>
<div :class="$style.indicators">
<div v-if="['image/gif', 'image/apng'].includes(image.type)" :class="$style.indicator">GIF</div>
@ -42,11 +42,12 @@ const props = defineProps<{
let hide = $ref(true);
let darkMode: boolean = $ref(defaultStore.state.darkMode);
const url = (props.raw || defaultStore.state.loadRawImages)
const url = $computed(() => (props.raw || defaultStore.state.loadRawImages)
? props.image.url
: defaultStore.state.disableShowingAnimatedImages
? getStaticImageUrl(props.image.url)
: props.image.thumbnailUrl;
: props.image.thumbnailUrl
);
// Plugin:register_note_view_interruptor 使watch
watch(() => props.image, () => {