Fix opacity mask for unsynced lyrics container

jeffvli · Oct 8, 2023 · 3675146 · 3675146 · vercel · Oct 8, 2023
1 parent 946f4ff
commit 3675146
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/src/renderer/features/lyrics/unsynchronized-lyrics.tsx b/src/renderer/features/lyrics/unsynchronized-lyrics.tsx
@@ -18,6 +18,14 @@ const UnsynchronizedLyricsContainer = 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%,