From 0bb07b5e03fd13eb77280a09c642c92e6718af22 Mon Sep 17 00:00:00 2001
From: zenn <zenn.message@gmail.com>
Date: Fri, 12 Jun 2026 15:59:43 +0900
Subject: [PATCH] =?UTF-8?q?=EA=B2=8C=EC=8B=9C=EB=AC=BC=20=EC=83=81?=
 =?UTF-8?q?=EC=84=B8=20=EB=AA=A9=EC=B0=A8=20=ED=95=AD=EB=AA=A9=20=EB=86=92?=
 =?UTF-8?q?=EC=9D=B4=EB=A5=BC=20=EC=B5=9C=EC=86=8C=2024px=EB=A1=9C=20?=
 =?UTF-8?q?=EC=A1=B0=EC=A0=95=20(v1.5.104)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

2줄 이상 제목에서 활성 표시선과 텍스트 정렬이 틀어지지 않도록 목차 항목과 활성 라인 높이 처리를 수정했다.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 components/site/RightSidebar.vue | 6 +++---
 docs/changelog.md                | 4 ++++
 docs/deploy.md                   | 7 ++++++-
 docs/spec.md                     | 2 +-
 docs/update.md                   | 4 ++++
 package.json                     | 2 +-
 6 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/components/site/RightSidebar.vue b/components/site/RightSidebar.vue
