From 68a0f8981629669215eed10dc633ecf66e3cfa78 Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Sat, 4 Apr 2026 13:14:36 +0900
Subject: [PATCH] =?UTF-8?q?fix(app):=20=EA=B3=A1=20=EC=83=81=EC=84=B8=20?=
 =?UTF-8?q?=ED=99=94=EB=A9=B4=20UI=20=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 액션바 제목 '트랙' → '앨범'
- YouTube 버튼: 빨간 배경 + 흰색 글씨로 변경
- 각 섹션(헤더, 영상, 크레딧, 가사)에 흰색 카드 배경 추가
- 앨범 이름 ellipsis 제거 (줄바꿈 허용)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 app/lib/views/album/track_detail_view.dart | 55 +++++++++++++++-------
 1 file changed, 38 insertions(+), 17 deletions(-)

diff --git a/app/lib/views/album/track_detail_view.dart b/app/lib/views/album/track_detail_view.dart
index 3c9f0d5..8053bbc 100644
--- a/app/lib/views/album/track_detail_view.dart
+++ b/app/lib/views/album/track_detail_view.dart
@@ -72,7 +72,7 @@ class _TrackDetailViewState extends State<TrackDetailView> {
           icon: const Icon(LucideIcons.arrowLeft),
           onPressed: () => context.pop(),
         ),
-        title: const Text('트랙', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
+        title: const Text('앨범', style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
       ),
       body: FutureBuilder<TrackDetail>(
         future: _trackFuture,
@@ -162,8 +162,13 @@ class _TrackHeader extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
+    return Container(
+      margin: const EdgeInsets.fromLTRB(16, 16, 16, 8),
       padding: const EdgeInsets.all(16),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12),
+      ),
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
@@ -255,8 +260,6 @@ class _TrackHeader extends StatelessWidget {
                     fontSize: 13,
                     color: AppColors.textSecondary,
                   ),
-                  maxLines: 1,
-                  overflow: TextOverflow.ellipsis,
                 ),
                 const SizedBox(height: 8),
                 // 재생 시간
@@ -300,8 +303,13 @@ class _MusicVideoSection extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
+    return Container(
+      margin: const EdgeInsets.fromLTRB(16, 0, 16, 8),
+      padding: const EdgeInsets.all(16),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12),
+      ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
@@ -343,17 +351,20 @@ class _MusicVideoSection extends StatelessWidget {
               ),
             ),
           ),
-          const SizedBox(height: 8),
+          const SizedBox(height: 10),
           // YouTube에서 보기 버튼
           SizedBox(
             width: double.infinity,
-            child: TextButton.icon(
+            child: ElevatedButton.icon(
               onPressed: onTap,
-              icon: const Icon(LucideIcons.externalLink, size: 14),
-              label: const Text('YouTube에서 보기', style: TextStyle(fontSize: 13)),
-              style: TextButton.styleFrom(
-                foregroundColor: Colors.red,
-                padding: const EdgeInsets.symmetric(vertical: 8),
+              icon: const Icon(LucideIcons.youtube, size: 18),
+              label: const Text('YouTube에서 보기', style: TextStyle(fontSize: 13, fontWeight: FontWeight.w500)),
+              style: ElevatedButton.styleFrom(
+                backgroundColor: Colors.red,
+                foregroundColor: Colors.white,
+                padding: const EdgeInsets.symmetric(vertical: 12),
+                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+                elevation: 0,
               ),
             ),
           ),
@@ -377,8 +388,13 @@ class _CreditSection extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
+    return Container(
+      margin: const EdgeInsets.fromLTRB(16, 0, 16, 8),
+      padding: const EdgeInsets.all(16),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12),
+      ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
@@ -519,8 +535,13 @@ class _LyricsSection extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.symmetric(horizontal: 16),
+    return Container(
+      margin: const EdgeInsets.fromLTRB(16, 0, 16, 8),
+      padding: const EdgeInsets.all(16),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12),
+      ),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [