From af0cbda364e37cd412294a07bf3fcaf9cf6133d9 Mon Sep 17 00:00:00 2001
From: "Alexander \"Arav\" Andreev" <me@arav.su>
Date: Sun, 20 Aug 2023 02:19:04 +0400
Subject: [PATCH] Added -webkit-mask-image to work on Chrome.

---
 web/assets/css/main.css | 1 +
 web/assets/js/main.js   | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/web/assets/css/main.css b/web/assets/css/main.css
index 3d9ee6b..65c9c2f 100644
--- a/web/assets/css/main.css
+++ b/web/assets/css/main.css
@@ -138,6 +138,7 @@ section { margin-top: 1rem; }
 #play {
 	background-color: var(--primary-color);
 	mask-image: url(/assets/img/play.svg);
+	-webkit-mask-image: url(/assets/img/play.svg);
 	height: 3rem;
 	width: 3rem; }
 
diff --git a/web/assets/js/main.js b/web/assets/js/main.js
index 67b46cf..1cf36c7 100644
--- a/web/assets/js/main.js
+++ b/web/assets/js/main.js
@@ -61,7 +61,10 @@ $("play").addEventListener("click", e => {
 		audio.pause();
 		audio.src = "";
 	}
-	e.target.style.maskImage = audio.paused ? "url(/assets/img/play.svg)" : "url(/assets/img/stop.svg)"; });
+	e.target.style.maskImage = audio.paused ?
+		"url(/assets/img/play.svg)" : "url(/assets/img/stop.svg)";
+	e.target.style.webkitMaskImage = audio.paused ?
+		"url(/assets/img/play.svg)" : "url(/assets/img/stop.svg)"; });
 
 audio.addEventListener("timeupdate", e => {
 	const ct = e.target.currentTime;