extract common translation UI into SkNoteTranslation.vue

This commit is contained in:
Hazelnoot 2025-05-18 14:51:22 -04:00
parent cbb0f5a964
commit c412f5d69a
7 changed files with 67 additions and 92 deletions

View file

@ -104,14 +104,7 @@ SPDX-License-Identifier: AGPL-3.0-only
class="_selectable"
/>
<a v-if="appearNote.renote != null" :class="$style.rn">RN:</a>
<div v-if="translating || translation != null" :class="$style.translation">
<MkLoading v-if="translating" mini/>
<div v-else-if="translation && translation.text != null">
<b v-if="translation.sourceLang">{{ i18n.tsx.translatedFrom({ x: translation.sourceLang }) }}: </b>
<Mfm :text="translation.text" :isBlock="true" :author="appearNote.user" :nyaize="'respect'" :emojiUrls="appearNote.emojis" class="_selectable"/>
</div>
<div v-else>{{ i18n.ts.translationFailed }}</div>
</div>
<SkNoteTranslation :note="note" :translation="translation" :translating="translating"></SkNoteTranslation>
<MkButton v-if="!allowAnim && animated" :class="$style.playMFMButton" :small="true" @click="animatedMFM()" @click.stop><i class="ph-play ph-bold ph-lg "></i> {{ i18n.ts._animatedMFM.play }}</MkButton>
<MkButton v-else-if="!prefer.s.animatedMfm && allowAnim && animated" :class="$style.playMFMButton" :small="true" @click="animatedMFM()" @click.stop><i class="ph-stop ph-bold ph-lg "></i> {{ i18n.ts._animatedMFM.stop }}</MkButton>
<div v-if="appearNote.files && appearNote.files.length > 0">
@ -291,6 +284,7 @@ import { prefer } from '@/preferences.js';
import { getPluginHandlers } from '@/plugin.js';
import { DI } from '@/di.js';
import SkMutedNote from '@/components/SkMutedNote.vue';
import SkNoteTranslation from '@/components/SkNoteTranslation.vue';
const props = withDefaults(defineProps<{
note: Misskey.entities.Note;
@ -1055,13 +1049,6 @@ function animatedMFM() {
color: var(--MI_THEME-renote);
}
.translation {
border: solid 0.5px var(--MI_THEME-divider);
border-radius: var(--MI-radius);
padding: 12px;
margin-top: 8px;
}
.poll {
font-size: 80%;
}