From 7e26daa51b9a022ebb33aa885798672481199cc2 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Fri, 10 Dec 2021 16:15:36 +0900
Subject: [PATCH] =?UTF-8?q?fix(client):=20=E3=82=AF=E3=83=AA=E3=83=83?=
 =?UTF-8?q?=E3=83=97=E3=81=AE=E8=A8=AD=E5=AE=9A=E3=82=92=E7=B7=A8=E9=9B=86?=
 =?UTF-8?q?=E3=81=A7=E3=81=8D=E3=81=AA=E3=81=84=E5=95=8F=E9=A1=8C=E3=82=92?=
 =?UTF-8?q?=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix #8046
---
 CHANGELOG.md                       |  1 +
 packages/client/src/pages/clip.vue | 28 ++++++++++++++++------------
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 777e83ba5c..dacbf969da 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,6 +16,7 @@
 
 ### Bugfixes
 - クライアント: タッチ機能付きディスプレイを使っていてマウス操作をしている場合に一部機能が動作しない問題を修正
+- クライアント: クリップの設定を編集できない問題を修正
 
 ## 12.98.0 (2021/12/03)
 
diff --git a/packages/client/src/pages/clip.vue b/packages/client/src/pages/clip.vue
index e3ceab9eea..077a6ac8b5 100644
--- a/packages/client/src/pages/clip.vue
+++ b/packages/client/src/pages/clip.vue
@@ -1,16 +1,18 @@
 <template>
-<div v-if="clip" class="_section">
-	<div class="okzinsic _content _panel _gap">
-		<div v-if="clip.description" class="description">
-			<Mfm :text="clip.description" :is-note="false" :i="$i"/>
+<MkSpacer :content-max="800">
+	<div v-if="clip">
+		<div class="okzinsic _panel">
+			<div v-if="clip.description" class="description">
+				<Mfm :text="clip.description" :is-note="false" :i="$i"/>
+			</div>
+			<div class="user">
+				<MkAvatar :user="clip.user" class="avatar" :show-indicator="true"/> <MkUserName :user="clip.user" :nowrap="false"/>
+			</div>
 		</div>
-		<div class="user">
-			<MkAvatar :user="clip.user" class="avatar" :show-indicator="true"/> <MkUserName :user="clip.user" :nowrap="false"/>
-		</div>
-	</div>
 
-	<XNotes class="_content _gap" :pagination="pagination" :detail="true"/>
-</div>
+		<XNotes :pagination="pagination" :detail="true"/>
+	</div>
+</MkSpacer>
 </template>
 
 <script lang="ts">
@@ -40,10 +42,11 @@ export default defineComponent({
 			[symbols.PAGE_INFO]: computed(() => this.clip ? {
 				title: this.clip.name,
 				icon: 'fas fa-paperclip',
-				action: {
+				bg: 'var(--bg)',
+				actions: [{
 					icon: 'fas fa-ellipsis-h',
 					handler: this.menu
-				}
+				}],
 			} : null),
 			clip: null,
 			pagination: {
@@ -133,6 +136,7 @@ export default defineComponent({
 <style lang="scss" scoped>
 .okzinsic {
 	position: relative;
+	margin-bottom: var(--margin);
 
 	> .description {
 		padding: 16px;