fix(frontend): 長い文章を投稿する際、プレビューが画面からはみ出る問題を修正

Fix #11186

CHANGELOG.md

@@ -31,6 +31,7 @@
 - Fix: ZenUIでポップアップの表示位置がおかしい問題を修正
 - Fix: ページ遷移でスクロール位置が保持されない問題を修正
 - Fix: フォルダーのページネーションが機能しない #11180
+- Fix: 長い文章を投稿する際、プレビューが画面からはみ出る問題を修正
 
 ### Server
 - JSON.parse の回数を削減することで、ストリーミングのパフォーマンスを向上しました

packages/frontend/src/components/MkPostForm.vue

@@ -1019,6 +1019,8 @@ defineExpose({
 
 .preview {
 	padding: 16px 20px 0 20px;
+	max-height: 150px;
+	overflow: auto;
 }
 
 .targetNote {

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>