From 07417aca1feddd5400db7ba59e90cb2f08656a42 Mon Sep 17 00:00:00 2001
From: VDawg <vdawg@tuta.io>
Date: Tue, 14 Nov 2023 15:45:17 +0100
Subject: [PATCH] pluginSlice fix fullscreen btn with sliding

---
 src/lib/components/Video.svelte |  3 ---
 src/routes/PluginsSlice.svelte  | 35 +++++++++++++++++++--------------
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/src/lib/components/Video.svelte b/src/lib/components/Video.svelte
index e796506..7dc917d 100644
--- a/src/lib/components/Video.svelte
+++ b/src/lib/components/Video.svelte
@@ -3,7 +3,6 @@
 	import PlayIcon from '~icons/mingcute/play-circle-line'
 	import { inview } from 'svelte-inview'
 	import IconFullscreen from '~icons/mingcute/fullscreen-fill'
-	import { onMount } from 'svelte'
 
 	/** @type {string} */
 	export let src
@@ -55,8 +54,6 @@
 		on:pause={() => (isPaused = true)}
 		{autoplay}
 		on:play={() => (isPaused = false)}
-		on:mouseenter
-		on:mouseleave
 	/>
 
 	<button on:click={makeFullscreen} class="absolute bottom-2 left-2 z-10">
diff --git a/src/routes/PluginsSlice.svelte b/src/routes/PluginsSlice.svelte
index 451c23e..487d4dc 100644
--- a/src/routes/PluginsSlice.svelte
+++ b/src/routes/PluginsSlice.svelte
@@ -118,21 +118,26 @@
 				isHoveringVideo && '-translate-x-56'
 			)}
 		>
-			{#each items as { src, poster }, index}
-				<Video
-					{src}
-					{poster}
-					autoplay
-					bind:videoElement={videos[index]}
-					class="z-10 aspect-video h-[inherit] origin-left    rounded-lg object-cover  object-left    shadow-xl shadow-cyan-700/50 outline outline-2 outline-cyan-500 duration-500"
-					hidden={index !== activeIndex}
-					on:pause={pauseVideos}
-					on:play={playVideos}
-					videoClass="h-[inherit] aspect-video"
-					on:mouseenter={slideVideoIn}
-					on:mouseleave={slideVideoOut}
-				/>
-			{/each}
+			<div
+				class="h-full w-full"
+				on:mouseenter={slideVideoIn}
+				on:mouseleave={slideVideoOut}
+				role="complementary"
+			>
+				{#each items as { src, poster }, index}
+					<Video
+						{src}
+						{poster}
+						autoplay
+						bind:videoElement={videos[index]}
+						class="z-10 aspect-video h-[inherit] origin-left    rounded-lg object-cover  object-left    shadow-xl shadow-cyan-700/50 outline outline-2 outline-cyan-500 duration-500"
+						hidden={index !== activeIndex}
+						on:pause={pauseVideos}
+						on:play={playVideos}
+						videoClass="h-[inherit] aspect-video"
+					/>
+				{/each}
+			</div>
 			<div
 				class="pt-5 text-sm font-medium text-slate-300 md:text-base [&>a:hover]:text-cyan-300 [&>a:hover]:underline [&>a]:font-bold"
 			>