From 12e76148caa081505e001f443c4df1d38368299d Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Wed, 23 Sep 2026 20:50:13 +0000 Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20=EB=A7=81?= =?UTF-8?q?=ED=81=AC=20=ED=85=8D=EC=8A=A4=ED=8A=B8=EC=9D=98=20=ED=98=B8?= =?UTF-8?q?=EB=B2=84=20=EB=B0=91=EC=A4=84=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?= =?UTF-8?q?=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .jules/palette.md | 4 ++++ CHANGELOG.md | 2 ++ src/main/kotlin/html4tree/main.kt | 6 +++--- src/test/kotlin/html4tree/GeneratedIndexReadabilityTest.kt | 4 ++-- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/.jules/palette.md b/.jules/palette.md index 604d7810..bfcd5aac 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -73,3 +73,7 @@ ## 2026-08-17 - 브라우저 번역과 화면 판독기의 호환성을 위한 텍스트 처리 **Learning:** `aria-label` 속성으로 지정된 화면 판독기용 대체 텍스트는 Chrome Translate 등 브라우저 번역 도구에 의해 번역되지 않는 경우가 많습니다. 이로 인해 문서 언어가 변환되어도 스크린 리더에서는 원본 언어(예: 영어)로 읽혀 다국어 접근성이 저하됩니다. **Action:** 화면 판독기를 위한 숨겨진 설명 텍스트를 제공할 때 `aria-label` 대신 CSS `.visually-hidden` 클래스를 적용한 `` 요소를 사용하여, 브라우저가 일반 텍스트로 인식하고 번역할 수 있도록 하여 다국어 접근성 호환성을 확보하십시오. + +## 2024-09-23 - 숨겨진 텍스트로 인한 CSS 스타일링 누수 방지 +**Learning:** 상호작용 요소(예: 링크) 안에서 화면 판독기를 위한 `.visually-hidden` 텍스트를 사용할 때, `span:last-child`와 같은 구조적 선택자를 사용하면 시각적으로 보이지 않는 요소가 마지막 자식으로 인식되어 의도한 요소(텍스트)에 호버 스타일(예: 밑줄)이 적용되지 않거나 숨겨진 요소로 스타일이 누수되는 문제가 발생합니다. +**Action:** 숨겨진 텍스트가 포함된 요소의 상태(hover, focus, active 등)를 스타일링할 때는 구조적 선택자 대신 텍스트 콘텐츠 자체에 명시적인 클래스(예: `.entry-name`)를 부여하고 해당 클래스를 타겟팅하여 스타일 충돌과 누수를 방지하십시오. diff --git a/CHANGELOG.md b/CHANGELOG.md index c442b3b1..e61733e0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,8 @@ All notable changes to this project are documented in this file. ### Fixed +- 시각적으로 숨겨진 화면 판독기용 텍스트에 호버 스타일이 누수되어 실제 파일 이름에 밑줄이 표시되지 않던 문제 수정. + - Generate the inline-style Content Security Policy SHA-256 source expression from the exact normalized UTF-8 stylesheet bytes emitted into each generated `index.html` file, preventing template whitespace from invalidating the policy. diff --git a/src/main/kotlin/html4tree/main.kt b/src/main/kotlin/html4tree/main.kt index 0972fa2c..91e1c503 100644 --- a/src/main/kotlin/html4tree/main.kt +++ b/src/main/kotlin/html4tree/main.kt @@ -56,7 +56,7 @@ a:hover, a:focus-visible { outline: 2px solid #0969da; outline-offset: -2px; } -a:hover span:last-child, a:focus-visible span:last-child { +a:hover .entry-name, a:focus-visible .entry-name { text-decoration: underline; } @media (prefers-reduced-motion: reduce) { @@ -429,7 +429,7 @@ fun process_dir(curr_dir: File, excludeSet: Set? = null, dirFiles: Array

${directoryName.escapeHtml()}