From 1292d9069ae53c4e12c8d4090cb48aa5cafb9a3e Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Wed, 5 Aug 2026 21:02:59 +0000 Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20=EB=94=94?= =?UTF-8?q?=EB=A0=89=ED=86=A0=EB=A6=AC=20=EC=A0=9C=EB=AA=A9=20=EB=A0=88?= =?UTF-8?q?=EC=9D=B4=EC=95=84=EC=9B=83=20=EC=95=88=EC=A0=95=EC=84=B1=20?= =?UTF-8?q?=EB=B0=8F=20=EC=8B=9C=EA=B0=81=EC=A0=81=20=EA=B3=84=EC=B8=B5?= =?UTF-8?q?=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .jules/palette.md | 4 ++++ src/main/kotlin/html4tree/main.kt | 27 +++++++++++++++++++-------- 2 files changed, 23 insertions(+), 8 deletions(-) diff --git a/.jules/palette.md b/.jules/palette.md index 7b223901..07913987 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -52,3 +52,7 @@ ## 2024-07-13 - 빈 디렉토리 상태의 접근성(Accessibility) 개선 **Learning:** 정적 파일 서버의 빈 디렉토리 상태는 스크린 리더 사용자에게 컨텐츠 누락으로 오해받을 수 있으며, 시각적으로도 일반 리스트 아이템과 정렬이 맞지 않는 문제가 있었습니다. **Action:** 빈 상태를 나타내는 요소에 `role="status"`를 추가하여 스크린 리더가 명확하게 인지할 수 있도록 하고, 아이콘과 flex 레이아웃을 통해 다른 리스트 아이템과 일관된 시각적 흐름을 제공하도록 합니다. + +## 2026-08-05 - 디렉토리 제목이 너무 긴 경우의 레이아웃 깨짐 방지 및 시각적 계층화 +**Learning:** 띄어쓰기 없는 매우 긴 디렉토리 이름은 모바일 환경 등 제한된 폭에서 컨테이너를 벗어나 레이아웃을 무너뜨리거나 가독성을 저하시킬 수 있습니다. 또한 디렉토리 목록과 제목 간의 시각적 구분이 없으면 정보의 구조를 파악하기 어렵습니다. +**Action:** 긴 제목 텍스트(`

`)에 `word-break: break-all;`을 적용하여 화면을 벗어나지 않도록 하고, 하단 테두리(`border-bottom`) 및 여백을 추가하여 콘텐츠와 명확히 구분되도록 시각적 계층을 부여하십시오. (다크 모드에서의 테두리 색상 처리도 함께 고려) diff --git a/src/main/kotlin/html4tree/main.kt b/src/main/kotlin/html4tree/main.kt index e93fbea7..6fd2a157 100644 --- a/src/main/kotlin/html4tree/main.kt +++ b/src/main/kotlin/html4tree/main.kt @@ -24,6 +24,14 @@ main { max-width: 800px; margin: 0 auto; } +h1 { + font-size: 1.5rem; + margin-top: 0; + margin-bottom: 1rem; + padding-bottom: 0.5rem; + border-bottom: 1px solid #d0d7de; + word-break: break-all; +} ul { list-style-type: none; padding-left: 0; @@ -59,11 +67,22 @@ a:hover, a:focus-visible { transition: none; } } +.empty-dir { + display: flex; + align-items: flex-start; + gap: 0.5rem; + padding: 0.5rem; + opacity: 0.7; + font-style: italic; +} @media (prefers-color-scheme: dark) { body { background-color: #0d1117; color: #c9d1d9; } + h1 { + border-bottom-color: #21262d; + } a { color: #58a6ff; } @@ -72,14 +91,6 @@ a:hover, a:focus-visible { outline-color: #58a6ff; } } -.empty-dir { - display: flex; - align-items: flex-start; - gap: 0.5rem; - padding: 0.5rem; - opacity: 0.7; - font-style: italic; -} """.trimIndent() private val STYLE_HASH = "sha256-" + Base64.getEncoder().encodeToString(MessageDigest.getInstance("SHA-256").digest(CSS_CONTENT.toByteArray(Charsets.UTF_8))) From ddec65396d46e4252041483ddc03fa72f4d869d7 Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Wed, 5 Aug 2026 21:34:02 +0000 Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20=EB=94=94?= =?UTF-8?q?=EB=A0=89=ED=86=A0=EB=A6=AC=20=EC=A0=9C=EB=AA=A9=20=EB=A0=88?= =?UTF-8?q?=EC=9D=B4=EC=95=84=EC=9B=83=20=EC=95=88=EC=A0=95=EC=84=B1=20?= =?UTF-8?q?=EB=B0=8F=20=EC=8B=9C=EA=B0=81=EC=A0=81=20=EA=B3=84=EC=B8=B5?= =?UTF-8?q?=ED=99=94=20(CI=20=EC=9E=AC=EC=8B=9C=EC=9E=91)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/kotlin/html4tree/main.kt | 1 + 1 file changed, 1 insertion(+) diff --git a/src/main/kotlin/html4tree/main.kt b/src/main/kotlin/html4tree/main.kt index 6fd2a157..b295137b 100644 --- a/src/main/kotlin/html4tree/main.kt +++ b/src/main/kotlin/html4tree/main.kt @@ -406,3 +406,4 @@ fun process_dir(curr_dir: File, excludeSet: Set? = null, dirFiles: Array fun help() { println("ERROR: help has not been written yet!") } +// Trigger CI re-run due to Strix backend failure