From de0577bc38eee598291c678e35956928bb22e63d Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Tue, 11 Apr 2023 14:57:06 +0900
Subject: [PATCH] enhance(frontend): tweak post form style

---
 CHANGELOG.md                                  |  1 +
 .../frontend/src/components/MkPostForm.vue    | 24 ++++++++++++-------
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f7a45df454..2151cbbb56 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -23,6 +23,7 @@
 - webhook, 連携アプリ一覧でコンテンツが重複して表示される問題を修正
 - iPhoneで絵文字ピッカーの表示が崩れる問題を修正
 - iPhoneでウィジェットドロワーの「ウィジェットを編集」が押しにくい問題を修正
+- 投稿フォームのデザインを調整
 
 ### Server
 - APIパラメータサイズ上限を32kbから1mbに緩和
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 10cb7d96cc..42a3748d9a 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -1124,16 +1124,16 @@ defineExpose({
 	display: grid;
 	grid-auto-flow: row;
 	grid-template-columns: repeat(auto-fill, minmax(42px, 1fr));
-	grid-auto-rows: 46px;
+	grid-auto-rows: 40px;
 }
 
 .footerRight {
-	flex: 0.3;
+	flex: 0;
 	margin-left: auto;
 	display: grid;
 	grid-auto-flow: row;
 	grid-template-columns: repeat(auto-fill, minmax(42px, 1fr));
-	grid-auto-rows: 46px;
+	grid-auto-rows: 40px;
 	direction: rtl;
 }
 
@@ -1198,13 +1198,21 @@ defineExpose({
 	}
 }
 
-@container (max-width: 330px) {
+@container (max-width: 350px) {
+	.footer {
+		font-size: 0.9em;
+	}
+
+	.footerLeft {
+		grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
+	}
+
+	.footerRight {
+		grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
+	}
+
 	.headerRight {
 		gap: 0;
 	}
-
-	.footer {
-		font-size: 14px;
-	}
 }
 </style>