From 6a015341efc5f268ab86d11ba75b44a46cfbd33d Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 8 Jul 2023 18:55:02 +0900
Subject: fix(frontend):
 長い文章を投稿する際、プレビューが画面からはみ出る問題を修正
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix #11186
---
 CHANGELOG.md                                          | 1 +
 packages/frontend/src/components/MkPostForm.vue       | 2 ++
 packages/frontend/src/components/MkPostFormDialog.vue | 9 ++++++++-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2183598d9d..5629d36442 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -31,6 +31,7 @@
 - Fix: ZenUIでポップアップの表示位置がおかしい問題を修正
 - Fix: ページ遷移でスクロール位置が保持されない問題を修正
 - Fix: フォルダーのページネーションが機能しない #11180
+- Fix: 長い文章を投稿する際、プレビューが画面からはみ出る問題を修正
 
 ### Server
 - JSON.parse の回数を削減することで、ストリーミングのパフォーマンスを向上しました
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 5b37a117de..b269feb07f 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -1019,6 +1019,8 @@ defineExpose({
 
 .preview {
 	padding: 16px 20px 0 20px;
+	max-height: 150px;
+	overflow: auto;
 }
 
 .targetNote {
diff --git a/packages/frontend/src/components/MkPostFormDialog.vue b/packages/frontend/src/components/MkPostFormDialog.vue
index 98af92c6f8..989c138e81 100644
--- a/packages/frontend/src/components/MkPostFormDialog.vue
+++ b/packages/frontend/src/components/MkPostFormDialog.vue
@@ -1,6 +1,6 @@
 <template>
 <MkModal ref="modal" :preferType="'dialog'" @click="modal.close()" @closed="onModalClosed()">
-	<MkPostForm ref="form" style="margin: 0 auto auto auto;" v-bind="props" autofocus freezeAfterPosted @posted="onPosted" @cancel="modal.close()" @esc="modal.close()"/>
+	<MkPostForm ref="form" :class="$style.form" v-bind="props" autofocus freezeAfterPosted @posted="onPosted" @cancel="modal.close()" @esc="modal.close()"/>
 </MkModal>
 </template>
 
@@ -44,3 +44,10 @@ function onModalClosed() {
 	emit('closed');
 }
 </script>
+
+<style lang="scss" module>
+.form {
+	max-height: 100%;
+	margin: 0 auto auto auto;
+}
+</style>
-- 
cgit v1.3.1-freya