fix(frontend): MkHorizontalSwipeでメニューを閉じるのに2回クリックが必要になる問題を修正

#13055

packages/frontend/src/components/MkHorizontalSwipe.vue

@@ -6,10 +6,10 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <div
 	ref="rootEl"
-	:class="[$style.transitionRoot, (defaultStore.state.animation && $style.enableAnimation)]"
-	@touchstart="touchStart"
-	@touchmove="touchMove"
-	@touchend="touchEnd"
+	:class="[$style.transitionRoot]"
+	@touchstart.passive="touchStart"
+	@touchmove.passive="touchMove"
+	@touchend.passive="touchEnd"
 >
 	<Transition
 		:class="[$style.transitionChildren, { [$style.swiping]: isSwipingForClass }]"
@@ -25,6 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	</Transition>
 </div>
 </template>
+
 <script lang="ts" setup>
 import { ref, shallowRef, computed, nextTick, watch } from 'vue';
 import type { Tab } from '@/components/global/MkPageHeader.tabs.vue';
@@ -154,7 +155,7 @@ function touchEnd(event: TouchEvent) {
 
 	pullDistance.value = 0;
 	isSwiping.value = false;
-	setTimeout(() => {
+	window.setTimeout(() => {
 		isSwipingForClass.value = false;
 	}, 400);
 }
@@ -178,10 +179,11 @@ watch(tabModel, (newTab, oldTab) => {
 </script>
 
 <style lang="scss" module>
-.transitionRoot.enableAnimation {
+.transitionRoot {
 	display: grid;
 	grid-template-columns: 100%;
 	overflow: clip;
+}
 
 .transitionChildren {
 	grid-area: 1 / 1 / 2 / 2;
@@ -202,7 +204,6 @@ watch(tabModel, (newTab, oldTab) => {
 		transform: translateX(calc(-100% - 24px));
 	}
 }
-}
 
 .swiping {
 	transition: transform .2s ease-out;