Fix opacity mask for unsynced lyrics container

2023-10-07 19:58:04 -07:00 · 2023-10-07 19:58:04 -07:00 · 3675146f1f
commit 3675146f1f
parent 946f4ff306
1 changed files with 8 additions and 0 deletions
--- 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%,