From 0816a8cbbac6c0e202e97d23d081d87899455fbf Mon Sep 17 00:00:00 2001
From: Baynov Ivan <Jhon0@yandex.ru>
Date: Wed, 12 Jun 2024 15:56:04 +0800
Subject: [PATCH] feat: feature to autoplay videos on mobile

---
 src/components/Film.astro | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/Film.astro b/src/components/Film.astro
index 5fc3df0..5c54da7 100644
--- a/src/components/Film.astro
+++ b/src/components/Film.astro
@@ -17,7 +17,15 @@ const { href, img, trailerGif, trailerVideo } = Astro.props;
 		<!-- Можно оптимизировать загрузку шрифта -->
 		<!-- настроить на сервере кэш -->
 		<Image class="static-image" loading="lazy" alt={href} src={img} />
-		<video class="animated-image" muted loop autoplay>
+		<!-- можно со звуком??? -->
+		<video
+			class="animated-image"
+			muted
+			loop
+			autoplay
+			webkit-playsinline
+			playsinline
+		>
 			<source
 				src={`/${import.meta.env.PUBLIC_TRAILER_VIDEOS_PATH}/${trailerVideo}`}
 				type="video/mp4"
@@ -69,5 +77,8 @@ const { href, img, trailerGif, trailerVideo } = Astro.props;
 		visibility: hidden;
 		object-fit: cover;
 		transition: opacity 0.3s ease;
+		@media (hover: none) {
+			visibility: visible;
+		}
 	}
 </style>