From 234fdfcd2d6784dce3c5e76d311a9c1d2618e24c Mon Sep 17 00:00:00 2001
From: usn757 <usn757@gmail.com>
Date: Sat, 7 Jun 2025 23:17:46 +0900
Subject: [PATCH 1/2] =?UTF-8?q?[fix]=20thumbnailContainer=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20firstimage2=20=EC=B6=94=EA=B0=80=ED=95=98=EB=8A=94?=
 =?UTF-8?q?=20=EB=A1=9C=EC=A7=81=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main/resources/static/js/content_detail.js | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/main/resources/static/js/content_detail.js b/src/main/resources/static/js/content_detail.js
index d2b4493..3c5b5c1 100644
--- a/src/main/resources/static/js/content_detail.js
+++ b/src/main/resources/static/js/content_detail.js
@@ -214,12 +214,8 @@ function loadThumbnails(firstImage, firstImage2, additionalImages) {
         addThumbnail(firstImage, (contentDetail.title || "대표") + " 이미지", firstImage, true);
     }
 
-    // 2. 보조 대표 이미지(firstImage2) 추가 (firstImage와 다르고 유효한 경우)
-    if (firstImage2 && firstImage2 !== firstImage) {
-        addThumbnail(firstImage2, (contentDetail.title || "추가") + " 이미지 1", firstImage2);
-    }
 
-    // 3. 추가 이미지 목록(additionalImagesData) 처리
+    // 2. 추가 이미지 목록(additionalImagesData) 처리
     if (additionalImages && additionalImages.length > 0) {
         additionalImages.forEach((image, index) => {
             const imgSrc = image.smallImageUrl || image.originImgUrl; // 썸네일 URL 우선, 없으면 원본 URL 사용

From aa377fc344cd23463aa3e5e97f3c9b01c2db27fb Mon Sep 17 00:00:00 2001
From: usn757 <usn757@gmail.com>
Date: Sat, 7 Jun 2025 23:21:10 +0900
Subject: [PATCH 2/2] =?UTF-8?q?[fix]=20=EC=BD=98=ED=85=90=EC=B8=A0=20?=
 =?UTF-8?q?=EC=83=81=EC=84=B8=20=ED=8E=98=EC=9D=B4=EC=A7=80=EC=9D=98=20?=
 =?UTF-8?q?=EC=8D=B8=EB=84=A4=EC=9D=BC=20=ED=81=AC=EA=B8=B0=20=EC=98=A4?=
 =?UTF-8?q?=EB=A5=98=20=EB=B0=8F=20=ED=83=AD=20=EC=8A=A4=ED=83=80=EC=9D=BC?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/templates/content_detail.html   | 42 +++++++++++++++++--
 1 file changed, 39 insertions(+), 3 deletions(-)

diff --git a/src/main/resources/templates/content_detail.html b/src/main/resources/templates/content_detail.html
index c787b2d..489f556 100644
--- a/src/main/resources/templates/content_detail.html
+++ b/src/main/resources/templates/content_detail.html
@@ -10,11 +10,47 @@
 
     <th:block layout:fragment="css">
         <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"/>
-        <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet"/>
         <link rel="stylesheet" th:href="@{/css/bootstrap-overrides.css}"/>
-        <link rel="stylesheet" th:href="@{/css/search.css}"/>
-    </th:block>
 
+        <style>
+            .nav-tabs {
+                --bs-nav-tabs-border-color: var(--input-border-color);
+                --bs-nav-tabs-link-hover-border-color: var(--input-border-color) var(--input-border-color) var(--point-color);
+                --bs-nav-tabs-link-active-color: var(--accent-color);
+                --bs-nav-tabs-link-active-bg: var(--card-bg-color);
+                --bs-nav-tabs-link-active-border-color: var(--input-border-color) var(--input-border-color) var(--card-bg-color);
+            }
+            .tab-content > .tab-pane {
+                background-color: var(--card-bg-color); /* common.css 변수 */
+                border: 1px solid var(--input-border-color); /* common.css 변수 */
+                border-top: none;
+                padding: 1.5rem;
+                border-radius: 0 0 var(--border-radius-md) var(--border-radius-md); /* common.css 변수 */
+                box-shadow: var(--box-shadow-light); /* common.css 변수 */
+            }
+
+            .nav-link:hover, .nav-link:focus {
+                color: var(--point-color);
+            }
+
+            .nav-tabs .nav-link.active {
+                color: var(--accent-color); /* 활성 탭 텍스트 색상 명확히 */
+                font-weight: bold;
+            }
+            #thumbnailContainer img {
+                height: 80px; /* 썸네일 이미지의 높이를 80px로 강제합니다. */
+                width: auto; /* 너비는 높이에 맞춰 자동으로 조절됩니다. */
+                border-radius: var(--border-radius-sm); /* 둥근 모서리 적용 */
+                cursor: pointer;
+                transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
+            }
+
+            #thumbnailContainer img:hover {
+                transform: scale(1.05); /* 마우스를 올리면 약간 커지는 효과 */
+                box-shadow: var(--box-shadow-cute);
+            }
+        </style>
+    </th:block>
 </head>
 
 <body>