From 5bd8d50022326733c0ad5139fe4be0346cb34cfb Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Mon, 12 Jan 2026 18:10:26 +0900
Subject: [PATCH] =?UTF-8?q?PC=20=EA=B3=A1=20=EC=83=81=EC=84=B8:=20?=
 =?UTF-8?q?=EC=A4=91=EB=B3=B5=20=EC=95=A8=EB=B2=94=EC=95=84=ED=8A=B8=20?=
 =?UTF-8?q?=EC=A0=9C=EA=B1=B0,=20=ED=81=B4=EB=A6=AD=20=EC=9D=B4=EB=B2=A4?=
 =?UTF-8?q?=ED=8A=B8=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/pages/pc/public/TrackDetail.jsx | 27 +++++++-------------
 1 file changed, 9 insertions(+), 18 deletions(-)

diff --git a/frontend/src/pages/pc/public/TrackDetail.jsx b/frontend/src/pages/pc/public/TrackDetail.jsx
index bf6d184..0d7204e 100644
--- a/frontend/src/pages/pc/public/TrackDetail.jsx
+++ b/frontend/src/pages/pc/public/TrackDetail.jsx
@@ -2,7 +2,7 @@ import { useState, useMemo } from 'react';
 import { useParams, useNavigate, Link } from 'react-router-dom';
 import { useQuery } from '@tanstack/react-query';
 import { motion } from 'framer-motion';
-import { Clock, User, Music, Mic2, Play, ExternalLink, ChevronRight } from 'lucide-react';
+import { Clock, User, Music, Mic2, ChevronRight } from 'lucide-react';
 import { getTrack } from '../../../api/public/albums';
 
 // 유튜브 URL에서 비디오 ID 추출
@@ -85,19 +85,18 @@ function TrackDetail() {
                 </div>
 
                 {/* 트랙 정보 헤더 */}
-                <div className="flex gap-10 items-start mb-10">
+                <div className="flex gap-8 items-start mb-10">
                     {/* 앨범 커버 */}
                     <motion.div
                         initial={{ opacity: 0, scale: 0.9 }}
                         animate={{ opacity: 1, scale: 1 }}
                         transition={{ duration: 0.4 }}
-                        className="w-56 h-56 rounded-2xl overflow-hidden shadow-lg cursor-pointer group flex-shrink-0"
-                        onClick={() => navigate(`/album/${encodeURIComponent(track.album?.title || albumName)}`)}
+                        className="w-48 h-48 rounded-2xl overflow-hidden shadow-lg flex-shrink-0"
                     >
                         <img
                             src={track.album?.cover_medium_url}
                             alt={track.album?.title}
-                            className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"
+                            className="w-full h-full object-cover"
                         />
                     </motion.div>
 
@@ -119,22 +118,14 @@ function TrackDetail() {
                             </span>
                         </div>
                         
-                        <h1 className="text-4xl font-bold mb-4 text-gray-900">{track.title}</h1>
+                        <h1 className="text-4xl font-bold mb-3 text-gray-900">{track.title}</h1>
                         
-                        {/* 앨범 정보 */}
+                        {/* 앨범 정보 (텍스트만) */}
                         <Link 
                             to={`/album/${encodeURIComponent(track.album?.title || albumName)}`}
-                            className="inline-flex items-center gap-3 mb-4 group"
+                            className="text-gray-500 hover:text-primary transition-colors mb-3 block"
                         >
-                            <img 
-                                src={track.album?.cover_thumb_url} 
-                                alt="" 
-                                className="w-10 h-10 rounded-lg object-cover"
-                            />
-                            <div>
-                                <p className="text-xs text-gray-400">{track.album?.album_type}</p>
-                                <p className="font-medium text-gray-700 group-hover:text-primary transition-colors">{track.album?.title}</p>
-                            </div>
+                            {track.album?.album_type} · {track.album?.title}
                         </Link>
 
                         {/* 재생 시간 */}
@@ -289,7 +280,7 @@ function TrackDetail() {
                                 가사
                             </h2>
                             {track.lyrics ? (
-                                <div className="text-gray-700 leading-[2] whitespace-pre-line text-[15px] max-h-[600px] overflow-y-auto pr-4 scrollbar-thin scrollbar-thumb-gray-200 scrollbar-track-transparent">
+                                <div className="text-gray-700 leading-[2] whitespace-pre-line text-[15px] max-h-[600px] overflow-y-auto pr-4">
                                     {track.lyrics}
                                 </div>
                             ) : (