From b0b587835e77ef9ed1583f739adea4b1617739a0 Mon Sep 17 00:00:00 2001
From: angel <sillyangel3@gmail.com>
Date: Thu, 19 Jun 2025 21:10:18 +0000
Subject: [PATCH] fix: adjust ScrollArea width and add padding for improved
 lyric display

---
 app/components/FullScreenPlayer.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/components/FullScreenPlayer.tsx b/app/components/FullScreenPlayer.tsx
index 499c78c..6d44ebf 100644
--- a/app/components/FullScreenPlayer.tsx
+++ b/app/components/FullScreenPlayer.tsx
@@ -395,7 +395,7 @@ export const FullScreenPlayer: React.FC<FullScreenPlayerProps> = ({ isOpen, onCl
           {showLyrics && lyrics.length > 0 && (
             <div className="flex-1 lg:max-w-md min-h-0" ref={lyricsRef}>
               <div className="h-full flex flex-col">
-                <ScrollArea className="flex-1 min-h-0">
+                <ScrollArea className="flex-1 min-h-0 w-90">
                   <div className="space-y-4 pr-4 px-2">
                     {lyrics.map((line, index) => (
                       <div
@@ -412,7 +412,8 @@ export const FullScreenPlayer: React.FC<FullScreenPlayerProps> = ({ isOpen, onCl
                           wordWrap: 'break-word',
                           overflowWrap: 'break-word',
                           hyphens: 'auto',
-                          paddingBottom: '8px'
+                          paddingBottom: '8px',
+                          paddingLeft: '9px'
                         }}
                       >
                         {line.text || '♪'}