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(); 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; } }