From 48dc6861ea3e1fde3432bba508fcf221142efed5 Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Tue, 29 Nov 2022 18:25:37 -0800
Subject: [PATCH] fix

---
 package.json                                  |  2 +-
 packages/client/src/components/MkSparkle.vue  | 57 ++++++++++---------
 .../global/MkMisskeyFlavoredMarkdown.vue      |  2 +-
 3 files changed, 32 insertions(+), 29 deletions(-)

diff --git a/package.json b/package.json
index 05e4f5199..97ca67510 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "calckey",
-	"version": "12.119.0-calc.18-rc.1",
+	"version": "12.119.0-calc.18-rc.2",
 	"codename": "aqua",
 	"repository": {
 		"type": "git",
diff --git a/packages/client/src/components/MkSparkle.vue b/packages/client/src/components/MkSparkle.vue
index db38864a3..ba6089ab6 100644
--- a/packages/client/src/components/MkSparkle.vue
+++ b/packages/client/src/components/MkSparkle.vue
@@ -71,38 +71,41 @@ const el = ref<HTMLElement>();
 const width = ref(0);
 const height = ref(0);
 const colors = ['#eb6f92', '#9ccfd8', '#f6c177', '#f6c177', '#f6c177'];
+const reducedQuery = window.matchMedia('(prefers-reduced-motion: reduce)');
 let stop = false;
 let ro: ResizeObserver | undefined;
 
 onMounted(() => {
-	ro = new ResizeObserver((entries, observer) => {
-		width.value = el.value?.offsetWidth + 64;
-		height.value = el.value?.offsetHeight + 64;
-	});
-	ro.observe(el.value);
-	const add = () => {
-		if (stop) return;
-		const x = (Math.random() * (width.value - 64));
-		const y = (Math.random() * (height.value - 64));
-		const sizeFactor = Math.random();
-		const particle = {
-			id: Math.random().toString(),
-			x,
-			y,
-			size: 0.2 + ((sizeFactor / 10) * 3),
-			dur: 1000 + (sizeFactor * 1000),
-			color: colors[Math.floor(Math.random() * colors.length)],
-		};
-		particles.value.push(particle);
-		window.setTimeout(() => {
-			particles.value = particles.value.filter(x => x.id !== particle.id);
-		}, particle.dur - 100);
+	if (!reducedQuery.matches) {
+		ro = new ResizeObserver((entries, observer) => {
+			width.value = el.value?.offsetWidth + 64;
+			height.value = el.value?.offsetHeight + 64;
+		});
+		ro.observe(el.value);
+		const add = () => {
+			if (stop) return;
+			const x = (Math.random() * (width.value - 64));
+			const y = (Math.random() * (height.value - 64));
+			const sizeFactor = Math.random();
+			const particle = {
+				id: Math.random().toString(),
+				x,
+				y,
+				size: 0.2 + ((sizeFactor / 10) * 3),
+				dur: 1000 + (sizeFactor * 1000),
+				color: colors[Math.floor(Math.random() * colors.length)],
+			};
+			particles.value.push(particle);
+			window.setTimeout(() => {
+				particles.value = particles.value.filter(x => x.id !== particle.id);
+			}, particle.dur - 100);
 
-		window.setTimeout(() => {
-			add();
-		}, 500 + (Math.random() * 500));
-	};
-	add();
+			window.setTimeout(() => {
+				add();
+			}, 500 + (Math.random() * 500));
+		};
+		add();
+	}
 });
 
 onUnmounted(() => {
diff --git a/packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue b/packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue
index 5ec3caf67..9077b0152 100644
--- a/packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue
+++ b/packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue
@@ -158,7 +158,7 @@ const props = withDefaults(defineProps<{
 }
 
 @media(prefers-reduced-motion) {
-	div[class^='mfm'], div[class*=' mfm'] {
+	span[class^='mfm'], div[class*=' mfm'] {
 		animation: none;
 	}
 }