From 6157616b37b6aad9152f9cfc3fa943c52ff46316 Mon Sep 17 00:00:00 2001
From: mappi <mappi@mizuiromoon.com>
Date: Mon, 3 Jul 2023 11:27:56 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20sparkle=E5=86=85=E3=81=AB?=
 =?UTF-8?q?=E3=83=AA=E3=83=B3=E3=82=AF=E3=82=92=E5=85=A5=E3=82=8C=E3=82=8B?=
 =?UTF-8?q?=E3=81=A8=E3=82=AF=E3=83=AA=E3=83=83=E3=82=AF=E4=B8=8D=E8=83=BD?=
 =?UTF-8?q?=E3=81=AB=E3=81=AA=E3=82=8B=E5=95=8F=E9=A1=8C=E3=81=AE=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3=20(#11075)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* wip

* Fix 11021
---
 CHANGELOG.md                                   | 1 +
 packages/frontend/src/components/MkSparkle.vue | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 72c4f53d18..e7f900509b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,6 +20,7 @@
 
 ### Client
 - Fix: サーバーメトリクスが90度傾いている
+- Fix: sparkle内にリンクを入れるとクリック不能になる問題の修正
 
 ## 13.13.2
 
diff --git a/packages/frontend/src/components/MkSparkle.vue b/packages/frontend/src/components/MkSparkle.vue
index ba1493aa71..51d70822d3 100644
--- a/packages/frontend/src/components/MkSparkle.vue
+++ b/packages/frontend/src/components/MkSparkle.vue
@@ -32,7 +32,8 @@
 		</path>
 	</svg>
 	-->
-	<svg v-for="particle in particles" :key="particle.id" :width="width" :height="height" :viewBox="`0 0 ${width} ${height}`" xmlns="http://www.w3.org/2000/svg" style="position: absolute; top: -32px; left: -32px;">
+	<!-- MFMで上位レイヤーに表示されるため、リンクをクリックできるようにstyleにpointer-events: none;を付与。 -->
+	<svg v-for="particle in particles" :key="particle.id" :width="width" :height="height" :viewBox="`0 0 ${width} ${height}`" xmlns="http://www.w3.org/2000/svg" style="position: absolute; top: -32px; left: -32px; pointer-events: none;">
 		<path
 			style="transform-origin: center; transform-box: fill-box;"
 			:transform="`translate(${particle.x} ${particle.y})`"
@@ -115,6 +116,5 @@ onUnmounted(() => {
 .root {
 	position: relative;
 	display: inline-block;
-	pointer-events: none;
 }
 </style>