From c88478f31bff857fa01338be52882263b790ca3e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=BE=E3=81=A3=E3=81=A1=E3=82=83=E3=81=A6=E3=81=83?=
 =?UTF-8?q?=E3=83=BC=E3=80=82?=
 <56515516+mattyatea@users.noreply.github.com>
Date: Mon, 13 Jan 2025 08:19:32 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=E4=B8=80=E5=AE=9A=E3=81=AE?=
 =?UTF-8?q?=E6=9D=A1=E4=BB=B6=E3=81=A7=E3=83=8E=E3=83=BC=E3=83=88=E9=80=81?=
 =?UTF-8?q?=E4=BF=A1=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=8C=E6=84=8F=E5=9B=B3?=
 =?UTF-8?q?=E3=81=97=E3=81=AA=E3=81=84=E8=A6=8B=E3=81=9F=E7=9B=AE=E3=81=AB?=
 =?UTF-8?q?=E3=81=AA=E3=82=8B=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE=E6=AD=A3?=
 =?UTF-8?q?=20(MisskeyIO#884)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: あわわわとーにゅ <17376330+u1-liquid@users.noreply.github.com>
---
 .../frontend/src/components/MkPostForm.vue    | 32 +++++++++++++++----
 1 file changed, 25 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 94da01eb77..8d959b36ff 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -48,8 +48,14 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<div :class="$style.submitInner">
 					<template v-if="posted"></template>
 					<template v-else-if="posting"><MkEllipsis/></template>
-					<template v-else>{{ submitText }}</template>
-					<i style="margin-left: 6px;" :class="posted ? 'ti ti-check' : reply ? 'ti ti-arrow-back-up' : renote ? 'ti ti-quote' : 'ti ti-send'"></i>
+					<template v-else>
+						<span :class="$style.submitButtonText">
+							{{ submitText }}
+						</span>
+					</template>
+					<span>
+						<i :class="posted ? 'ti ti-check' : reply ? 'ti ti-arrow-back-up' : renote ? 'ti ti-quote' : 'ti ti-send'"></i>
+					</span>
 				</div>
 			</button>
 		</div>
@@ -109,6 +115,7 @@ import * as mfm from 'mfm-js';
 import * as Misskey from 'misskey-js';
 import insertTextAtCursor from 'insert-text-at-cursor';
 import { toASCII } from 'punycode.js';
+import type { NoteDraftItem } from '@/types/note-draft-item.js';
 import MkNoteSimple from '@/components/MkNoteSimple.vue';
 import MkNotePreview from '@/components/MkNotePreview.vue';
 import XPostFormAttaches from '@/components/MkPostFormAttaches.vue';
@@ -134,7 +141,6 @@ import { miLocalStorage } from '@/local-storage.js';
 import { claimAchievement } from '@/scripts/achievements.js';
 import { emojiPicker } from '@/scripts/emoji-picker.js';
 import { mfmFunctionPicker } from '@/scripts/mfm-function-picker.js';
-import type { NoteDraftItem } from '@/types/note-draft-item.js';
 
 const $i = signinRequired();
 
@@ -770,7 +776,7 @@ async function openDrafts() {
 	}
 }
 
-function loadDraft(exactMatch: boolean = false) {
+function loadDraft(exactMatch = false) {
 	const drafts = JSON.parse(miLocalStorage.getItem('drafts') ?? '{}') as Record<string, NoteDraftItem>;
 	const scope = exactMatch ? draftKey.value : draftKey.value.replace(`note:${draftId.value}`, 'note:');
 	const draft = Object.entries(drafts).filter(([k]) => k.startsWith(scope))
@@ -968,9 +974,9 @@ async function post(ev?: MouseEvent) {
 			type: 'error',
 			text: err.message + '\n' + (err as any).id,
 		});
-		emit("postError");
+		emit('postError');
 	});
-	emit("posting");
+	emit('posting');
 }
 
 function cancel() {
@@ -987,7 +993,7 @@ async function insertEmoji(ev: MouseEvent) {
 	os.openEmojiPicker(
 		(ev.currentTarget ?? ev.target) as HTMLElement,
 		{ asReactionPicker: false },
-		textareaEl.value
+		textareaEl.value,
 	);
 }
 
@@ -1194,6 +1200,10 @@ defineExpose({
 	box-sizing: border-box;
 	color: var(--fgOnAccent);
 	background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
+	display: flex;
+	gap: 6px;
+	align-items: center;
+	justify-content: center;
 }
 
 .headerRightItem {
@@ -1448,5 +1458,13 @@ defineExpose({
 		gap: 0;
 	}
 
+	.submitInner {
+		min-width: 20px;
+	}
+
+	.submitButtonText {
+		display: none;
+	}
+
 }
 </style>