From 485de41483825b78eff31dde7056eca917b51410 Mon Sep 17 00:00:00 2001
From: NoriDev <m1nthing2322@gmail.com>
Date: Tue, 26 Dec 2023 18:27:29 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=EB=A7=81=ED=81=AC=EB=A5=BC=20?=
 =?UTF-8?q?=EC=9D=B8=EC=9A=A9=ED=95=B4=EC=84=9C=20=EB=85=B8=ED=8A=B8?=
 =?UTF-8?q?=EB=A5=BC=20=EC=9E=91=EC=84=B1=ED=95=A0=20=EB=95=8C=20=EB=85=B8?=
 =?UTF-8?q?=ED=8A=B8=20=EC=9E=91=EC=84=B1=20=ED=8F=BC=EC=9D=98=20=EB=94=94?=
 =?UTF-8?q?=EC=9E=90=EC=9D=B8=EC=9D=B4=20=EC=98=AC=EB=B0=94=EB=A5=B4?=
 =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EA=B2=8C=20=ED=91=9C=EC=8B=9C=EB=90=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG_CHERRYPICK.md                       |  1 +
 .../frontend/src/components/MkPostForm.vue    | 29 +++++++++++++++----
 .../src/components/MkPostFormSimple.vue       | 29 +++++++++++++++----
 3 files changed, 47 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG_CHERRYPICK.md b/CHANGELOG_CHERRYPICK.md
index 4e1e6fe126..427d9832f6 100644
--- a/CHANGELOG_CHERRYPICK.md
+++ b/CHANGELOG_CHERRYPICK.md
@@ -79,6 +79,7 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2023xx](CHANGE
 - Fix: 서버 이름이 매우 긴 경우, 후원(MkDonation) 대화 상자의 디자인이 잘못 표시될 수 있음
 - Fix: 화면이 작은 기기에서 Play의 액션 버튼이 잘려서 보일 수 있음
 - Fix: 노트 상세 페이지에서 노트 작성 폼을 클릭했을 때, 노트 작성자가 자동으로 멘션에 포함되지 않을 수 있음
+- Fix: 링크를 인용해서 노트를 작성할 때 노트 작성 폼의 디자인이 올바르지 않게 표시됨 
 
 ### Server
 - Enhance: (dev) 개발 모드에서 locale 및 유형 정의가 자동으로 재생성됨 (misskey-dev/misskey#12481)
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 2b4c8a569e..30ed2d5bca 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -54,7 +54,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</header>
 	<MkNoteSimple v-if="reply" :class="$style.targetNote" :note="reply" :enableNoteClick="false"/>
 	<MkNoteSimple v-if="renote" :class="$style.targetNote" :note="renote" :enableNoteClick="false"/>
-	<div v-if="quoteId" :class="$style.withQuote"><i class="ti ti-quote"></i> {{ i18n.ts.quoteAttached }}<button @click="quoteId = null"><i class="ti ti-x"></i></button></div>
+	<div v-if="quoteId" :class="$style.withQuote"><i class="ti ti-quote"></i> {{ i18n.ts.quoteAttached }}<button class="_button" @click="quoteId = null"><i class="ti ti-x"></i></button></div>
 	<MkEventEditor v-if="event" v-model="event" @destroyed="event = null"/>
 	<div v-if="visibility === 'specified'" :class="$style.toSpecified">
 		<span style="margin-right: 8px;">{{ i18n.ts.recipient }}</span>
@@ -1211,8 +1211,21 @@ defineExpose({
 }
 
 .withQuote {
-	margin: 0 0 8px 0;
+	display: flex;
+	align-items: center;
+	gap: .2em;
+	margin-inline: 30px;
+	margin-bottom: 12px;
 	color: var(--accent);
+
+	i {
+		display: flex;
+	}
+
+	button {
+		display: flex;
+		padding: 0;
+	}
 }
 
 .toSpecified {
@@ -1384,12 +1397,16 @@ defineExpose({
 		padding: 16px 14px 0 14px;
 	}
 
-	.cw,
-	.hashtags,
-	.text {
-		// padding: 0 16px;
+	.withQuote {
+		margin-inline: 22px;
 	}
 
+	// .cw,
+	// .hashtags,
+	// .text {
+		// padding: 0 16px;
+	// }
+
 	.cw {
 		padding: 0 22px 8px;
 	}
diff --git a/packages/frontend/src/components/MkPostFormSimple.vue b/packages/frontend/src/components/MkPostFormSimple.vue
index 7d9aa3c6a1..153a950e76 100644
--- a/packages/frontend/src/components/MkPostFormSimple.vue
+++ b/packages/frontend/src/components/MkPostFormSimple.vue
@@ -57,7 +57,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</div>
 		</header>
 	</Transition>
-	<div v-if="quoteId && showForm" :class="$style.withQuote"><i class="ti ti-quote"></i> {{ i18n.ts.quoteAttached }}<button @click="quoteId = null"><i class="ti ti-x"></i></button></div>
+	<div v-if="quoteId && showForm" :class="$style.withQuote"><i class="ti ti-quote"></i> {{ i18n.ts.quoteAttached }}<button class="_button" @click="quoteId = null"><i class="ti ti-x"></i></button></div>
 	<MkEventEditor v-if="event && showForm" v-model="event" @destroyed="event = null"/>
 	<div v-if="visibility === 'specified' && showForm" :class="$style.toSpecified">
 		<span style="margin-right: 8px;">{{ i18n.ts.recipient }}</span>
@@ -1255,8 +1255,21 @@ defineExpose({
 }
 
 .withQuote {
-	margin: 0 0 8px 0;
+	display: flex;
+	align-items: center;
+	gap: .2em;
+	margin-inline: 30px;
+	margin-bottom: 12px;
 	color: var(--accent);
+
+	i {
+		display: flex;
+	}
+
+	button {
+		display: flex;
+		padding: 0;
+	}
 }
 
 .toSpecified {
@@ -1433,12 +1446,16 @@ defineExpose({
 		padding: 16px 14px 0 14px;
 	}
 
-	.cw,
-	.hashtags,
-	.text {
-		// padding: 0 16px;
+	.withQuote {
+		margin-inline: 22px;
 	}
 
+	// .cw,
+	// .hashtags,
+	// .text {
+		// padding: 0 16px;
+	// }
+
 	.cw {
 		padding: 0 22px 8px;
 	}