From fbb0907a70a07c746c2acf1e53d5640e67ee5ef3 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Thu, 21 Sep 2023 17:41:27 -0700
Subject: [PATCH] Fix lyrics mask

---
 src/renderer/features/lyrics/synchronized-lyrics.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/renderer/features/lyrics/synchronized-lyrics.tsx b/src/renderer/features/lyrics/synchronized-lyrics.tsx
index 4350d15a..061d1888 100644
--- a/src/renderer/features/lyrics/synchronized-lyrics.tsx
+++ b/src/renderer/features/lyrics/synchronized-lyrics.tsx
@@ -25,6 +25,14 @@ const SynchronizedLyricsContainer = styled.div<{ $gap: number }>`
     overflow: scroll;
     transform: translateY(-2rem);
 
+    -webkit-mask-image: linear-gradient(
+        180deg,
+        transparent 5%,
+        rgb(0 0 0 / 100%) 20%,
+        rgb(0 0 0 / 100%) 85%,
+        transparent 95%
+    );
+
     mask-image: linear-gradient(
         180deg,
         transparent 5%,