index 0be824a..70011b6 100644
--- a/components/site/RightSidebar.vue
+++ b/components/site/RightSidebar.vue
@@ -421,11 +421,11 @@ watch([postTocItems, () => route.fullPath], async () => {
             <li
               v-for="item in postTocItems"
               :key="item.id"
-              class="right-sidebar__toc-item relative flex h-6 items-center transition-colors"
+              class="right-sidebar__toc-item relative flex min-h-6 items-center transition-colors"
               :class="activeTocId === item.id ? 'right-sidebar__toc-item--active' : ''"
             >
               <a
-                class="right-sidebar__toc-link site-interactive flex h-full items-center rounded-md pr-3 text-sm leading-snug transition-colors hover:text-[var(--site-accent)]"
+                class="right-sidebar__toc-link site-interactive flex min-h-6 w-full items-center rounded-md pr-3 text-sm leading-snug transition-colors hover:text-[var(--site-accent)]"
                 :class="{
                   'bg-[var(--site-panel)] text-[var(--site-accent)] font-semibold': activeTocId === item.id,
                   'text-[var(--site-text)]': activeTocId !== item.id,
@@ -528,7 +528,7 @@ watch([postTocItems, () => route.fullPath], async () => {
   left: -2px;
   top: 50%;
   width: 3px;
-  height: 24px;
+  height: 100%;
   background: var(--site-accent);
   transform: translateY(-50%);
 }
diff --git a/docs/changelog.md b/docs/changelog.md
index 8a0bd1b..965cc14 100644
--- a/docs/changelog.md
+++ b/docs/changelog.md
@@ -1,5 +1,9 @@
 # 업데이트 요약
 
+## v1.5.104
+
+- 게시물 상세 목차에서 긴 제목이 2줄 이상으로 표시되어도 활성 왼쪽 라인이 항목 높이에 맞게 표시되도록 조정했다.
+
 ## v1.5.103
 
 - 게시물 상세 목차의 활성 왼쪽 라인을 scoped CSS로 직접 그려 표시 안정성을 높였다.
diff --git a/docs/deploy.md b/docs/deploy.md
index 582a371..49e0a30 100644
--- a/docs/deploy.md
+++ b/docs/deploy.md
@@ -1,6 +1,6 @@
 # 배포 가이드
 
-> 로컬 기준 v1.5.103에서 `npm run lint` 검증을 통과했다. NAS 실제 컨테이너 기동과 도메인/프록시 접속 검증은 운영 배포 단계에서 진행한다.
+> 로컬 기준 v1.5.104에서 `npm run lint` 검증을 통과했다. NAS 실제 컨테이너 기동과 도메인/프록시 접속 검증은 운영 배포 단계에서 진행한다.
 
 ## 빌드 유형
 
@@ -16,6 +16,11 @@
 
 ## 로컬 개발
 
+### v1.5.104 참고
+
+- 추가 DB 마이그레이션은 없다.
+- 게시물 상세 목차에서 2줄 이상 제목의 활성 표시선이 항목 높이에 맞춰 표시되는지 확인한다.
+
 ### v1.5.103 참고
 
 - 추가 DB 마이그레이션은 없다.
diff --git a/docs/spec.md b/docs/spec.md
index 8159345..2f0945e 100644
--- a/docs/spec.md
+++ b/docs/spec.md
@@ -84,7 +84,7 @@
 - 표준 마크다운 표(`| 헤더 | ... |`, `| --- | ... |`)는 본문에서 가로 스크롤 가능한 HTML table로 렌더링한다. 정렬 구분선(`:---`, `:---:`, `---:`)은 각각 좌/중앙/우 정렬로 반영한다.
 - 인용문(`>`)은 왼쪽 세로 막대형 기본 스타일로 표시한다. 기본 인용 텍스트는 라이트·다크 모드 모두 사이트 본문 텍스트 색상(`--site-text`)을 따른다. 첫 줄 옵션 `> [!bg=blue]` 또는 `> {bg=blue}`는 인용 막대 색상으로 반영하며, 지원 값은 콜아웃과 같은 `gray`, `blue`, `green`, `yellow`, `red`, `purple`이다.
 - 관리자 Markdown-first 글쓰기의 오른쪽 블록 설정 패널은 인용·콜아웃·코드 블록·토글 설정을 지원한다. 콜아웃은 제목·아이콘 표시 여부·아이콘·배경색, 코드 블록은 언어·줄번호 표시 여부, 토글은 기본 펼침·닫힘 상태를 선언 줄에 저장한다. 콜아웃 아이콘은 라이브·공개 화면 모두 왼쪽 상단에 배치하고, 아이콘·제목 헤더 아래에 본문을 줄바꿈해 표시한다. 아이콘 미사용 시 자리 표시자를 남기지 않는다. 라이브 문단에서는 `>` 입력으로 인용, ``` Enter로 코드 블록, `!!!` Enter로 콜아웃을 만들 수 있고, `/표` 또는 `/table` 슬래시 명령으로 기본 3열 표 마크다운을 삽입한다. 소스·라이브 모드 모두 `Cmd/Ctrl+K`로 링크 마크다운을 삽입한다. 라이브 코드·인용·콜아웃·토글 블록은 맨 위/맨 아래 방향키로 외부 기본 문단을 만들며 빠져나올 수 있고, 인용 첫 글자 앞 Backspace는 일반 문단으로 되돌린다. 한글 등 IME 조합 입력 중에는 줄바꿈 직후 블록 판별이 일시적으로 비어도 마지막 블록 컨텍스트를 유지해 설정 패널이 닫히지 않게 한다.
-- 게시물 상세의 오른쪽 사이드바는 데스크톱에서 블로그 소개·Follow·추천 사이트 대신 본문 H1~H3 제목 기반 목차를 최상단에 표시한다. 목차는 별도 최대 높이와 내부 스크롤을 두지 않고 전체 목록이 먼저 펼쳐지며, 왼쪽 기준선과 브랜드 컬러 활성 항목 표시선을 둔다. 목차 항목은 24px 높이와 세로 중앙 정렬을 사용하며, 활성 표시선은 항목의 가상 요소 배경 막대로 그려 텍스트 시작점이 밀리지 않게 한다. 목차 링크는 본문 제목에 부여된 앵커 ID로 부드럽게 이동하며, 고정 상단 헤더 높이와 여백을 반영해 제목이 화면 밖에 걸리지 않게 한다. 본문 스크롤 중에는 현재 제목에 해당하는 목차 항목을 강조하고, 목차 항목이 많으면 오른쪽 사이드바 스크롤이 활성 항목을 따라간다. 본문 제목이 없으면 목차 없음 문구를 표시한다. 오른쪽 사이드바가 본문 아래로 내려가는 모바일 폭에서는 목차를 숨긴다. 게시물 상세에서는 일반 오른쪽 사이드 광고 대신 게시물 사이드 광고 코드를 목차 아래에 표시하고, 왼쪽 사이드바에는 게시물 광고를 표시하지 않는다. 게시물 상세 목차와 게시물 사이드 광고 슬롯은 하단 구분선을 표시하지 않는다.
+- 게시물 상세의 오른쪽 사이드바는 데스크톱에서 블로그 소개·Follow·추천 사이트 대신 본문 H1~H3 제목 기반 목차를 최상단에 표시한다. 목차는 별도 최대 높이와 내부 스크롤을 두지 않고 전체 목록이 먼저 펼쳐지며, 왼쪽 기준선과 브랜드 컬러 활성 항목 표시선을 둔다. 목차 항목은 최소 24px 높이와 세로 중앙 정렬을 사용하며, 2줄 이상 제목에서는 항목 높이에 맞춰 활성 표시선도 함께 늘어난다. 활성 표시선은 항목의 가상 요소 배경 막대로 그려 텍스트 시작점이 밀리지 않게 한다. 목차 링크는 본문 제목에 부여된 앵커 ID로 부드럽게 이동하며, 고정 상단 헤더 높이와 여백을 반영해 제목이 화면 밖에 걸리지 않게 한다. 본문 스크롤 중에는 현재 제목에 해당하는 목차 항목을 강조하고, 목차 항목이 많으면 오른쪽 사이드바 스크롤이 활성 항목을 따라간다. 본문 제목이 없으면 목차 없음 문구를 표시한다. 오른쪽 사이드바가 본문 아래로 내려가는 모바일 폭에서는 목차를 숨긴다. 게시물 상세에서는 일반 오른쪽 사이드 광고 대신 게시물 사이드 광고 코드를 목차 아래에 표시하고, 왼쪽 사이드바에는 게시물 광고를 표시하지 않는다. 게시물 상세 목차와 게시물 사이드 광고 슬롯은 하단 구분선을 표시하지 않는다.
 - 제목 우측 공유 버튼을 누르면 게시물 공유 모달을 연다.
 - 로그인 회원 ID가 게시물 `author_id`와 같으면 제목 우측 공유 버튼 옆에 수정 아이콘을 표시하며, 클릭 시 `/admin/posts/:id` 편집 화면을 새 탭으로 연다.
 - 공유 모달은 게시물 썸네일/제목/요약 미리보기, X/Bluesky/Facebook/LinkedIn/Email 링크, 링크 복사 액션을 제공한다.
diff --git a/docs/update.md b/docs/update.md
index ebae751..46b4de9 100644
--- a/docs/update.md
+++ b/docs/update.md
@@ -1,5 +1,9 @@
 # 업데이트 이력
 
+## v1.5.104
+
+- 게시물 상세 목차: 2줄 이상 제목에서 활성 표시선과 텍스트 정렬이 틀어지지 않도록 항목 높이를 최소 24px 기준으로 수정.
+
 ## v1.5.103
 
 - 게시물 상세 목차: 활성 표시선을 Tailwind 가상 요소 유틸 대신 scoped CSS `::before`로 직접 그리도록 수정.
diff --git a/package.json b/package.json
index 6761183..df53e9d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sori.studio",
-  "version": "1.5.103",
+  "version": "1.5.104",
   "private": true,
   "type": "module",
   "imports": {