From 98dbbae8f962a0449852a6b4ad1dabfd1715db89 Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Thu, 24 Sep 2026 20:47:42 +0000 Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20hover=20=EC=8B=9C?= =?UTF-8?q?=20=EB=A0=88=EC=9D=B4=EB=B8=94=20=ED=85=8D=EC=8A=A4=ED=8A=B8?= =?UTF-8?q?=EC=97=90=EB=A7=8C=20=EB=B0=91=EC=A4=84=20=EC=A0=81=EC=9A=A9\n\?= =?UTF-8?q?n=F0=9F=92=A1=20What:=20=EB=94=94=EB=A0=89=ED=86=A0=EB=A6=AC?= =?UTF-8?q?=EB=82=98=20=ED=8C=8C=EC=9D=BC=20=EB=AA=A9=EB=A1=9D=EC=9D=98=20?= =?UTF-8?q?=ED=95=AD=EB=AA=A9=EC=9D=84=20=ED=98=B8=EB=B2=84=ED=95=98?= =?UTF-8?q?=EA=B1=B0=EB=82=98=20=ED=8F=AC=EC=BB=A4=EC=8A=A4=ED=95=A0=20?= =?UTF-8?q?=EB=95=8C=20=ED=85=8D=EC=8A=A4=ED=8A=B8=EC=97=90=EB=A7=8C=20?= =?UTF-8?q?=EB=B0=91=EC=A4=84=EC=9D=B4=20=EC=B3=90=EC=A7=80=EB=8F=84?= =?UTF-8?q?=EB=A1=9D=20=EA=B0=9C=EC=84=A0=ED=96=88=EC=8A=B5=EB=8B=88?= =?UTF-8?q?=EB=8B=A4.\n=F0=9F=8E=AF=20Why:=20=EC=9D=B4=EC=A0=84=EC=97=90?= =?UTF-8?q?=20=EC=8A=A4=ED=81=AC=EB=A6=B0=EB=A6=AC=EB=8D=94=EB=A5=BC=20?= =?UTF-8?q?=EC=9C=84=ED=95=9C=20=EC=A0=91=EA=B7=BC=EC=84=B1=20=ED=85=8D?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8(.visually-hidden)=EA=B0=80=20=EC=88=A8?= =?UTF-8?q?=EA=B2=A8=EC=A7=84=20=EC=83=81=ED=83=9C=EC=97=90=EC=84=9C=20?= =?UTF-8?q?=EA=B5=AC=EC=A1=B0=20=EC=84=A0=ED=83=9D=EC=9E=90(span:last-chil?= =?UTF-8?q?d)=EC=97=90=20=EC=9D=98=EC=A1=B4=ED=95=98=EA=B3=A0=20=EC=9E=88?= =?UTF-8?q?=EC=96=B4=20=EC=9D=98=EB=8F=84=EC=B9=98=20=EC=95=8A=EA=B2=8C=20?= =?UTF-8?q?=EB=A7=88=EC=A7=80=EB=A7=89=20=ED=95=AD=EB=AA=A9=EC=97=90=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=EC=9D=B4=20=EC=A0=81=EC=9A=A9?= =?UTF-8?q?=EB=90=98=EB=8A=94=20=EB=AC=B8=EC=A0=9C=EB=A5=BC=20=EB=B0=A9?= =?UTF-8?q?=EC=A7=80=ED=95=98=EA=B8=B0=20=EC=9C=84=ED=95=A8=EC=9E=85?= =?UTF-8?q?=EB=8B=88=EB=8B=A4.\n=F0=9F=93=B8=20Before/After:=20=ED=95=B4?= =?UTF-8?q?=EB=8B=B9=20=ED=8C=8C=EC=9D=BC=20=EC=9D=B4=EB=A6=84=20=ED=85=8D?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8(span.entry-label)=EC=97=90=EB=A7=8C=20?= =?UTF-8?q?=EB=AA=85=EC=8B=9C=EC=A0=81=EC=9C=BC=EB=A1=9C=20=ED=81=B4?= =?UTF-8?q?=EB=9E=98=EC=8A=A4=EB=A5=BC=20=EC=B6=94=EA=B0=80=ED=95=98?= =?UTF-8?q?=EC=97=AC=20=EB=B0=91=EC=A4=84=EC=9D=84=20=EC=A0=81=EC=9A=A9?= =?UTF-8?q?=EC=8B=9C=ED=82=B5=EB=8B=88=EB=8B=A4.\n=E2=99=BF=20Accessibilit?= =?UTF-8?q?y:=20=EC=8B=9C=EA=B0=81=EC=A0=81=20=ED=94=BC=EB=93=9C=EB=B0=B1?= =?UTF-8?q?=EC=9D=84=20=EB=B3=B4=EB=8B=A4=20=EC=A0=95=ED=99=95=ED=95=9C=20?= =?UTF-8?q?=EC=9A=94=EC=86=8C(entry-label)=EC=97=90=20=ED=83=80=EA=B2=9F?= =?UTF-8?q?=ED=8C=85=ED=95=98=EC=97=AC=20=ED=98=BC=EB=9E=80=EC=9D=84=20?= =?UTF-8?q?=EB=B0=A9=EC=A7=80=ED=95=98=EA=B3=A0=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EA=B0=80=EB=8F=85=EC=84=B1=EC=9D=84=20=EA=B0=9C=EC=84=A0?= =?UTF-8?q?=ED=96=88=EC=8A=B5=EB=8B=88=EB=8B=A4.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .jules/palette.md | 7 +++++++ src/main/kotlin/html4tree/main.kt | 6 +++--- src/test/kotlin/html4tree/GeneratedIndexReadabilityTest.kt | 2 +- 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/.jules/palette.md b/.jules/palette.md index 604d7810..e065e44d 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -73,3 +73,10 @@ ## 2026-08-17 - 브라우저 번역과 화면 판독기의 호환성을 위한 텍스트 처리 **Learning:** `aria-label` 속성으로 지정된 화면 판독기용 대체 텍스트는 Chrome Translate 등 브라우저 번역 도구에 의해 번역되지 않는 경우가 많습니다. 이로 인해 문서 언어가 변환되어도 스크린 리더에서는 원본 언어(예: 영어)로 읽혀 다국어 접근성이 저하됩니다. **Action:** 화면 판독기를 위한 숨겨진 설명 텍스트를 제공할 때 `aria-label` 대신 CSS `.visually-hidden` 클래스를 적용한 `` 요소를 사용하여, 브라우저가 일반 텍스트로 인식하고 번역할 수 있도록 하여 다국어 접근성 호환성을 확보하십시오. + +## 2024-09-24 - hover 시 레이블 텍스트에만 밑줄 적용 +**Learning:** +아이콘을 포함한 파일/디렉토리 링크에 hover나 focus-visible 이벤트를 발생시킬 때, a 태그 내의 span 요소들이 여러 개일 수 있습니다. +이 경우 단순하게 `span:last-child` 같은 구조 선택자를 사용하면 스크린 리더용 숨김 텍스트(.visually-hidden)에 효과가 적용되는 문제가 발생할 수 있습니다. +**Action:** +동적이고 명시적인 의도를 표현하기 위해 특정 요소 (예: `.entry-label`)에만 스타일을 적용하도록 구조를 개선합니다. 앞으로는 `.entry-label` 처럼 의미를 가진 클래스를 추가하여 명확한 타겟을 가지도록 설계해야 합니다. diff --git a/src/main/kotlin/html4tree/main.kt b/src/main/kotlin/html4tree/main.kt index 0972fa2c..3bfcbfe1 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-label, a:focus-visible .entry-label { 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()}